Experimental Code Splitting 🔪📦

Can’t wait to test the new beta! this is looking awesome :smiley: :smiley:

1 Like

But then what about caching by a reverse proxy or serving your modules via a CDN?


You’re getting at some interesting tradeoffs that I’m happy to discuss.

In short, the server-side logic for resolving dependencies of requested modules is more complex than a traditional CDN or proxy can understand. At best, the client could ask the module server for a set of module URLs to fetch, then fetch those modules via HTTP (with traditional caching). However, that would involve extra round trips, which is something I’m hoping to avoid.

The good news:

  • Previously fetched modules will be cached in IndexedDB (or local storage) on the client, so the module server can avoid sending back unchanged module code.
  • The module server will be stateless (clients tell the server what dynamic modules they already have), so you could (in principle) run multiple instances of the module server and load balance between them. In fact, scaling to additional containers on Galaxy will spread the load automatically.
  • The module server sends back exactly the modules the client needs, rather than sending back pre-built bundles. Bundles are easier to cache on a CDN, but you would need a combinatorial explosion of bundles to eliminate any duplication of modules between bundles.
  • In the future, HTTP/2 Server Push might be a good way to implement dynamic module delivery, but it’s not required by the current implementation, and it seems unnecessarily complicated for what I’m trying to do.

Hope this is implemented in meteor as it’s default behavior, right know meteor loads a massive js even if you don’t navigate to all the pages so a lot of js gets unused

Hey @benjamn, your work on support for dynamic import(...) is open source?
I’ll love to have a look on what you’re doing and perhaps help in some way.
Thank you.

1 Like

It is now! https://github.com/meteor/meteor/pull/8327#issuecomment-278432593


Wow! That’s awesome Benjamn! I’ll try it right now.

@klaussner, I would like to crate dynamic remove doc from collection.

// Methods
export const dynamicRemove = new ValidatedMethod({
    name: 'dynamicRemove',
    mixins: [CallPromiseMixin],
    validate: null,
    async run({path, selector}) {
        const Collection = await import(path);
        return Collection.remove(selector);

// Call
dynamicRemove.callPromise({path: '../api/posts/posts', selector}).then((result) => {
            ........... Success
        }).catch((err) => {

Get error

Exception while invoking method 'dynamicRemove' TypeError: Collection.remove is not a function
I20170330-08:21:35.310(7)?     at [object Object]._callee$ (imports/modules/dynamicRemove.js:24:27)
I20170330-08:21:35.310(7)?     at tryCatch (/Users/theara/Desktop/meteor-app/react-material/node_modules/regenerator-runtime/runtime.js:64:40)
I20170330-08:21:35.311(7)?     at GeneratorFunctionPrototype.invoke [as _invoke] (/Users/theara/Desktop/meteor-app/react-material/node_modules/regenerator-runtime/runtime.js:299:22)
I20170330-08:21:35.313(7)?     at GeneratorFunctionPrototype.prototype.(anonymous function) [as next] (/Users/theara/Desktop/meteor-app/react-material/node_modules/regenerator-runtime/runtime.js:116:21)
I20170330-08:21:35.313(7)?     at tryCatch (/Users/theara/Desktop/meteor-app/react-material/node_modules/regenerator-runtime/runtime.js:64:40)
I20170330-08:21:35.314(7)?     at invoke (/Users/theara/Desktop/meteor-app/react-material/node_modules/regenerator-runtime/runtime.js:154:20)
I20170330-08:21:35.315(7)?     at /Users/theara/Desktop/meteor-app/react-material/node_modules/regenerator-runtime/runtime.js:164:13
I20170330-08:21:35.315(7)?     at /Users/theara/.meteor/packages/promise/.