Nedávno jsem začal pracovat v nové společnosti a mají existující aplikaci s 1000 řádky kódu Javascript. Základní linie obsahuje desítky souborů JS s více než 10 000 vlastními řádky kódu, používají také více knihoven třetích stran, jako jsou Jquery, Livequery, JQTransform a další. Jednou z hlavních stížností, které uživatelé obdrželi, je pomalost provozu webu na straně klienta. Dostal jsem za úkol optimalizovat a zlepšit výkon JS. Mým prvním krokem bude samozřejmě posun vpřed k nejnovější knihovně Jquery a začlenění JSMin do procesu sestavování. Kromě toho by mě zajímalo, jestli má někdo nějaké tipy, kde začít s optimalizací na tak obrovské základně kódu?
Odpověď
Můžete zkusit nainstalovat DynaTrace Ajax Edition (stažení zdarma zde) a uvidíte, co vám to řekne. Myslím, že podporuje pouze IE8, ale to je pravděpodobně stejně dobré místo, kde začít. Podle mého názoru má mnohem důkladnější a srozumitelnější rozhraní profileru než Firebug nebo Chrome.
Jedna věc, která mě napadá, je „Livequery“, který pokud není používán velmi opatrně může způsobit obrovské problémy s výkonem.
Pamatujte si toto:v tak velké kódové základně, vyvinuté v průběhu času a možná ne pomocí nejmodernějších dostupných technik Javascriptu, budou vaše skutečné problémy špatné algoritmy ve svém vlastním kódu. Novější knihovny a metody minifikace/optimalizace jsou dobré nápady, ale první věc, kterou musíte udělat, je najít stránky, které se vám zdají pomalé, a poté začít profilovat. Podle mých zkušeností ve velké staré kódové základně, jako je tato, najdete něco hrozného skutečně rychle. Nainstalujte miniaplikaci na plochu, která sleduje využití procesoru. Je to skvělý způsob, jak zjistit, kdy kód stránky způsobuje přímé zpomalení prohlížeče, nikoli pouze zpoždění sítě. Jakýkoli velký nárůst využití procesoru prohlížeče po jakoukoli významnou dobu by měl být velkým varovným signálem.