JavaScript-tiivistin
Tiivistä ja pakkaa JavaScript-koodia verkossa, ilmaiseksi.
Syöte
Tiivistetty tuloste
Mikä on JavaScript-tiivistin?
Jokainen JavaScript-bundlesta säästetty kilotavu tarkoittaa nopeampaa sivunlatausta — ja web.dev performance -ohjeet ja Google PageSpeed Insights huomaavat sen. Tämä tiivistin poistaa välittömästi tyhjät merkit, kommentit ja tarpeettomat tokenit JavaScript-koodistasi. ECMAScript-määritys määrittelee kielen; tiivistys säilyttää toiminnan. Tuotannon buildputkissa työkalut kuten Terser ja UglifyJS tekevät tämän automaattisesti — nopeaan tiivistykseen ilman buildmäärityksiä tämä työkalu tekee sen suoraan selaimessa.
Työkalu toimii kokonaan selaimessasi. Mitään ei lähetetä palvelimelle. Liitä JS tai lataa tiedosto; saat tiivistetyn tuloksen. Muotoiluun (käänteinen toiminto): JavaScript-muotoilija. Validointiin: JavaScript-validaattori. Vahvempaan suojaukseen: JavaScript-obfuskaattori.
Käyttöohje
Liitä tai lataa
Liitä JavaScript vasempaan paneeliin tai lataa .js- tai .txt-tiedosto. Esimerkki lataa esimerkkikoodin. Tyhjennä nollaa.
Tarkista tiivistetty tuloste
Oikea paneeli näyttää tiivistetyn koodin. Tyhjät merkit ja kommentit poistetaan. Virheellinen JS näyttää virheen.
Kopioi tai lataa
Käytä Kopioi tai Lataa tiivistetyn koodin saamiseksi. Tuotannossa harkitse myös gzip- tai brotli-pakkausta.
JavaScript-tiivistimen esimerkkejä
Tässä esimerkki muotoillun JavaScript-koodin tiivistämisestä.
Esimerkki: API-fetch-funktio
Muotoiltu syöte:
Tiivistetty tuloste:
Milloin JavaScript-tiivistin auttaa
Kun valmistat tuotantopaketteja webpack- tai rollup-työkaluilla, pienennät kaistanleveyttä tai optimoit latausaikoja, tiivistys pienentää JS-tiedostoja. Käytä build-työkalujen kanssa tai manuaalisesti nopeisiin tarkistuksiin. Obfuskointiin (vaikeampi käänteinen): JavaScript-obfuskaattori.
Usein kysytyt kysymykset
Onko datani yksityistä?
Kyllä. Tiivistys tapahtuu kokonaan selaimessasi. Mitään ei lähetetä palvelimelle.
Tiivistin vs. obfuskaattori?
Tiivistin pienentää koodin kokoa. Obfuskaattori tekee koodista vaikeammin luettavan ja käänteisen. Obfuskointi usein sisältää tiivistyksen.
Rikohtaako se koodini?
Kelvollinen tiivistys säilyttää käyttäytymisen. Puolipisteen lisäys ja reunatapaukset voivat aiheuttaa ongelmia; testaa tuloste.
Entä source mapit?
Tämä työkalu ei luo source mappeja. Tuotantorakennuksiin source mappeilla käytä webpack, rollup tai Vite. Katso MDN source mapit.
Voinko purkaa tiivistyksen?
Käytä JavaScript-muotoilijaa sisennysten lisäämiseen. Se ei palauta kommentteja tai alkuperäisiä muuttujanimiä.