Koodi jagamine
Koodi jagamine on tehnika, mis lõhub suure JavaScripti paketi väiksemateks tükkideks, mis laevad nõudluse alusel, nii et kasutajad laevad alla ainult koodi, mida nad vajavad praegu vaadataval leheküljel.
Kaasaegsed veebirakendused võivad sisaldada miljonite ridade jagu JavaScripti. Ilma koodi fragmenteerimiseta (code splitting) pakitakse see kogu kood ühte faili, mille iga kasutaja peab alla laadima enne, kui rakendus interaktiivne saab, isegi siis, kui ta külastab vaid üht lehekülge. Koodi fragmenteerimine jagab rakenduse paketi väiksemateks tükkideks, tuginedes marsruutidele, komponentidele või funktsioonidele.
Kui nad navigeerivad seadete lehele, laadub see kood vajadusel. Raamatukogud, mida kasutatakse ainult konkreetsetes funktsioonides, eraldatakse omaette tükkidesse. On olemas mitmeid lähenemisviise koodi fragmenteerimisele.
Praktikas
- SaaS-juhtpaneel vähendas oma algset JavaScripti paketti suurusega 3,2 MB 450 KB-ni tänu marsruutipõhisele koodi fragmenteerimisele, muutes sisselogimislehe laadumisaega alla 2 sekundi asemel 8 sekundi
- E-poe saidil laeti tooteülevaate komponent (mis sisaldas raskeid rikast tekstiredaktorit) hilislaadimisega (lazy-load), säästes 200 KB algse tootekülg laadimise mahust
- Next.js rakendus fragmenteerib koodi marsruuti automaatselt, nii et nende 50-leheküljelise rakenduse avalehel laeb alla vaid 120 KB JavaScripti asemel kogumahus 4 MB
- Veebirakendus eraldas diagrammiraamatukogu eraldi tükiks, nii et kasutajad, kes ei külasta kunagi analüütika juhtpaneeli, ei laadi alla 500 KB diagrammiraamatukogu
Kas ei ole kindel, kuidas see teile kehtib?
Kogenud insener vaatab üle teie veebisaidi, nähtavuse otsingus ja päringute teekonna ning kirjutab seejärel üles kolm asja, mida esmalt parandada. Dokument jääb teile igal juhul.