IIFE generator
$async IIFE generator enables to easily create a pre-concatenated selection of
$async modules that is additionally optimized using Google Closure Compiler.What is IIFE?
IIFE or Immediately-invoked Function Expressions is a coding pattern for loading a script. An IIFE can be used in the browser safely.
Example
1
<script async src="js/async-iife.js" data-c='[
2
[
3
"css/sheet1.css",
4
{
5
"href": "https://cdn.com/css/sheet2.css",
6
"render_timing": "requestAnimationFrame"
7
}
8
]
9
]'></script>
Copied!
The IIFE can be optmized using Google Closure Compiler with Advanced Optimizations for optimal compression.
The Node.js module can be executed as a CLI program from the command-line.
Install
1
npm install @style.tools/async-iife
Copied!
Usage
CLI
The provided iife-cli.js script can be used from the command-line. The NPM package contains a
npm run iife script.Examples
Display usage information and a list with available modules.
1
npm run iife -- --help
Copied!
CLI program help
The following command shows how to create an IIFE with
unary format, output to path/to/iife.js and with 3 modules that automatically load the required dependencies.1
npm run iife -- --format unary --compress --output path/to/iife.js --modules css-loader,localstorage,timing
Copied!
Short flags and a space separated module list are supported.
1
npm run iife -- -f unary -c -o path/to/iife.js -m "css-loader localstorage timing"
Copied!
When omitting the
--output flag the script is printed to the console, e.g. for > output.js.Node.js module
1
// load Node.js module
2
const iife = require('@style.tools/async-iife');
3
4
// return script text for inlining
5
// uses memory-cache @link https://www.npmjs.com/package/memory-cache
6
iife.generate(['css-loader', 'timing'], {
7
debug: true, // debug sources
8
format: 'unary' // !function(){ ... }()
9
}).then(function(iife_script) {
10
11
// iife_script contains the IIFE script text
12
13
});
14
15
// output to file
16
iife.generate(['css-loader', 'timing'], {
17
compress: true, // Google Closure Compiler API compression
18
format: 'wrap', // (function(){ ... })()
19
output: 'path/to/iife.js',
20
output_stats: true // return { modules:[], size:0, gzip_size:0 }
21
}).then(function(stats) {
22
23
// iife.js written
24
console.log(stats);
25
26
});
Copied!
The Node.js module can be used efficiently within a Node.js CMS. IIFE's are cached in memory using memory-cache.
Warning: the generator depends on the free Google Closure Compiler API that may not be 100% reliable. When using the generator in production it may be an option to use a local Google Closure Compiler service.
Last modified 1yr ago
Copy link