Bildoptimering

I förra uppgiften använde jag olika verktyg för att analysera laddtiderna. Pingdom gav extra mycket information om vilka bilder som tog allra längst tid att ladda:

Även om Pingdom inte varnade om laddtiderna så hade Google PageSpeed Insights lite klagomål, och den rekommenderade att jag ändrade storleken på bilderna för att då kunde jag spara några megabyte med data. Den tycker även att jag ska använda ett modernare bildformat, som webp.

Efter att ha minskat storleken på de tre bilderna från 6000×4000 till 500×333 är bilden 144 gånger så liten. Jag har dessutom sparat bilderna som webp.

Resultat

På Google PageSpeed Insights har mitt poängvärde gått från 43 till 99 och laddtiden på Pingdom har gått från 1000ms till 240ms. Detta är självklart utmärkt, eftersom efter dessa korta åtgärder har hemsidan gått från långsam till att ladda in på under en sekund.

Resultatet är självklart inte förvånande, eftersom bilderna är tiotals gånger mindre och deras filstorlek är endast 2% av vad de var innan. Detta är en förbättring i alla sammanhang, eftersom den största bredden bilden kommer ha på sidan är 500 pixlar, vilket gör det onödigt att överföra data för en större bild om den ändå inte kommer synas i den storleken. Jag är inte helt säker på hur mycket omvandlingen till webp påverkade slutresultatet, men eftersom det endast tog några sekunder längre att spara den i det formatet tänker jag att jag kan lika gärna göra det.