xom`s pinion - Tom Hnatovsky Blog
PF2010
Rok s rokem se opět schází a já se vrací k blogu. Roční blogo-pauza mi pročistila hlavu a dodala vizi, jak by měl vypadat obsah mého blogu. Chci zde tedy publikovat pouze technické informace, návody, kusy kódu, tutoriály - souhrnně se bude jednat pouze o témata spojená s vývojem webů.
Držte mi palce, ať mám morál nápady převést na obrazovku monitoru.
PS: Blog běží na novém pokusném redakčním systému, který má spoustu dětských nemocí, ale při jehož vývoji jsem se hodně naučil. (Nette mi bylo příkladem několika vhodných postupů, které jsem použil.) Chyby budu postupně během ledna odlaďovat. Pokud na něco nepříjemného narazíte, zmiňte se prosím v komentářich.
Díky a přeji vám krásný nový rok
PF2009
Do nového roku v novém, novou cestou s novými nápady.
(Poslední příspěvek na této staré doméně)
Jak na cachování CSS
Máte projekt, který navštěvuje opakovaně mnoho lidí denně a přitom potřebujete nahrát nové CSS, které zásadně mění zobrazení webu. Prakticky ihned vás napadne, že si prohlížeče CSS soubory cachují. Musíte proto vymyslet způsob, jak donutit prohlížeč návštěvníka, aby zahodil staré CSS a nahrál si nové! Metoda, že mu napíšeme vzkaz, aby zmáčkl CTRL+F5 se nepočítá ;)
1. Změňte název CSS souboru
Po každé modifikaci CSSka změňte název souboru a zároveň jeho odkaz v HTML, metody pro tento způsob odcachování jsou dvě – kompletní změna názvu souboru a přidání počitadla, což je v praxi více využíváno. CSS soubor pro tento způsob práce je ve tvaru style#.css, kde # je zástupným znakem za počet aktuálních přepisů souboru.
2. Parametrizujte CSS soubor
Tato metoda vychází z předchozí, liší se pouze v tom, že nemusíte přepisovat název souboru, stačí vám aktualizovat odkaz v HTML. V meta tagu link bude okdaz na style.css?v=#. Název proměnné je na vás, stejně tak to, co použijete za #.
3. Automaticky parametrizujte CSS soubor
Tato metoda vychází z výhod předchozí, kterou ještě obohacuje o automatickou parametrizaci pomocí PHP (či jiného jazyku). Idea je v doplňování inode poslední aktualizace souboru style.css – definice odkazu na soubor může vypadat následovně style.css?v= Toto řešení má nesporné výhody, že se nemusíte starat o to, že se CSS zaktualizuje, na druhou stranu to přináší vyšší zatížení serveru – při každém načtení stránky se musí ptát style.css jestli se nezměnil.
4. Použití mod_expires v Apache
Pokdud váš hosting podporuje text/css.
ExpiresActive On
ExpiresDefault "access plus 5 hours"
ExpiresByType text/css "access plus 10 minutes"
Tato metoda vám ušetří starosti, ale nezajistí okamžitou obnovu CSS ihned po uložení. Ono by šlo nastavit ExpiresByType text/css na plus 1 second, ale to by se návštěvníkům necachovala CCS prakticky nikdy.
Vybrali jste si svou metodu odcachování CSS? Já osobně používám dvojku, se kterou mám sice práci navíc, ale po každé majoritní změně CSSka na něj rád upravím odkaz v stránky.
5. Použití mod_rewrite v Apache
Na základě komentáře Pavla Šindelky s odkazem na jeho článek o zrychlení načítání JavaScriptu jsem doplnil následující řešení, které kombinuje první metodu s podporou
Následující řádek definuje RewriteRule, který přeloží style.v3.css na style.css.
RewriteRule ^/(.*\.)v[0-9.]+\.(css)$ /$1$2 [L]
Vybrali jste si svou metodu odcachování CSS? Já osobně používám dvojku, se kterou mám sice práci navíc, ale po každé majoritní změně CSSka na něj rád upravím odkaz v stránky.