What is Code Splitting?
Dividing a JavaScript bundle into chunks loaded on demand, so users download only the code the current page needs.
Definition
Code splitting breaks one monolithic bundle into multiple chunks fetched when needed, driven by dynamic import(), which every major bundler turns into a split point. The dominant pattern is route-based splitting—each page becomes its own chunk—implemented automatically by Next.js, Nuxt, and SvelteKit; component-level splitting via React.lazy and Suspense defers heavy widgets like charting libraries or rich-text editors. Shared dependencies are extracted into common chunks with content-hashed filenames for cache reuse across deploys. The payoff is faster startup on entry pages; the cost is a network round trip at navigation, softened by prefetching links in the viewport.