Zaměřte se na frontend

Potřebujete zvýšit výkon vašich stránek z pohledu koncového uživatele? Zaměřte se na frontend, ne na backend. To je obsah prezentace Steva Sounderse z Yahoo. A proč? Při analýze výkonu Yahoo stránek se ukázalo, že pouze 12% z doby potřebné pro zobrazení stránek je čas strávený generováním obsahu na serveru. Zbytek je přenos dat a práce klienta. Tento průzkum byl potvrzen na výkonu 9 z 10 TOP10 amerických webů, kdy více jak 20% zlepšení v rychlosti zobrazení stránek po natažení všeho cachevatelného do cache zaznamenal pouze Google.

A jaké jsou tedy rady:

1. čím méně HTTP requestů, tím lépe - spojujte jvascriptové a CSS soubory, používejte CSS Sprites
   
2. používejte CDN (Content Delivery Network) - distribuujte nejprve statický a pak dynamický obsah
3. používejte Expires hlavičky - umožní cachování obsahu
4. gzipujte posílaný obsah - 90% klientů podporuje kompresi obsahu pomocí gzipu, využijte jej
5. CSS stylesheety dejte na začátek stránky - IE zobrazí stránku, až když má nateženy všechny stylesheety, proto je nutné je začít stahovat co nejdřív
6. javascript naopak dejte na konec - máte-li javascript inline v dokumentu, pak blokuje renderování něčeho viditelného, je-li jako externí soubor, pak blokuje (především v IE) stahování něčeho vizuálního
7. nepoužívejte CSS výrazy - něco jako width: expression (document.body.clientWidth < 600 ? "600px" : "auto"); příšerně zpomaluje stránku, protože takový výraz se vyhodnocuje pořád (při pohybu myši, při stisku klávesy, ...)
8. CSS a javascript mají být v externích souborech - sice přidávají HTTP request, ale mohou být cachovány
9. minimalizovat počet DNS lookupů
10. Minify Javascript (případně obfuscate) - zmenší objem javascriptu, ale nemění funkci
11. vyvarujte se redirectů - zablokují renderování stránky a oddalují jej
12. odstraňte duplicity - ve scriptech, stylesheetech, ...
13. snažte se používat ETags
14. udělejte AJAX cachovatelný - i requesty prováděné pomocí AJAX by měly být cachovány
    

Musím říci, že tato prezentace byla pro mě překvapující, protože bych čekal, že za zvýšením výkonu stránek bude nějaká magická serverová technologie nebo vychytávka. A ejhle ono ne. Je pravda, že na přizpůsobení stránek rychlejšímu zpracování na klientu se moc velká pozornost nevěnuje, zde je taková malá kapesní kuchařka.

Tento příspěvek je spíše lákáním na shlédnutí ani ne 40 min prezentace, jistě je to zajímavé poslouchání.

PS: v prezentaci se hovoří o plugin do Firefoxu YSLOW, který analyzuje stránky a říka proč jsou pomalé, rozhodně stojí za vyzkoušení, jistě se dozvíte zajímavé věci.