Optimizare blog 1923.ro

1923.ro este un blog dedicat rapidiștilor unde poți găsi știri și noutăți despre Rapid și poți cumpăra tricouri personalizate.

Dragoș (proprietarul site-ului) a optat pentru un audit de performanță cu scopul de a vedea dacă îi putem rezolva anumite probleme pe care le avea cu acest blog. Și anume apariția ecranului alb, așa-numitul WSOD (white screen of death), care apare destul de frecvent în cazul WordPress.

De ce apare ecranul alb în WordPress?

Nu există un singur motiv pentru care apare această eroare, ea poate fi rezultatul mai multor chestii:

• WordPress atinge limita de memorie RAM alocată pentru un script php
• se folosește un plugin/mai multe sau o temă de proastă calitate (referitor la cum e scris codul php)
• există o problemă cu setările serverului firmei de hosting
• există caractere nedorite în functions.php al temei sau în wp-config.php

Să vedem cum l-am ajutat pe Dragoș să aibă un blog fără erori și mai „Rapid”… :)

Înainte

Înainte de mutarea pe serverul Simplenet, blogul 1923.ro se încărca în medie în 3,6 secunde. Prima pagină avea 108 request-uri și o mărime de aproximativ 3800K din care 3404.5K erau reprezentați doar de poze.

Scorul obținut la testul Google Page Speed era de 80/100 cu următoarele recomandări prezentate:

• optimize images
• eliminate render-blocking Javascript and CSS in above-the-fold content
• reduce server response time to under 200ms

Era clar că pozele sunt problema principală, însă nici serverul pe care era găzduit blogul nu era prea strălucit.

Optimizare

Am căutat pozele cu rezoluții foarte mari și le-am redimensionat pentru web. După care am folosit Smush.it pentru a optimiza toate pozele existente pe site.

Optimizarea pozelor se referă la micșorarea dimensiunilor în KB a fișierului însă cu păstrarea calității imaginii.

Am implementat și Lazy Load, un plugin de WordPress care încarcă gradual imaginile de pe pagină, acestea fiind afișate doar când intră în raza vizuală a utilizatorului.

Astfel, în loc să se încarce 3MB de poze din prima, se încarcă acum doar aproximativ 780K. Restul de poze se vor încărca treptat pe măsură ce utilizatorii fac scroll.

Am creat un subdomeniu img.1923.ro. Am setat ca imaginile viitoare încărcate pe site să se afișeze de pe acest subdomeniu.

Acest lucru face ca browserul să poată descărca în paralel mai mult elemente, crescând viteza de afișare a paginii.

Însă, oricât de mică ar fi pagina respectivă, pentru ca WordPress să o afișeze serverul PHP trebuie să lucreze împreună cu serverul MySQL ca să găsească în baza de date informația și să o afișeze în pagină.

Tot procesul ăsta consuma resurse. Așa că am implementat o combinație de page cache și database cache pentru a face WordPress-ul să lucreze cât mai puțin, să consume cât mai puține resurse. Astfel WordPress-ul ajunge să servească paginile mai repede și să poată susține și mai mult trafic.

Ca bonus, fără legătură cu performanța, am implementat și un plugin foarte mic și lightweight. Acest plugin codează adresele de e-mail de pe site ca să le ascundă de boții care strâng e-mailuri pentru listele spammer-ilor.

După

După optimizarea imaginilor, setarea încărcării graduale și implementarea cache-ului, am îmbunătățit viteza de încărcare a blogului până la 1,4 secunde față de 3,60 secunde cât era inițial.

Un nou test Google Page Speed ne arată un scor de 92/100, cu o singură recomandare (normală) – eliminate render-blocking Javascript and CSS in above-the-fold content.

Alte recomandări

Tot ce am făcut până acum am făcut fără să ne atingem de design și de funcționalitățile site-ului.

Viteza mică de încărcare, dar și erorile legate de atingerea limitei memoriei, nu se datorau în totalitate imaginilor neoptimizate sau lipsei cache-ului.

Chiar și optimizate, numărul pozelor care sunt încărcate pe prima pagina este destul de mare din cauză că sunt afișate postările întregi.

Soluția ar fi să se afișeze doar un excerpt și un thumbnail pentru fiecare postare.

O altă problemă este legată de pluginul Facebook. Acest plugin adaugă anumite funcționalități site-ului. Are un impact negativ extrem de mare – 90.6% din viteza de încărcare a site-ului.

Bănuiala mea este că acest plugin genera erorile. Însă din păcate, cam toate plugin-urile care adaugă comentarii Facebook pe care le-am testat au un impact negativ asupra performanței (unele dintre ele mai puțin însă decât pluginul instalat).

Ca și regulă generală, din experiența personală cu pluginurile de comentarii, recomand folosirea sistemului standard de comentarii al WordPress. Poate nu arată el extraordinar, dar măcar nu îți sabotează site-ul.

Dacă ai și tu un blog/site și vrei să se încarce mai rapid și să susțină mai mult trafic, te așteptăm la Simplenet cu soluții de găzduire web, optimizare și mentenanță.