Vi gjorde goodmorning.no nesten tre ganger raskere på mobil. Slik gjorde vi det.Vi gjorde goodmorning.no nesten tre ganger raskere på mobil. Slik gjorde vi det.

De fleste besøker nettsider fra mobilen, ofte med dårlig dekning, på toget eller i en butikk. For hvert sekund de må vente, er det noen som forlater siden.

Google måler hastighet og bruker det som en faktor i rangeringen av søkeresultater. AI-søketjenester som ChatGPT og Perplexity har også nytte av raske, ryddige sider når de henter informasjon til svarene sine.

Googles offentlige test ga oss 70 poeng. Før vi endret noe, kjørte vi en egen test med samme testmotor, men med en tregere simulert mobil. Slik kunne vi gjenta målingen etter hver endring. Denne strengere testen ga forsiden følgende resultater:

• 49 av 100 poeng
• 8,2 sekunder før hovedinnholdet var synlig
• Nesten et helt sekund der nettleseren var opptatt med å kjøre kode, slik at du ikke kunne trykke på noe
• Litt over 1 MB nedlastet før siden var ferdig lastet

Ikke alt dette var synlig på skjermen. Siden så ferdig ut lenge før den faktisk var det.

Det var ingen enkeltfeil som forårsaket problemet. Mange små ting til sammen gjorde siden treg. Her er noen eksempler:

• Siden ventet på seg selv. Hele siden ble holdt skjult til alt var lastet inn, i stedet for å vise toppen med én gang.
• Møtebookingen ble alltid lastet inn. Kalenderen for å booke et møte var med på alle sider, også når ingen åpnet den.
• Fontfilene var for store. Vi sendte 446 kB med fonter til hver besøkende, inkludert tusenvis av tegn som aldri brukes i norsk eller engelsk tekst.
• Sporingskoden lå ubrukt på alle sider. Den gjorde ingenting før du svarte på informasjonskapselbanneret. Inntil da var den bare ekstra last som gjorde siden tregere.
• Hver side ble bygget fra bunnen av for hver besøkende. Serveren satte sammen siden på nytt hver gang, i stedet for å levere en ferdig versjon.
• To animasjonsbiblioteker gjorde samme jobb. Begge måtte lastes ned og startes før noe på siden kunne bevege seg.

Vi gjorde ni endringer. Ingen av dem endret hvordan nettsiden ser ut eller fungerer. De samme animasjonene, det samme innholdet og det samme designet.

1. Toppen av siden vises med én gang, mens resten lastes inn mens du leser.
2. Møtebookingen lastes først inn når du åpner den.
3. Vi sender bare dataene en side faktisk trenger. Forsiden gikk fra 487 kB kode til 176 kB, uten at et eneste ord eller bilde forsvant.
4. Stilarket lastes én gang og lagres i nettleseren, i stedet for å sendes på nytt med hver side.
5. Fontene ble begrenset til tegnene vi bruker: fra 446 kB til 58 kB.
6. Sporingskoden legges først til etter at du har samtykket, og bare når nettleseren har ledig kapasitet.
7. Mer av siden bygges på serveren, slik at mobilen får mindre arbeid.
8. Ferdige sider leveres fra en lagret kopi i nærheten av brukeren. Serveren svarer på millisekunder i stedet for å bygge siden på nytt. Når vi endrer innhold, oppdateres kopien automatisk.
9. Vi bruker ett animasjonsbibliotek i stedet for to. Vi gikk gjennom alle de 49 stedene med animasjoner og kontrollerte bilde for bilde at de så like ut.

Vi målte forsiden på mobil med samme metode som før:

Googles egen test, som ga oss 70 poeng i oktober, gir oss nå 95 på mobil og 100 på desktop. Tilgjengelighet, beste praksis og SEO får 100 poeng på begge.

• Mål før du endrer noe, og etter hver endring. Det som føles tregt, og det som faktisk er tregt, er ikke alltid det samme. Vi målte siden før vi endret én kodelinje, og etter hver av de ni endringene. Vi kjørte flere tester hver gang, slik at vi visste hva hver endring bidro med.
• De største forbedringene kommer sjelden der du forventer. Fontene alene ga oss 16 poeng. Et par endringer vi hadde stor tro på, ga nesten ingenting, så dem lot vi være.
• Tredjepartsverktøy har en kostnad. Hvert sporingsskript, hver chat-widget og hvert bookingverktøy du legger til, koster de besøkende lastetid. Last dem inn når de trengs, ikke før.
• Dette er vedlikehold, ikke et engangsprosjekt. Nettsider blir gjerne tregere over tid etter hvert som innhold og verktøy legges til. Mål igjen hvert halvår.

Googles test er gratis og tar bare et minutt. Åpne PageSpeed Insights, skriv inn adressen din og se på poengsummen. Over 90 er et godt resultat. Under 80 kan de besøkende bruke tid på å vente på ting de aldri ser, og noen forlater siden før den blir synlig. For oss betydde forbedringene at forsiden ble synlig omtrent tre ganger raskere, og at vi fikk en langt bedre poengsum i Googles test.

Begynn med å måle. Når tallene ligger på bordet, er tiltakene ofte mindre enn problemet først så ut til å være. Vi hjelper gjerne med begge deler.