Using defer on frontend for JS Bundle, Libs and custom scripts | Hot-controls and Turbo router

[flyingbaba]

It was mentioned in docs that it is good practise to put scripts in the head of the page with defer attribute. That gives a very good performance boost since the loading of the main scripts is not blocking the rendering of the HTML on a first load.

We are using hot-controls (turbo router) and have scripts inside pages and partials like this:

[resources]
js[] = “path/to/controls.js”

These scripts are loaded prior framework, causing errors then first loaded. (next pjax visits are fine, since the oc. is initialized already)

Need a way to defer load them something like: {% scripts defer %} or {% put scripts defer %}?

Forum link to issue: https://talk.octobercms.com/t/using-defer-for-js-bundle-experiment-performance/3234/3

[daftspunk]

Thanks for reporting this. We'll need to improve the Resources component to introduce a deferred pipeline.

Some possible options to consider:

js[] = "defer:path/to/controls.js"
js[] = "path/to/controls.js?defer=true"
js[] = "path/to/controls.js#defer"
jsDefer[] = "path/to/controls.js"

Also, I noticed that the js[] declaration doesn't support fully qualified URLs...