Spojte CSS soubory a zrychlete načítní stránek

Kombinování více externích souborů do tří či lépe dvou může snížit rychlost načítání stránek. Platí to zvláště u mobilních prohlížečů a uživatelů s internetovým připojením háklivým na latenci.

Podobně jako u externích souborů s JavaScriptem se i u optimalizace CSS doporučuje kombinovat větší množství menších souborů do větších. Například Google doporučuje používat dva. V jednom se budou nacházet data nutná pro vykreslení stránky. Druhý bude obsahovat data, které potřebuje prohlížeč pro stránku po samotném načtení.

Při vývoji se většinou používá více CSS souborů, pro jednotlivé části. Každý vývojář chce mít ten svůj. Ve výsledku ale právě tohle může být problém. Takže před vypuštěním ostré verze by do procesu mělo být zařazeno i sjednocení CSS souborů. Navíc při používání předem určeného počtu se vyhnete problémům, kdy na některé z podstránek bude chybět odkaz na nejnovější CSS soubor, který je součástí nějakého rychlého balíčku změn a úprav.

Další problém více zdrojů může nastat při používání pravidla @import v CSS. Toto pravidlo způsobí, že prohlížeč nemůže stahovat jednotlivé CSS zdroje paralelně a je nutné udělat ještě jedno kolečko, což může nadělat problémy právě u připojení s vysokou latencí. Obecně @import nedoporučuje používat ani Google. Místo vkládání souborů prostřednictvím jiného CSS souboru použijte tag <link>

Obecně by každý snaha o zrychlení webu měla směřovat k snižování počtu dotazů. Čím méně toho vysí ve vzduchu tím lépe.

Share Button

Tento článek byl byl přečten 731 krát

Napsat komentář

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *