Snabba upp webben med Peter Hedenskog – pappa till Sitespeed.io

För dig som läst min bok eller följt vad jag skriver om kommer det inte som en överraskning att jag verkligen tycker det är viktigt med prestanda på webben.

Jag menar rent utav att det är samma sak som användbarhet - en webbplats med låg prestanda är helt enkelt inte tillgänglig nog för varken sökmotorer eller användare oavsett om denne har en funktionsnedsättning eller inte.

I Peter Hedenskog har jag en meningsfrände. Peter har rent utav släppt ett verktyg för att hjälpa till med analys av en webbplats prestanda.

Porträtt på Peter Hedenskog

Vem är du och vad jobbar du med?

- Jag heter Peter och har jobbat med webben sen 1999. På dagarna är jag konsult och hjälper folk att bygga webbar och håller föreläsningar om vad vi ska tänka på för att bygga webbsidor som är snabba för användaren. På nätterna jobbar jag med ett öppet källkodsprojekt som heter sitespeed.io som hjälper dig mäta hur snabb din webbsida är och berättar hur du kan göra den snabbare.

Varför är webbprestanda viktigt?

- Det är inte bara viktigt utan det viktigaste på hela webben! Den mänskliga hjärnan fungerar så att om att en sida är tar längre tid än en sekund att ladda, börjar dina tankar vandra iväg och du blir frustrerad.

- Google viktar också sökresultatet med hur snabb din sida är, om din sida är snabb har du större möjlighet att synas högre upp bland sökresultaten. Google prövar också att visa ifall en sida är slö på mobila enheter, för att du som användare inte ska behöva klicka på länken.

- En sak till som är intressant är att undersökningar visat att en snabbare sajt får mer avslut än en slö sajt, dvs om du säljer saker på din sida ökar möjligheterna till fler försäljningar om din sida är snabb!

- I år kommer också det uppdaterade HTTP protokollet (2.0) att börja användas på allvar av webbläsare, vilket gör att hack som förut gjorde din sajt snabb, gör din sida slöare! Extra mycket jobb för oss som gillar att göra snabba sidor.

Vilka förbättringar ligger topp 3 på din lista? Vad får man bara inte fuska med?

- Egentligen är listan kanske 20-25 saker som vi bara inte får fuska med, men om vi försöker med de tre av dom viktigare:

Se alltid till att din server har satt en lång cache-header på filer som inte ändras. Det gör att filerna inte behöver laddas ner varje gång en besökare surfar på din sida och sidan kommer automatiskt att ladda snabbare och du kommer spara bandbredd.
Komprimera alltid din HTML/Javascript och CSS så att den skickas komprimerad till användaren. Det spar bandbredd och gör att användaren får sidan snabbare. Lyxa också till det genom att se till att dina bilder använder det formatet som är minst och som passar just den här bilden. Det spar pengar för dig i form av bandbredd och tid för användaren.
Ladda aldrig javascript synkront inne i din <head>-tag. Oj nu blev det lite mer komplicerat. Vadå? Jo, om du laddar Javascript inne i head-taggen så måste användarens webbläsare vänta på att börja rita ut sidan även fast javascriptet i 9999 av 1000 inte behövs för det som ska synas på skärmen (och skulle det behövas har du gjort fel och det finns möjlighet till förbättring!). Laddar du javascript på fel sätt, behöver användaren vänta onödigt länge innan hon ser något på skärmen.

- Nä, jag måste bara nämna en sak till som är speciellt viktig nu när du surfar med mobilen och din sajt är responsiv: Se till att webbläsaren kan välja på vilken storlek på bilden den ska ladda, så att du när du surfar med mobilen inte laddar ner stora bilder som är anpassade för en dator. Då spar du bandbredd och processorkraft på mobilen som gör att sidan blir snabbare.

Hur ser det ut generellt i Sverige - är vi bra på webbprestanda?

- Vi kan alla bli bättre! Vi har många tidningar i Sverige som arbetar med många annonser som gör att det blir ett svårt jobb att få till snabba sidor men som ändå lyckats hyffsat bra! Det är kul. Sen finns det flera tidningar som missat mina tre viktigaste punkter som man absolut inte får fuska med :)

- Ett problem som väldigt många sajter i Sverige har idag är att vi är beroende av tredjepartsscript (tex från Facebook, Twitter eller i värsta fall annonser) och vi har implementerat det fel så att om tredjepartssajten ligger nere (jag lovar dig, det händer faktiskt) så fungerar inte vår egna sida! Det är inte ok!

Har du exempel på nyttiga användningsfall där prestandaarbetet gjort stor skillnad

- Ett exempel som jag gillar är att tjejerna och killarna bakom Obamas förra insamlingskampanj gjorde sin webbplattform 60% snabbare och kunde visa att dom fick in 14% fler som donerade till kampanjen tack vare att sajten var snabbare.

- Om du är intresserad har jag en lista med fall här: www.peterhedenskog.com/blog/2014/09/more-speed-more-money/

Jag är intresserad men vet inget om webbprestanda, var ska jag börja då?

- Kan du ta dig till Stockholm är du välkommen komma på vår Meetup-grupp (Sveriges största). Annars börja med att läsa Tammy Everts blogginlägg, det är en grym blogg att följa. (fanns på www.webperformancetoday.com)

- När du kommit längre in är Ilya Grigoriks bok High Performance Browser Networking (som du kan läsa gratis) fantastisk. Där lär du dig allt om hur browsers fungerar och hur du gör dina sidor supersnabba.

Något särskilt på webben just nu som du tycker är spännande?

- Docker revolutionerar hur du jobbar med applikationer och webbar, det finns massor där att lära! Men mest spännande är företag som stöder öppen källkod. Alla använder det men väldigt få hjälper till och får det att fungera.