IT-lexikon › Web › Code splitting

Code splitting

Web In English → Uppdaterad: 2026-05-30

Tekniken att dela upp en applikations JavaScript i flera mindre paket ("chunks") som laddas vid behov, i stället för en enda stor bunt vid start. Minskar den initiala nedladdningen och gör sidan snabbare att starta — en grundsten i webbprestanda.

Problem: en stor app buntad till en enda fil betyder att användaren måste ladda ned (och webbläsaren tolka) ALL kod innan något fungerar — även kod för sidor och funktioner de kanske aldrig besöker. Code splitting bryter upp den: vanliga gränser är per route (ladda bara koden för den sida man besöker), per komponent (ladda en tung modal/diagram-bibliotek först vid användning), och vendor-splitting (separera sällan-ändrade beroenden för bättre cachning). Mekaniken bygger på import() (dynamic import) som bundlers (Vite, webpack, esbuild) känner igen och automatiskt delar ut i separata chunks. Vinst: mindre initial bundle → snabbare Time to Interactive och bättre Core Web Vitals. Avvägning: för många små chunks ger fler nätverksrundor. En av de viktigaste prestandateknikerna i moderna webbappar. Hör ihop med dynamic import och lazy loading.

← Tillbaka till lexikonet