Rollup.js
/me
Mathieu Breton
CTO at @jsrepublic
What ?
A some kind of JS packager coming from the Future ...
By Bogdan Chadkin
and Oskar Segersvärd
State of art
All packagers bundle entirely the code base, and does not remove the dead code
Features
- Package Node lib and JavaScript Front asset
- Output types : UMD, AMD, CommonJS, ES2015, Global
- Produce smaller bundle than anyone
- JS API, Tools integration, Command line interface
- Design to work with the next standard
- Handle Cyclic dependency
Limitations
- Handle only JavaScript assets
- Works with ES2015 and CommonJS only
- Needs a ES2015 transpiler (Ex: Babel)
How ?
Based on ES2015 and its modules
// api.js
export function getJson(url) { ... }
// main.js
import {getJson} from "./api";
Remove Dead code with Tree-Shaking
Is it efficient ?
Yes! Minified and gzipped, D3 weighs around 58kB Voronoi Tesselation example weighs just 8kB, including the code itself. Depending on which of d3's functions you're actually using, the savings can be even more dramatic.
For commonJS
NPM : rollup-plugin-commonjs
// importer.js
import { named } from './exporter.js';
// exporter.js
module.exports = { named: 42 };// importer.js
const named = require("./exporter").named;
// exporter.js
module.exports = { named: 42 };But prefer ES2015 modules
{
"name": "my-package",
"version": "0.1.0",
"main": "dist/my-package.umd.js",
"jsnext:main": "dist/my-package.es2015.js"
}jsnext:main
In practice
Conclusion
- Not yet production ready ...
- Bugs
- Npm ecosystem needs to evolve
- Handle only ES2015 modules et CommonJS
- It is the future
Thank you
Rollup.js
By Mathieu Breton
