ETags, Expires Headers, Cache-Control, Gzip, CDN

5 naročnikov

Torej! Pred kakim mesecem sem si naložil YSlow plugin za Firebug in malo spremljal spletne strani - predvsem strani, ki jih izdelujem.
Kmalu sem ugotovil na katerih področjih moje strani dosegajo najslabše rezultate.
To so:
+ CDN - Content Delivery Network
+ Expires Headers
+ ETags

Na svojem strežniku sem kmalu po uporabi YSlow-a omogočil mod_deflate. Rezultat je bil očiten - do 30% hitrejši load strani in skoraj 50% zmanjšan prenos podatkov. Kasneje sem omogočil še ETags. Tudi nam tem sem bil precej presenečen - še dodatnih 30% hitrejši load strani plus ni potrebe po prenašanju podatkov pri vsakem obisku.

Zdaj me pa zanima naslednje:
+ Ali tudi kdo izmed vas uporablja vse naštete 'dodatke'?
+ Se vam konkretno pozna na loadu strani in prenosu podatkov?
+ Je mogoče moddeflate in ETage vklopiti preko .htaccessa ali samo preko httpdconf datoteke? Sprašujem zaradi hostinga - kjer ne moreš urejati httpd_conf filetka...
+ CDN - da ali ne? Je vredu zgolj poddomena cdn.domena.si ali različen IP?
+ Expires Headers - da ali ne (meni se zdijo idiotski ali pa jih zgolj ne razumem =))?
+ Zakaj Gzip in ETagi skupaj ne delujejo najbolje v YSlow (če so komponente gzipane izipisuje napako pri ETagu, če je ETag pravilen jih ne gzipa... bug)?
+ Kaj je najbolje vklopiti in kaj najbolje izklopiti? Stric Google pove 1001 idejo ampak nič konkretnega... =)

Veliko vprašanj ampak me stvari kar precej zanimajo in hitreje izvem če mi nekdo pove kot pa da sam iščem in testiram vseh 1000 različnih možnosti =)

Lep pozdrav

Res ni nikjer nikogar, ki bi malo opisal lastne izkušnje? =)

McDave:
Res ni nikjer nikogar, ki bi malo opisal lastne izkušnje? =)

Tle najboljše da pokličeš mr. Pek-a, ki bo to vse razložil :)

Lep pozdrav!

Uporabljam ETage, Expire, CDN in še kaj...

• ETagi se posredujejo preko spletnega strežnika. Sestavljeni so iz inoda datoteke, velikosti in zadnje spremembe. (Nabor parametrov lahko spremeniš preko konfiguracije strežnika)

• Expire header se doda vsebini ko želiš, da njen obstoj poteče. S pomočjo expire lahko brskalniku, ki razume expire poveš do kdaj naj vsebino "kešira". To uporabiš recimo za CSS, JS in kakšne slike, ko se ne spreminjajo

• Deflate oziroma GZIP vzebin je mogoč če tvoj brskalnik podpira tolmačenje in prenos gzipane vsebine. V bistvu stisneš vsebino in brskalnik jo odpakira. To lahko delaš preko spletnega strežnika oziroma v samem programskem jeziku (php gzip)

• CDN - Content Delivery Network je sistem kjer statične vsebine prestaviš na svoj strežnik oziroma omrežje strežnikov. Recimo flickr ima <nekaj>.static.flickr.com kjer hrani slike. Za CDN ponavadi izklopiš vse kukije, hederje in absolutno vse kar ne rabiš.

Potem pa lahko narediš še minify javascripta pa kakšno dodatno kompresiranje css-a iz strani vsebine.

Vsi ti okrepi občutno pospešijo celoten experience. Predvsem zaradi tega ker zmanjšaš promet do in iz strežnika.

mod_deflate seveda lahko vklopiš tudi preko .htaccessa:
AddOutputFilterByType DEFLATE text/plain text/xml text/html text/css text/javascript application/javascript application/x-javascript

Ena stvarca, ki sem jo opazil včeraj:

#button {background:url(../images/button.png) no-repeat 0 0;}
#button span {background:url(../images/button.png) no-repeat 100% 0;}

je veliko slabše kot

#button,
#button span {background:url(../images/button.png) no-repeat 0 0;}
#button span {background-position:100% 0;}

Če opazuješ zavihek "Net" v Firebugu, boš opazil, da pri zgornji CSS kodi dejansko sliko zahteva dvakrat, pri spodnjem pa samo enkrat. Se kar pozna.

Kar se tiče pa ETagov, jih seveda lahko vklapljaš in izklapljaš preko .htaccess, npr takole:

# ETags disable
FileETag none