Treburi serioase - Google Page Speed Isights!

[vertedi]

Nu stiu daca este bine sa pun un link catre acest serviciu Google - https://developers.google.com/speed/pagespeed/insights/ , dar pe mine ma dezamageste total. Dupa ce Google, a scos online-ul Page Speed, cu care intr-adevar puteai testa un website la optimizarea on-page, acum a venit cu Page Speed Insights, in care se poate testa si versiunea de mobile. Ok, numai ca nu bate nici o data la fel! Raspunsul de la server poate veni cu o eroare destul de mica daca testul se face dupa 2-3 minute insa, diferenta este mult prea mare.

Acum intreb si eu ca un neinitiat in acest domeniu - cum Google, are asa nota mica la test? El est "miezul", nu? Daca vand piele de capra, ar trebui sa tin una buna de test, sa vada lumea ce piele buna am, nu? Daca scot ceva de testare pe piata, ar trebui sa fiu exemplu, lumea ma testeaza si pe mine nu, ca asta vand.

Voi ati testat site-ul vostru cu "Insights-ul", asta? Cum va da?

[Alex Dumitru]

Nu stiu daca este bine sa pun un link catre acest serviciu Google - https://developers.google.com/speed/pagespeed/insights/ , dar pe mine ma dezamageste total. Dupa ce Google, a scos online-ul Page Speed, cu care intr-adevar puteai testa un website la optimizarea on-page, acum a venit cu Page Speed Insights, in care se poate testa si versiunea de mobile. Ok, numai ca nu bate nici o data la fel! Raspunsul de la server poate veni cu o eroare destul de mica daca testul se face dupa 2-3 minute insa, diferenta este mult prea mare.

Acum intreb si eu ca un neinitiat in acest domeniu - cum Google, are asa nota mica la test? El est "miezul", nu? Daca vand piele de capra, ar trebui sa tin una buna de test, sa vada lumea ce piele buna am, nu? Daca scot ceva de testare pe piata, ar trebui sa fiu exemplu, lumea ma testeaza si pe mine nu, ca asta vand.

Voi ati testat site-ul vostru cu "Insights-ul", asta? Cum va da?

E destul de ok, dar nu e perfect. De exemplu ma pune sa reduc marimea imaginilor, dar deja am folosit Yahoo Smush It, care am impresia ca face o treaba destul de buna.

Eu scot 78 Mobile si 91 Desktop.

O alta prostie pe care o face:

[Gratian Alinei]

E un instrument util care îți dă niște indicii cu privire la posibile îmbunătățiri care îți pot mări viteza de încărcare. Ceea ce îți dă mașina trebuie apoi interpretat de om - pentru viteză, e mai corect ca fișierul javascript să fie încărcat de pe local decât din altă parte, dar nu întotdeauna se poate sau e indicat.

Este normal să fie diferențe atât timp cât viteza de încărcare depinde și de factori off-page.

Off topic: un medic nu se evaluează după cât de sănătos e

[vertedi]

Adevarata chestia cu medicul insa aici nu prea cred ca se potriveste, parerea mea doar. Am reusit sa fac versiunea de mobile la 86 si desktop 96. Este intr-adevar un lucru bun dar foarte de greu de realizat.

[Cristi G]

Eu nu inteleg cum functioneaza.

Exemplu: https://developers.google.com/speed/...2F&tab=desktop

54/100 pe desktop. Acum sa analizam sa vedem ce spune.

Your page has 3 blocking script resources and 7 blocking CSS resources. This causes a delay in rendering your page.

Fisierele CSS se incarca in header, evident, asa este recomandat si asa trebuie. Nu vad unde-i problema. De ce la alte site-uri nu spune nimic de asta si la acela spune, numai el stie. Legat de JS, in temele de WP daca nu incluzi jQuery-ul sus, apar anumite probleme. Daca ai script-uri care au nevoie de jQuery pana sa ajunga in footer, n-o sa mearga. (slidere, shortcode-uri care folosesc jQuery).

Your page requires additional network round trips to render the above-the-fold content. For best performance, reduce the amount of HTML needed to render above-the-fold content.

Din nou, sunt in ceata. Daca ne uitam in sursa, ambele sidebar-uri sunt DUPA continut, inainte de continut fiind doar header-ul. (meniu + logo + social icons).

Daca ma poate lumina cineva, chiar va rog.

[Alex Dumitru]

Eu nu inteleg cum functioneaza.

Exemplu: https://developers.google.com/speed/...2F&tab=desktop

54/100 pe desktop. Acum sa analizam sa vedem ce spune.

Your page has 3 blocking script resources and 7 blocking CSS resources. This causes a delay in rendering your page.

Fisierele CSS se incarca in header, evident, asa este recomandat si asa trebuie. Nu vad unde-i problema. De ce la alte site-uri nu spune nimic de asta si la acela spune, numai el stie. Legat de JS, in temele de WP daca nu incluzi jQuery-ul sus, apar anumite probleme. Daca ai script-uri care au nevoie de jQuery pana sa ajunga in footer, n-o sa mearga. (slidere, shortcode-uri care folosesc jQuery).

Your page requires additional network round trips to render the above-the-fold content. For best performance, reduce the amount of HTML needed to render above-the-fold content.

Din nou, sunt in ceata. Daca ne uitam in sursa, ambele sidebar-uri sunt DUPA continut, inainte de continut fiind doar header-ul. (meniu + logo + social icons).

Daca ma poate lumina cineva, chiar va rog.

Sunt prea multe scripturi si css-uri pe pagina, mai ales in header. E recomand ori sa faci un singur css care e esential pentru partea "above the fold" a site-ului si sa le pui in footer pe celelalte, ori sa le incarci asincron, folosind javascript.

