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

RollupJs

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.

Source

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

github.com/js-republic/rollup-sample

Conclusion

Not yet production ready ...
- Bugs
- Npm ecosystem needs to evolve
Handle only ES2015 modules et CommonJS
It is the future

Thank you

@MatBreton

Rollupjs.org