SFX optimization via rollup

[guybedford]

This is a very first attempt for the simplest of scenarios to use rollup for SFX bundles when everything is ES6.

The next stage will be to widen this to any tree via a zebra striping algorithm variation.

[guybedford]

To apply this to arbitrary trees:

1. Apply zebra striping

2. Within each ES6 layer create a dummy module of its entry points to the layer above of the form:

   import * as A from 'entrypoint-A';
   import * as B from 'entrypoint-B';
   //...
   export {A,B,...}

3. Optimize the zebra stripe from that dummy module into a single ES6 / System.register module with the dependencies of the stripe itself all set as externals.

4. Output the dummy module as a new special unique name

5. Each of the zebra entry points is then output as:

   entry-point-a-optimized.js

   System.register('A', ['dummy-optimized'], function(_export) {
     return {
       setters: [function(module) {
         _export(module.A);
       }],
       execute: function() {}
     };
   });

6. Repeat for further zebra stripes

If there's only one stripe, we can obviously skip all the above.

[guybedford]

This optimization is now functional!

A limitation here is that we need to still handle applying Traceur / Babel in the pipeline which isn't done currently.

One thing that will make this trivial will be separating transpilers out into plugins and then updating this implementation to reflect that.

Waiting on progress there to land this.

[guybedford]

This would need to work by re-running the translate hook of the load record in question, and setting a metadata property say outputFormat = 'esm' to indicate to the plugin that it should output ES modules instead of System.register so we can perform these optimizations.

[amcdnl]

@guybedford do you have any docs for this?

[lookfirst]

👍

[kuraga]

@rollup @systemjs @guybedford
Any news? Can you help, please? At least which tests should we have here?

[guybedford]

@kuraga this requires the new Babel plugin to work properly, so it will take a little while for things to fall into place still.

[guybedford]

This has been merged into #442 for the 0.15 release.

[EisenbergEffect]

@guybedford Just a question about this. Does this process "erase" the modules? For example, after optimizing in this way, can I still call system.import('foo') or is foo's code present but foo's module identification gone?

[guybedford]

@EisenbergEffect it only works on sfx builds, not normal bundles, so only the sfx shell remains, with the optimizations happening internally (sfx modules don't expose their internal modules already).

[EisenbergEffect]

I'm not overly familiar with what the sfx builds actually are that's different from normal I guess.

[guybedford]

@EisenbergEffect we're renaming sfx builds to jspm build and bundle to jspm bundle. The difference is that a bundle is just a network optimization to concatenate modules into a single file, while a build is a static optimization of the dependency tree turning it into a single module. I'll be posting some examples along with the alpha release this weekend :)

[EisenbergEffect]

Gotcha. I think Aurelia apps will continue to use only the bundling, but it may be that the Aurelia library modules and plugins can use jspm build. I'll be interested to see the details on how that works and what the final output is. Thanks!

[kuraga]

SFX build's good for Aurelia's examples (skeleton), isn't it?

[EisenbergEffect]

No. Aurelia requires the module id to not be erased in order for things like the router and view location to work.