Scripturile ar trebui sa se afle in footer. Stiu ca multe depind de jQuery, dar functia wp_enqueue_script() are parametrul $deps, pe care il poti folosi ca sa-i spui sa se incarce dupa jQuery sau un alt script.

Ai 1564 de linii pentru o tema relativ simpla, care nici nu functioneaza foarte bine. Atunci cand dau scroll, sidebarul stang si floater-ul din post se misca foarte ciudat.

Index-ul are 2.5MB, iti dai seama cum se incarca pe un telefon cu viteza destul de slaba ?

[Cristi G]

Nu exista fisiere CSS de care nu ai nevoie, ca sa le incarci in footer. Pentru ca o sa arate jenant si din cate stiu eu, nu e recomandat sa incarci CSS in footer.

Si, nu ma refer la scripturi, ci la un slider de exemplu. Ai un shortcode care-ti face un slider si ai nevoie sa ii dai ceva gen

jQuery('.slider22889').slider(); 

evident, nu poti folosi jQuery acolo, ca nu e inca incarcat. Si nici n-ai cum sa-i spui sa incarce inline JS dupa ce e incarcat jQuery

La numarul de linii, 1000 si ceva nu mi se par multe pentru toate chestiile care le ofera tema.

Plus ca 2.5mb pentru o tema de content sharing(imagini / video-uri / etc), la cate informatii sunt pe prima pagina, chiar nu mi se pare mult deloc. Sa ai un smartphone si sa n-ai un net cel putin decent mi se pare aiurea.

Asta-i doar parerea mea. O sa ma mai uit sa vad unde mai pot lucra(minify css/html, optimizare imagini).

[infected]

Am scos 42 mobil si 50 desktop, trebuie sa incep sa fac niste schimbari...

[vertedi]

La majoritatea website-urilor mele am combinat CSS-urile si le-am comprimat.

Ce am invatat eu despre optimizarea on-page a unui website:
- combinarea CSS-urilor si incarcate dintr-un CSS, comprimat. Eu prefer sa il incarc din root sau CDN
- la fel cu fisierele JS, insa nu este posibil tot timpul.
- declararea dimensiunilor pentru imagini. Foarte multe scripturi nu au declarata dimensiunea la thumbnail sau slidere, lucru care scade procentul de optimizare
- coduri in .htaccess, care ajuta la cache, imagini, JS-uri, etc. Iata ce am in .htaccess:

FileETag none
ExpiresActive On
ExpiresByType image/ico A15552000
ExpiresByType image/gif A31556926
ExpiresByType image/png A31556926
ExpiresByType image/jpg A31556926
ExpiresByType image/jpeg A31556926
ExpiresByType text/javascript A31556926
ExpiresByType text/css A31556926
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$" >
Header set Cache-Control "max-age=31556926, public"
</FilesMatch>
<IfModule mod_expires.c>
ExpiresActive on
ExpiresByType image/gif "access plus 1 months"
ExpiresByType image/jpeg "access plus 1 months"
ExpiresByType image/ico "access plus 1 months"
ExpiresByType image/png "access plus 1 months"
ExpiresByType text/css "access plus 1 months"
ExpiresByType application/x-javascript "access plus 1 months"
</IfModule>

<IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl|jpg|png|gif)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>

Header set Cache-Control "public"
ExpiresActive On
ExpiresDefault A18000
ExpiresByType image/gif A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/png A2592000
ExpiresByType image/ico A2592000
Expiresbytype text/js A21600
Expiresbytype text/js "access plus 1 year"
ExpiresByType text/php "access plus 1 year"
ExpiresByType text/html "access plus 1 year"
ExpiresByType text/css "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
Header set Cache-Control "public"
ExpiresByType image/jpg "access plus 1 year"
Header set Cache-Control "public"
ExpiresByType image/jpeg "access plus 1 year"
Header set Cache-Control "public"
ExpiresByType image/png "access plus 1 year"
Header set Cache-Control "public"
ExpiresByType image/x-icon "access plus 1 month"

<FilesMatch "\.(ico|pdf|flv)$">
Header set Cache-Control "max-age=29030400, public"
</FilesMatch>

<FilesMatch "\\.(js|css|html|htm|php|xml)$">
SetOutputFilter DEFLATE
</FilesMatch>

<IfModule mod_headers.c>
<FilesMatch "\.(bmp|css|flv|gif|ico|jpg|jpeg|js|pdf|png|svg|sw f|tif|tiff)$">
Header set Last-Modified "Mon, 31 Aug 2010 00:00:00 GMT"
</FilesMatch>
</IfModule>

Exista servere slab configurate care nu suporta toate codurile insa, se poate rezolva si acolo. Eu am intalnit unul in Germania si unul in Austria, in rest bine peste tot.

Pentru optimizarea imaginilor si a fisierelor CSS, sau JS, care nu pot fi combinate, folosesc Page Speed, pentru Firefox. La website-urile statice PHP sau HTML, procentul de optimizare poate ajunge la 100%, testand cu Page Speed, pentru firefox. Cu Page Speed Insights, nu ai cum sa ajungi la asemenea procent. Acolo ar trebui sa ai un website fara CSS, sau JS.

Diferente intre Page Speed Firefox si Insights:

- site cu 100/100 optimizare la Page Speed, are 92 cu 98, la Insights
- site cu 99/100 optimizare la Page Speed, are 86 cu 92, la Insights - aici se incarca de pe un server din Romania, destul de slab

[casperel]

Sunt un adept al optimizarilor de orice fel, dar hai sa incercam sa nu devenim "sclavii" unor cifre.