THT is in early Beta. We welcome contributors & feedback.

JavaScript Plugins

THT comes with a few small JavaScript plugins that you can include on your site.

Just call the Js.plugin function at the bottom of your HTML body.

colorCode 

Apply automatic syntax highlighting to <pre> blocks on the current page.

template yourHtml() {

    <pre>>>
        let num = 123;
        let string = 'abcdef';
    </>

    // bottom of page ...

    {{ Js.plugin('colorCode') }}

    // Optional 2nd theme argument.
    // Supported themes: light (default), dark
    {{ Js.plugin('colorCode', 'dark') }}
}

lazyLoadImages 

Only load images with data-src attributes when they are about to enter the user’s viewport.

This improves client-side performance, because images are only loaded if they will actually be seen by the user.

template yourHtml() {

    <img data-src="path/to/image.png" />

    // bottom of page ...

    {{ Js.plugin('lazyLoadImages'); }}
}