Bundle arithmetic - commonality and grouping

[guybedford]

The idea is to use * to indicate the shared dependencies operator.

This way I can do:

jspm bundle home * feature1 * feature2 core.js

To create a core bundle containing the common code that is shared throughout the application.

Then we can do:

jspm bundle home - (home * feature1 * feature2) home.js

To create a bundle for each feature, without the common code.

To summarize implementation needs:

• Bracket operators for bundle arithmetic
• * operator.

[raphaelokon]

Is there still help on this one needed? Or is it already WIP?

[guybedford]

Contributions would be very welcome - any issues marked as contributions welcome are not otherwise being worked on.

Just let me know if you want to give it a go and if you need any guidance at all.

[raphaelokon]

Yeah, any guidance would be very helpful – at least where to start as the syntax is new to me (the brackets, the dash and the *asterisk operator).

Until now I just had a few thoughts about the bundling of core and specific bundles.
First observation: The repetition of - (home * feature1 * feature2) for each subsequent bundles is error prone as one need to remember which modules have been already bundled into core.js
This could be mitigated if the core/shared dependencies would itself been manifested inside the config.js or somewhere else to be easily indicated as a common.

Bear with me, I am just few days into jspm but I already love it (hopefully 6to5 default lands soon, I know you are on it ;)) but I am keen to contribute or at least give it a go.

[guybedford]

@interactionist yes perhaps we could consider API variations rather like:

jspm bundle --layers home feature1 feature2 bundle.js

Outputting bundle-home.js, bundle-feature1.js, bundle-feature2.js, bundle-shared.js or something like that?

Or even something like:

  jspm bundle --optimize-pages --name=mybundle home feature1 feature2

Let me know what you think.

[raphaelokon]

Yeah. That sounds sensible. We could even go a step further and mark dependencies as shared/core dependencies on install:

jspm install --common npm:live-server npm:jsonp
// => This installs live-server and jsonp deps and also marks them as a shared/common dependency in the config

One will likely know if a dependency (like jquery or underscore) is being used throughout the application and thus installing it as such from beginning as a common/shared bundle.

And if you export your features like:

jspm bundle --optimize-pages --name=mybundle home feature1 feature2

it should auto-generate the desired feature-bundels + the bundle-common.js

[guybedford]

@interactionist not sure about that - shared dependencies can be derived find for two-layer bundling. It's only for three-layer bundling that there is an optimization problem constraint.

There is also the possibility to trace dynamic System.import statements too.

What I would suggest is that we create this API in SystemJS builder and then expose in jspm like the above.

I've created systemjs/builder#51.

[guybedford]

Moved to systemjs/builder#113.