Experimental Code Splitting 🔪📦

packages
22

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

1 Like
23

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

2 Likes
24

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.
21 Likes
25

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

26

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
27

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

3 Likes
28

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

29

@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) => {
            console.log(err.reason);
        });

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/.0.8.8.1mes7d8++os+web.browser+web.cordova/npm/node_modules/meteor-promise/fiber_pool.js:32:39