Zaradi česa JS bundle raste in zakaj velikost škoduje?

Question

IT Interview Practice · Accepted Answer

**Bundle** je JavaScript, ki ga tvoje orodje za gradnjo pakira in pošlje brskalniku. Raste predvsem zaradi **odvisnosti**, **podvojene kode** in **pošiljanja kode, ki je stran še ne potrebuje**.

## Kaj ga napihuje

- **Težke knjižnice** — ena sama knjižnica za datume ali ikone lahko doda več sto KB. Uvoz celotnega `lodash` za eno funkcijo potegne noter celoto.
- **Uvažanje vsega** namesto tega, kar uporabljaš:

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

- **Brez code splittinga** — celotna aplikacija (vsaka pot, vsak modal) je zložena v eno datoteko, naloženo vnaprej.
- **Polyfilli in podvojene odvisnosti** — dve različici istega paketa, zloženi dvakrat.

## Zakaj velikost škoduje

Bajti so majhna težava; **razčlenjevanje in izvajanje** JS je velika. Brskalnik mora vsak bajt prenesti, nato razčleniti, prevesti in zagnati na glavni niti — in to je precej počasneje na srednjerazrednem telefonu kot na prenosniku. Težek JS zavlačuje interaktivnost in neposredno slabša **INP** in **LCP**.

## Zakaj je to pomembno

»Samo dodaj knjižnico« je način, kako aplikacije tiho postanejo počasne. Spraševalci želijo videti, da razmišljaš o *strošku na odvisnost* in posežeš po uvozih posameznih funkcij, tree shakingu in code splittingu, preden se bundle napihne — še posebej, ker so telefoni tvojih uporabnikov precej šibkejši od tvojega razvojnega stroja.

Kaj ga napihuje

Zakaj velikost škoduje

Zakaj je to pomembno

Povezana vprašanja