javascrip{filter}t performance optimization

fanxiaolin84 · Zveřejněno 04.12.2017 20:23:14

1. Respektovat vlastnictví předmětu
 Nepřidávat atributy do instancí nebo prototypů;
 Nepřidávat metody do instancí nebo prototypů;
 Nepředefinujte metody, které již existují.
Nejlepší způsob, jak toho dosáhnout, je nikdy neměnit objekty, které vám nepatří. Vlastnictví objektu znamená, že jste ho vytvořili, například vlastní typ nebo objekt doslovný, který jste vytvořili sami. Pole a dokumenty samozřejmě nejsou vaše, existují ještě před vykonáním kódu.
2. Vyhnout se globálním proměnným
Vytvořte maximálně globální proměnnou, která umožní existenci dalších objektů a funkcí. Podívejte se na následující příklady:
//两个全局量——避免！！
var name = "Nicholas";
funkce sayName(){
upozornění (jméno);
}
Tento kód obsahuje dvě globální veličiny: název proměnné a funkci sayName(). Ve skutečnosti můžete vytvořit objekt, který obsahuje obojí, jak je ukázáno v následujícím příkladu:
//一个全局量——推荐
var MyApplication = {
name: “Nicholas”,
sayName: function(){
alert(this.name);
}
};
3. Vyhněte se srovnávání s nulovou
 Pokud by měla být hodnota referenčního typu, použijte operátor instanceof k ověření jeho konstruktora;
 Pokud by měla být hodnota základní typ, použijte typeof pro kontrolu jejího typu;
 Pokud chcete, aby objekt obsahoval konkrétní název metody, použijte operátor typeof k zajištění, že metoda s tímto jménem existuje na objektu.
(Zde doporučuji svou skupinu pro webové front-end učení a výměnu: 675498134, ať už jste začátečník nebo bůh, vítám vás, abyste přišli, učili se, komunikovali a čas od času sdíleli suché zboží, včetně nejnovějších materiálů a tutoriálů, které jsem si sám sestavil, abych vám je předal, a jsou tu technici odborníci, kteří frontendové znalosti každý den živě vysvětlují. Začátečníci i pokročilí přátelé jsou vítáni, aby se společně učili, komunikovali a dělali pokroky. ）
4. Používejte konstanty
Ačkoliv Javascrip{filter}t nemá formální pojem konstant, je užitečný. Tato myšlenka oddělení dat od aplikační logiky může data měnit, aniž by hrozilo vznik chyb. Podívejte se na následující příklady:
var konstanty = {
INVALID_VALUE_MSG: "Neplatná hodnota!",
INVALID_VALUE_URL: "/errors/invalid.php"
};
function validate(value){
if (!value){
alert(Constants.INVALID_VALUE_MSG);
locatio{filter}n.href = Constants.INVALID_VALUE_URL;
}
}
5. Vyhněte se globálnímu vyhledávání
Pravděpodobně nejdůležitější pro optimalizaci výkonu skriptu je věnovat pozornost globálním vyhledáváním. Používání globálních proměnných a funkcí je rozhodně dražší než lokální, protože zahrnuje vyhledávání v řetězci rozsahu. Podívejte se na následující funkci:
function updateUI(){
var imgs = document.getElementsByTagName("img");
pro (var i=0, len=imgs.length; I < Len; i++){
imgs[i].title = document.title + " image " + i;
}
var msg = document.getElementById("msg");
msg.innerHTML = "Aktualizace dokončena.";
}
Funkce může vypadat naprosto v pořádku, ale obsahuje tři odkazy na globální objekt dokumentu. Pokud je na stránce více obrázků, reference dokumentu ve smyčce for se vykoná několikrát nebo dokonce stovkykrát, pokaždé při vyhledávání scope chain. Vytvořením lokální proměnné směřující na objekt dokumentu můžete zlepšit výkon této funkce tím, že omezíte globální vyhledávání jednou:
function updateUI(){
var doc = dokument;
var imgs = doc.getElementsByTagName("img");
pro (var i=0, len=imgs.length; I < Len; i++){
imgs[i].title = doc.title + " image " + i;
}
var msg = doc.getElementById("msg");
msg.innerHTML = "Aktualizace dokončena.";
Zde nejprve umístěte objekt dokumentu do proměnné local doc; Pak původní dokument nahraďte zbytkem kódu. Ve srovnání s původní verzí má současná funkce jen jedno globální vyhledávání, což je rozhodně rychlejší.
6. Další opatření pro výkon
 Nativní metody jsou rychlejší – Kdykoli je to možné, používejte nativní metodu místo toho, abyste si ji sami přepisovali pomocí Javascrip{filter}t. Nativní metoda je napsána v kompilovaném jazyce, jako je C/C++, takže je mnohem rychlejší než Javascrip{filter}t. Nejvíce zapomenutou věcí na Javascrip{filter}t je složitá matematika, kterou lze najít v matematických objektech; Tyto metody jsou mnohem rychlejší než jakákoli jiná metoda napsaná pomocí Javascrip{filter}t, například sinus a kosinus.
 Switch příkazy jsou rychlejší – Pokud máte sérii složitých if-else příkazů, můžete získat rychlejší kód převodem do jednoho switch příkazu. Také můžete dále upřesnit výrok o změně tím, že ho uspořádáte v pořadí od nejpravděpodobnější po nejméně pravděpodobnou.
 Bitové operátory jsou rychlejší – Při provádění matematických operací jsou bitové operace rychlejší než jakékoli Booleovské nebo aritmetické operace. Selektivní nahrazení aritmetických operací bitovými operacemi může výrazně zlepšit výkon složitých výpočtů. Logika jako modulus, logika a součtová logika může být považována za nahrazenou bitovými operacemi.

QWERTYU · Zveřejněno 05.12.2017 9:33:13

Naučil se

[JavaScript] javascrip{filter}t performance optimization

Partitura

Prohlížené sekce