Käyttämätön JavaScript

Silktide lataa sivusi oikeassa selaimessa ja mittaa, kuinka suuri osa kustakin komentosarjasta todella suoritetaan sivun latautuessa. Komentosarjat, joissa on paljon käyttämätöntä koodia, raportoidaan mahdollisen säästön ohella.

Miksi tämä on tärkeää

Käyttämätön maksaa kävijöillesi kahdesti: kerran sen lataamisesta ja uudelleen, kun selain jäsentää ja kääntää koodia, jota ei koskaan suoriteta. Puhelimissa jälkimmäinen kustannus korostuu – keskitason puhelin voi käyttää komentosarjan käsittelyyn moninkertaisesti enemmän aikaa kuin sen lataamiseen. Tänä aikana sivu ei voi reagoida napautuksiin tai vieritykseen.

Käyttämätöntä koodia kertyy samalla tavoin kuin käyttämätöntä CSS:ää: kehykset ja kirjastot sisältävät ominaisuuksia, joita et käytä, ja vanhaa koodia poistetaan harvoin. Jokainen kävijä maksaa siitä jokaisella sivulatauksella.

Näin korjaat ongelman

Poista komentosarjat, joita sivu ei enää tarvitse, mukaan lukien sellaisten palveluiden tunnisteet, joiden käytön olet lopettanut.
Jaa suuret paketit siten, että kukin sivu lataa vain käyttämänsä koodin. Nykyaikaiset rakennustyökalut tukevat koodin jakamista, joka tekee tämän automaattisesti.
Lataa sivun alaosassa olevien tai pyynnöstä käytettävien ominaisuuksien – modaalien, soittimien ja pienoissovellusten – koodi vasta, kun sitä tarvitaan, sen sijaan että lataisit sen heti:

// Lataa chat-pienoissovelluksen vain, kun kävijä pyytää sitä
button.addEventListener('click', async () => {
  const { openChat } = await import('./chat.js');
  openChat();
});

Näin Silktide testaa tämän

Lataa sivu oikeassa selaimessa ja tallenna, mitkä osat kustakin komentosarjasta suoritetaan sivun latautuessa.
Mittaa jokaisesta komentosarjasta, kuinka monta tavua ei koskaan suoritettu.
Raportoi jokainen komentosarja, jossa on merkittävästi hukkaa, ja näytä sen nykyinen koko, käyttämättömän koodin prosenttiosuus sekä tavumäärä, jonka voisit säästää.

Vianmääritys

Koodi suoritetaan, mutta ei sivun latauksen aikana

Mittaus kattaa alkuperäisen latauksen. Koodi, joka suoritetaan vasta myöhemmin – lomakkeiden validointi, valikoiden käsittely tai napsautusten takana olevat ominaisuudet – lasketaan käyttämättömäksi, vaikka sivu tarvitsee sitä lopulta. Tällainen koodi kannattaa ladata pyynnöstä sen sijaan, että se ladattaisiin heti.

Käyttämätön koodi on kolmannen osapuolen komentosarjassa

Et yleensä voi karsia jonkun muun pakettia, mutta voit hallita, milloin se ladataan. Katso lähestymistapoja kohdista Kolmannen osapuolen koodi ja Kolmannen osapuolen julkisivut.