The IIFE generator enables to concatenate a selection of $async modules into an IIFE script that can be used on a website.
<!-- config via an HTML attribute -->
<script async src="js/async-iife.js" data-c='[
[
"css/sheet1.css",
"js/script1.js",
{
"src": "script2.js",
"load_timing": {
"type": "requestAnimationFrame",
"frame": -1 // faster domReady
},
"exec_timing": "requestIdleCallback"
},
{
"href": "sheet2.css"
}
]
]'></script>
The config can be compressed to save size in the HTML (see compressor).
<!-- config compressed -->
<script async src="js/async-iife.js"
data-c='[["css/sheet1.css","js/script1.js",{"5":"script2.js","48":{"2":52,"56":-1},"60":53}]]'></script>
The IIFE generator is available as a Node.js module and CLI program that can be used from the command line.
npm install @style.tools/async-iife
Select the modules that you want to include in the IIFE. Simply save the IIFE script into a file, e.g. js/async-iife.js
and include the file in the HTML of a website.