FredKSchott / create-snowpack-app

The all-in-one app template for Snowpack. [moved]

Home Page:https://www.snowpack.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[plugin-webpack] granular chunking for multi-page apps?

mxmul opened this issue · comments

After #171 is merged, this plugin will be able to bundle multi-page apps for production. It's currently using the default splitChunks config however, which means that libraries/frameworks used by multiple entry points will be bundled into each entry chunk separately (e.g. if you navigate to /home then /blog on a site that requires React, you may end up downloading React twice).

For multi-page applications, it could be really helpful to use a granular chunking strategy by default, similar to Next.js and Gatsby. These are the heuristics that Next uses to reduce duplication across chunks:

  • Any sufficiently large third-party module (greater than 160 KB) is split into its own individual chunk
  • A separate frameworks chunk is created for framework dependencies (react, react-dom, and so on)
  • As many shared chunks as needed are created (up to 25)
  • The minimum size for a chunk to be generated is changed to 20 KB

I'm currently able to implement this in my own applications by extending the default Webpack config with args.extendConfig, but maybe this is worth making a default? Perhaps only for builds with multiple entry points?