Apie šį įrankį
„JavaScript“ sumažinimas sumažina šaltinio kodo dydį, pašalindamas nereikalingus simbolius ir (su tinkamais minifikatoriais) pervadindamas vietinius kintamuosius trumpesniais pavadinimais. Pirmoji kategorija – tarpų ir komentarų pašalinimas – yra paprasta ir nerizikinga. Antrasis – kintamųjų pervardijimas – reikalauja suprasti apimties taisykles ir tai geriausiai atlieka gamybos minifierai, tokie kaip Terser ir esbuild.
Šis įrankis skirtas saugiam sumažinimui: komentarų pašalinimui, tarpų sutraukimui, perteklinių kabliataškių pašalinimui ir akivaizdžių raštų sutrumpėjimui. Kintamųjų pervadinimas yra konservatyvus – paliečiami tik vietiniai kintamieji, esantys aiškiose srityse, o išoriškai nurodyti pavadinimai paliekami vieni. Rezultatas funkciškai identiškas šaltiniui.
Gamybos lygio sumažinimui skirti įrankiai (Terser, esbuild, swc) supranta visą ECMAScript taikymo srities modelį ir sukuria žymiai mažesnę produkciją. Šis įrankis skirtas greitam naršyklės sumažinimui, kai nėra visos versijos sąrankos.
Kodėl reikia sumažinti „JavaScript“.
„JavaScript“ paketai paprastai yra didžiausias vienas išteklius šiuolaikiniame tinklalapyje. Sumažinimas įprastai sumažina dydį 30–60 %, palyginti su nesumažėjusiu šaltiniu. Kartu su „gzip“ arba „Brotli“ sumažinimas šiek tiek sumažėja, tačiau derinys vis tiek sutaupo išmatuojamų baitų – ypač lėto ryšio vartotojams.
Greitesnis JavaScript taip pat reiškia greitesnį laiką iki interaktyvumo. Mažesni scenarijai atsisiunčiami greičiau, greičiau analizuojami ir vykdomi greičiau. Svetainėse, kuriose TTI veikia atmetimo rodiklius ir SEO reitingą, sumažinimas yra vienas pigiausių galimų laimėjimų.
Techninės detalės
Minifikatorius suaktyvina „JavaScript“ naudodamas analizatorių, kuris gerbia ECMAScript sintaksę. Komentarai (vienos eilutės ir kelių eilučių) pašalinami, išskyrus licencijos komentarus, pažymėtus /*! priešdėlis. Tarpas sutraukiamas, išskyrus atvejus, kai to reikia sintaksiškai (tarp identifikatorių, po raktinių žodžių).
Konservatyvus kintamųjų pervadinimas sutrumpina vietinius kintamuosius paprastomis apimtimis. Pasauliniai, eksportuojami ir importuoti pavadinimai nepervardijami – tai pažeistų išorines nuorodas. Norėdami giliai pervardyti, naudokite Terser arba esbuild su tinkama modulių analize.
Kraštiniai atvejai: automatinis kabliataškio įterpimas (ASI) reiškia, kad mažoji priemonė tam tikruose kontekstuose turi išsaugoti naujas eilutes, kad nepasikeistų programos elgsena. Šablonų literalai, reguliariosios išraiškos literalai ir JSX (jei įvestis apima) išsaugomi tiksliai, nes jų turinį gali būti nesaugu suspausti.
Dažnai užduodami klausimai
- Ar sumažinimas keičia mano kodo veikimą?
- Ne. Sumažinimas pašalina tarpą ir komentarus, kurie neturi įtakos vykdymui. Kintamųjų sutrumpinimas (sumažinimas) pervardija vietinius kintamuosius, bet išsaugo elgesį. Visuotiniai kintamieji ir eksportuoti pavadinimai išsaugomi nepažeisti.
- Ar turėčiau sumažinti kūrimą ar gamybą?
- Gamyboje naudokite tik sumažintą kodą. Kurdami išsaugokite originalų skaitomą kodą. Dauguma kūrimo įrankių (Webpack, Vite, esbuild) automatiškai apdoroja sumažinimą kaip gamybos kūrimo proceso dalį.
- Kuo skiriasi sumažinimas ir užmaskavimas?
- Sumažinimas sumažina dydį ir išlaiko kodą funkcionaliai nuskaitomą, jei suformatuotas. Dėl užmaskavimo tyčia sunku suprasti kodą (eilutės kodavimas, valdymo srauto išlyginimas). Šis įrankis skirtas dydžio mažinimui, o ne užtemimui.
- Kiek dydžio sumažinimo turėčiau tikėtis?
- Paprastai 30–60 % prieš gzip. Gerai komentuojamas kodas su ilgais kintamųjų pavadinimais mato didžiausius sumažinimus. Kartu su gzip glaudinimu „JavaScript“ failai dažnai yra 80–90 % mažesni nei pirminis šaltinis.
- Ar mano kodas įkeltas į serverį?
- Ne. Minifier veikia jūsų naršyklėje.
- Kiek mažesnis bus mano „JavaScript“?
- Paprastai sumažėja 30–60%. Kintamasis kodas su ilgais identifikatoriais labiau suspaudžiamas; Sunkus išraiškos kodas suspaudžiamas mažiau.
- Ar turėčiau mažinti ranka?
- Niekada. Išlaikyti skaitomą „JavaScript“ šaltinyje. Vykdykite sumažinimą kaip kūrimo veiksmą arba kaip diegimo dalį.
- Ar tai veikia su TypeScript?
- „TypeScript“ pirmiausia turi būti sukompiliuotas į „JavaScript“, naudojant tsc arba esbuild. Sukompiliavus gautą „JavaScript“ galima sumažinti.