I had ended up doing some refactoring around routes to allow for code splitting but following the react/webpack instructions I've still got just the 2 entry bundles being generated. Index.tsx im...

If I make changes to my angular app the chunk names will change on build and the old version will be removed from the dist folder. Once deployed, if a user is currently on the site, and then naviga...

I have a 2 step Application Flow that looks like this: const Step1 = React.lazy(() => import('./Step1')); const Step1 = React.lazy(() => import('./Step2')); <Suspense fallback={<Loadi...

I've integrated Sentry with my website a few days ago and I noticed that sometimes users receive this error in their console: ChunkLoadError: Loading chunk <CHUNK_NAME> failed. (error: <WE...

I'm using lazy to split my routes and I wanna know if there is any way I can get the loading progress in lazy and suspense. Currently I'm using it like this. const Home = lazy(() => import("./...

I'm using Webpack 4.x and have the following in my config: splitChunks: { chunks: 'all', }, runtimeChunk: true This results in three chunks in my project: app.prod.js 1.app.prod.js 2.app.prod...

I'm going migrate to Redux. My application consists of a lot of parts (pages, components) so I want to create many reducers. Redux examples show that I should use combineReducers() to generate one...

I'm using esbuild to build my web-components using lit. I'm now investigating code splitting to make my bundles smaller. I generate a lot of components( ~100 ) that all have the same import stateme...

Let's say I have 3 async chunks that were created by dynamic imports: const Notes = lazy(() => import(/* webpackChunkName: "notes" */ 'pages/Notes')) const Lists = lazy(() => import...

I recently learnt about lazy loading components and started using it. Now I am trying to prefetch the lazy loaded components as well as vue-router routes. But using the chrome devtools I found that...

With only one output entry in my rollup.config.js like so: export default { input: './src/Index.tsx', output: { dir: './myBundle/bundle', format: 'iife', sourcemap: true, }, plugins: [ type...

To reduce the initial load of my app, i try to do code splitting. For exemple, i successfully split twilio-video, to load and initialize when user press "call" import('twilio-video').then...

Here's an unexpected issue I've run into with Webpack code splitting in the wild: Imagine this scenario: The user loads a React app with Webpack code splitting and a few bundle chunks are loaded ...

I'm using webpack 4.43.0. How do I prevent codesplitting from happening in webpack? All these files are created - 0.bundle.js up to 11.bundle.js (alongside the expected bundle.js), when I run webp...

I have lots of code shared between web and web worker parts of my browser app. How can I tell webpack to split my code up into common chunks so that the result is garanteed to work 100%? The webw...

I've created a repository with a basic example that triggers this error in case it helps: loadable-components-ssr I'm trying to use Loadable Components in a SSR set up with react-router-dom 4.3.1...

I have a react app running, and I wanted to add route based code-splitting using React.lazy to it. Currently my code is, import { PureComponent, cloneElement, Suspense, lazy } from 'react'; ... e...

I am looking for a solution to split the big CSS file generated by Tailwind PostCSS plugin (combined with purgecss plugin) into multiple CSS files (one CSS file per consumer JS file). Consumed CSS ...

I am using create-react-app. I want to react-router base code-splitting but I want to get the first chunk which user open in browser and then get other chunks asynchronously in the background Rout...

Is there a recommended approach for code splitting in Expo web projects? I cant find anything in the docs, even on the web performance page: https://docs.expo.io/guides/web-performance/ Im surp...

I have a simple PWA app built with Webpack and React. It has code splitting setup on dynamic imports (e.g. React.lazy(() => import('./SomeRoute'))) so different routes get different JS bundles, ...

In a webpack 3 configuration I would use the code below to create separate vendor.js chunk: entry: { client: ['./client.js'], vendor: ['babel-polyfill', 'react', 'react-dom', 'redux'], }, outpu...

We are developing a Vue.js application based on Vue CLI 3 with Vue Router and Webpack. The routes are lazy-loaded and the chunk file names contain a hash for cache busting. In general, everything i...

I understand that Suspense components are the React-ian approach to code splitting, which makes webpages load faster. Now, say you have a component hierarchy like this: <App> <Suspense f...

We are working on a React component library. Some of the components need to updated without the need to redeploy the host app code. This is very much like say Google Maps library, where the client ...