Rozdělení kódu
Rozdělení kódu je technika, která rozděluje velký balíček JavaScriptu na menší části načítané na vyžádání, takže uživatelé stahují pouze kód potřebný pro stránku, kterou si prohlížejí.
Moderní webové aplikace mohou mít miliony řádků JavaScriptu. Bez rozdělení kódu se celý tento kód zabalí do jediného souboru, který musí každý uživatel stáhnout, než se aplikace stane interaktivní, i když navštíví jen jednu stránku. Rozdělení kódu dělí balíček aplikace na menší části podle tras, komponent nebo funkcí.
Když přejde na stránku nastavení, tento kód se načte na vyžádání. Knihovny používané pouze v konkrétních funkcích se rozdělí do vlastních částí. Existuje několik přístupů k rozdělení kódu.
V praxi
- Dashboard SaaS snížil svůj počáteční balíček JavaScriptu z 3,2 MB na 450 kB díky rozdělení kódu podle tras, takže se přihlašovací stránka načte za méně než 2 sekundy místo 8
- E-shop líně načítal svou komponentu recenzí produktů (která obsahovala náročný editor formátovaného textu), čímž ušetřil 200 kB z počátečního načtení stránky produktu
- Aplikace v Next.js automaticky rozděluje kód podle tras, takže domovská stránka jejich aplikace s 50 stránkami načítá pouze 120 kB JavaScriptu místo celkových 4 MB
- Webová aplikace rozdělila svou knihovnu pro grafy do samostatné části, takže uživatelé, kteří nikdy nenavštíví analytický dashboard, si nestahují 500kB knihovnu pro grafy
Nejste si jistí, jak se to týká vás?
Zkušený inženýr projde váš web, vaši viditelnost ve vyhledávání a způsob, jakým se k vám dostávají poptávky, a poté sepíše tři věci, které je vhodné opravit jako první. Dokument si ponecháte tak jako tak.