Jak mohu snížit náklady na načítání velkých knihoven JS?
Pokud pro svou stránku používám velkou knihovnu Javascript, jak mohu zajistit, aby to neovlivnilo používání webu uživatelem?
Můžete dělat 4 věci.
- Minifikujte svůj soubor JS. Tím se odstraní všechny komentáře a Whitespace a zmenší se jeho velikost.
- Zkombinujte své soubory JS na každé stránce tak, aby existoval pouze jeden soubor.
- Při odesílání souborů gzip pomocí balíčku použijte balíček. Díky tomu budou ještě menší
- Vložte Javascript, který není vyžadován, okamžitě do spodní části stránky, aby se načítala na konci. To uživateli umožní zobrazit a používat stránku ještě před úplným načtením JS.
A někteří další lidé navrhli:
- Apache automaticky zpracovává kompresi (a ukládání komprimovaného obsahu do mezipaměti), což výrazně zjednodušuje správu souborů
- Zajištění správného mezipaměti JavaScriptu přinese velké výhody.
- Zástupné domény (s více URI) umožní více souběžných připojení. Předběžné načítání není jen pro obrázky /
Pokud používáte běžné knihovny (například jQuery, Prototype nebo Dojo), můžete soubor stáhnout do Googlu a vytvořit z nich sloužit , získáte několik výhod:
- Nemusíte se bát minifikace a zipování atd
- Není to vaše šířka pásma
- Tyto soubory pocházejí z jiné domény, takže můžete (alespoň částečně) vyřešit limit 2 paralelních požadavků na jméno hostitele
- Pokud budete mít štěstí, uživatel již navštívil jiný web, který použil stejnou knihovnu od stejného poskytovatele, takže ji již má v mezipaměti prohlížeče.
Poznámka: Verze, kterou požadujete, může mít velký vliv na vlastnosti ukládání do mezipaměti: dotazem na jQuery 1.4.2 získáte soubor, který lze uložit do mezipaměti po dobu jednoho roku, ale 1.4 lze uložit do mezipaměti pouze na jednu hodinu.
Můžete vložit celou knihovnu do jednoho souboru js a zkomprimovat soubor. Je to však opravdu důležité pouze při prvním načtení stránky. Poté bude váš soubor js uložen do mezipaměti v prohlížeči, zejména pokud nastavíte vypršení platnosti mezipaměti dostatečně dlouho. Proto žádný následný přístup již váš soubor js nenačte.
Kromě výše uvedených odpovědí můžete pomocí Google Closure Compiler automaticky komprimovat a optimalizovat JS při integraci s dalšími knihovnami třetích stran (jQuery, YUI, mootools atd.)
Pokud máte několik prvků stránky a přístup do samostatné domény, můžete zvážit hostování všech statických souborů včetně velkého souboru JS ve druhé doméně.
Jak poznamenává Steve Souders ve svém blogu o vysoce výkonných webových stránkách -
... v některých situacích je vhodné vzít spoustu zdrojů, které se stahují na jednu doménu, a rozdělit je na více domén. Říkám této doméně sharding. To umožňuje paralelní stahování více zdrojů, čímž se snižuje celková doba načítání stránky.
jinde píše ..
Prohlížeče otevírají omezený počet připojení na doménu ... Rozdělení nebo sharding požadavků na dvě domény na rozdíl od jedné domény vede k rychlejší stránce, zejména v IE 6 a 7