Vad får en JS-bundle att växa, och varför är storleken skadlig?

Question

IT Interview Practice · Accepted Answer

En **bundle** är den JavaScript som ditt byggverktyg paketerar och skickar till webbläsaren. Den växer främst av **beroenden**, **duplicerad kod** och **att skicka kod som sidan inte behöver ännu**.

## Vad blåser upp den

- **Tunga bibliotek** — ett datum- eller ikonbibliotek kan lägga till hundratals KB. Att importera hela `lodash` för en funktion drar in alltihop.
- **Att importera allt** istället för det du använder:

```js
import _ from "lodash";           // ~70KB — the entire library
import debounce from "lodash/debounce"; // ~2KB — just the function you need
```

- **Ingen code splitting** — hela appen (varje route, varje modal) buntas ihop till en fil som laddas i förväg.
- **Polyfills och duplicerade beroenden** — två versioner av samma paket buntas två gånger.

## Varför storleken är skadlig

Bytes är det lilla problemet; **att parsa och exekvera** JS är det stora. Webbläsaren måste ladda ner, sedan parsa, kompilera och köra varje byte på huvudtråden — och det är mycket långsammare på en mellanklasstelefon än på en laptop. Tung JS fördröjer interaktivitet och försämrar direkt **INP** och **LCP**.

## Varför det är viktigt

"Lägg bara till biblioteket" är hur appar tyst blir långsamma. Intervjuare vill se att du tänker på *kostnad per beroende* och griper efter per-funktions-importer, tree shaking och code splitting innan bundlen sväller — särskilt eftersom dina användares telefoner är långt svagare än din utvecklingsmaskin.

Vad blåser upp den

Varför storleken är skadlig

Varför det är viktigt

Relaterade frågor