Verouderde JavaScript
Silktide controleert of je pagina extra code meestuurt die uitsluitend bedoeld is om zeer oude browsers te ondersteunen. Moderne browsers hebben die code niet nodig, dus voor vrijwel elke bezoeker kost deze onnodig download- en verwerkingstijd.
Wanneer wordt voorbereid voor publicatie, voegen buildtools vaak polyfills (vervangers voor functies die oude browsers missen) en transformaties toe (herschrijvingen van moderne syntaxis naar oudere equivalenten). Wanneer deze zijn geconfigureerd voor browsers die vrijwel verdwenen zijn, kunnen ze bij elke paginalading een aanzienlijke hoeveelheid overbodige code toevoegen.
Waarom dit belangrijk is
De overgrote meerderheid van bezoekers gebruikt browsers die zichzelf bijwerken en moderne JavaScript standaard ondersteunen. Door code voor ondersteuning van oude browsers moeten zij allemaal betalen — in downloadtijd, mobiele data en verwerkingstijd — voor compatibiliteit met browsers die mogelijk helemaal niet door je daadwerkelijke bezoekers worden gebruikt.
De kosten zijn gemakkelijk over het hoofd te zien, omdat er niets mis lijkt te zijn: de site werkt overal. De site is gewoon op elke pagina en voor iedereen trager dan nodig.
Hoe je dit oplost
Dit is een aanpassing van de buildconfiguratie voor je ontwikkelaars:
- Stel de browserondersteuningsdoelen van de build in op de browsers die je bezoekers daadwerkelijk gebruiken, in plaats van op een verouderde standaard die niet meer is bijgewerkt. De meeste buildtools halen deze informatie uit een declaratie voor browserondersteuning in het project.
- Verwijder algemene polyfill-imports die ondersteuning voor alles toevoegen en laat de build alleen opnemen wat je doelbrowsers echt nodig hebben.
- Als een oude browser nog steeds moet worden ondersteund, lever dan twee builds — een moderne voor actuele browsers en een oudere alleen voor browsers die deze nodig hebben — in plaats van de oudere build naar iedereen te sturen.
Hoe Silktide dit test
- Laad de pagina in een echte browser, met het apparaattype, de verbindingssnelheid en de testlocatie die voor je snelheidstests zijn ingesteld.
- Onderzoek de JavaScript die de pagina downloadt op bekende polyfills en syntaxistransformaties die moderne browsers niet nodig hebben.
- Rapporteer elk bestand met verouderde code, inclusief de downloadgrootte die kan worden bespaard.
- Beoordeel de pagina op basis van de totale verspilde grootte: bij ongeveer 30 KB verouderde code wordt de beoordeling verlaagd en bij 100 KB of meer is de beoordeling slecht.
Problemen oplossen
We moeten oude browsers nog steeds ondersteunen
Ga na of je bezoekers deze browsers daadwerkelijk gebruiken — je Analytics kan dat laten zien. Als sommige bezoekers ze echt gebruiken, kun je met het module/nomodule-patroon verouderde code alleen leveren aan de browsers die deze nodig hebben, zodat moderne browsers niet langer voor de kosten opdraaien.
De verouderde code staat in een script van een derde partij
Scripts van andere aanbieders kunnen hun eigen overbodige verouderde code bevatten, die je niet zelf opnieuw kunt bouwen. Controleer of de aanbieder een moderne build biedt en weeg de waarde van het script af tegen de kosten ervan.