Tentokrat postup k optimalizacii CSS nebude siahodlhy, cela zalezitost sa da dosiahnut velmi jednoducho. Sam pouzivam tento postup k uplnej spokojnosti.
1. Pokial to je mozne pouzivam iba jeden CSS subor.
Ak si to aplikacia vyslovene nevyzaduje, je vhodne vsetky CSS subory zdruzit do jedneho.
2. Komprimujem CSS subor
Excelentny online nastroj na komprimaciu CSS suboru je CleanCss Nastroj vsak funguje podobne ako nastroje na komprimaciu javascriptu. Vymaze biele miesta, komentare a zdruzi funkcie. Preto je nevyhnutne povodny subor si zalohovat. Za pomoci tohto nastroja je mozne nastavit si uroven komprimacie az na tazko citatelnu takze zaloha je nevyhnutna.
3. .htaccess subor na komprimaciu + uchovavanie v pamati browsera
Cez .htaccess zariadime extra komprimaciu cez MOD DEFLATE + spravnym cachingom (kesovanim) prikazeme browseru ako dlho si ma kokretny subor pamatat. Nastavenie cachingu sa da samozrejme aj cez meta tagy, osobne vsak preferujem .htaccess subor. Takze najprv spominany MOD DEFLATE. Do .htaccess suboru napiseme riadok:
AddOutputFilterByType DEFLATE text/css
Samotne nastavenie cachingu je mozne previest dvoma sposobmi. Ten prvy vyzera takto:
# cache text, css, and javascript files for one week
<FilesMatch ".(js|css|pdf|txt)$">
Header set Cache-Control "max-age=604800"
</FilesMatch>
A druhy sposob vyzera takto:
# alternate method for file caching
ExpiresActive On
ExpiresDefault A604800
ExpiresByType image/x-icon A2419200
ExpiresByType application/x-javascript A2419200
ExpiresByType text/css A2419200
Pri oboch sposoboch vidime cisla ktore prikazuju browseru dlzku doby na uchovavanie v pamati. Pre tych co nevedia ako ich nastavit , mala vysvetlivka:
300 = 5 minut
2700 = 45 minut
3600 = 1 hodina
54000 = 15 hodin
86400 = 1 den
518400 = 6 dni
604800 = 1 tyzden
1814400 = 3 tyzdne
2419200 = 1 mesiac
26611200 = 11 mmesiacov
29030400 = 1 rok = bez expiracie
Samotna uprava CSS suboru a nastavenie pre jeho rychle nacitavanie vobec nie je zlozite, je vsak o to dolezitejsie a preto by sme ho nemali podcenovat. Subor CSS dokaze dosiahnut obdivuhodnych rozmerov ktore znamenaju zvysenie obsahu prenesenych dat a znizuju rychlost nacitania.
V dalsom clanku si popiseme dalsie alternativne triky s .htaccess ktore nas web mozu este viac zrychlit.
