Optimalizácia rýchlosti web stránok. Časť druhá.
Rýchlosť je stále jedným z rozhodujúcich faktorov, ktoré ovplyvňujú umiestnenie webu vo vyhľadávači. Preto sa vždy usilujeme dosiahnuť aj na tomto poli čo najlepšie výsledky.
Rýchlosť webových stránok som už v našom blogu riešil v článku Rýchlosť je rozhodujúca. Už vtedy som naznačil, že nás ešte práca čaká, minimálne v oblasti optimalizácie obrázkov (konverzia na webp formát a lazyloading obrázkov) a celkovej optimalizácie frontend systému tak, aby optimalizoval všetky assets (obrázky, css štýly, javascripty) v ešte vyššej miere. Ako som v článku spomínal, pre generovanie statických assets používame bundler webpack. Hlavne vďaka webpacku je optimalizácia dosiahnuteľná. Lebo optimalizovať je možné každý web "ručne" v zmysle odporúčaní pre zvýšenie rýchlosti.
Je však rozdiel optimalizovať ručne pár obrázkov, štýlov a jeden javascript súbor na malom webe (komprimácia, webp formát, lazyloading, minifikácia, spájanie súborov) a optimalizovať komplexnú webovú stránku so stovkami obrázkov, rozsiahlym systémom modulov s rôznymi css a js súbormi, ako napr. na stránke www.irobot.sk. Bez automatizácie je takýto proces už aj na stredne veľkom webe nedosiahnuteľný v reálnom čase (rozumej zákazníkom akceptovateľnej cene).
Automatizácia a jej výsledky
A práve webpack na strane generovania optimalizovaných assets šablóny a nainštalovaný mod_pagespeed na strane servera dokáže procesy automatizovať. A automatizácia znamená, že takáto optimalizácia môže byť nasadená na všetkých nami tvorených stránkach. Neradi totižto odovzdávame polovičatú prácu. Učíme sa každý deň a celý proces zlepšujeme. A každý náš nový web je lepší a rýchlejší. Veď posúďte sami:
Analýza posledných 10 nami tvorených webov cez službu GTmetrix.
Takmer všetky weby sú hodnotené indexom A alebo B. Ako je na tom váš web? Otestujte si ho tiež.
Porovnanie
A na záver malé porovnanie medzi 2 konkurentami na poli robotických vysávačov:
Web www.irobot.sk sme dostali z hodnotení C/D na A/B. Ide o komplexnejší web s rôznymi externými prepojeniami a viacerými obrázkami s vysokým rozlíšením. Všimnite si okrem skóre PageSpeed a YSlow aj hodnotu času potrebného pre plné načítanie stránky 2.2 s a celkový dátový objem stránky 1.14 MB.
Pred zmenami bol na tom web iRobotu obdobne ako web robotických vysávačov Samsung. Samsungácky web však aj napriek subjektívnej väčšej strohosti a menším obrázkom posiela návštevníkovi väčšiu porciu dát a pre vykreslenie potrebuje oveľa viac času. A toto je pointou optimalizácie rýchlosti. Pomalé weby nemá rád ani Google a ani návštevník!
