Pár tipov ako lepšie optimalizovať JavaScriptový kód

Rozhodol som sa spísať niekoľko tipov pre lepšiu optimalizáciu JavaScriptového kódu, tieto tipy môžete využiť či už na client-side alebo server-side v Node.js.

1. optimalizácia array (polí)

Opakovanie je matka múdrosti a veľa programátorov zabúda na to, že pri cykloch sa vždy (každým loopom) musí zistiť dĺžka poľa, čo vedie k zníženiu performance a zaťaženiu CPU.

// Pomalý zápis
var arr = [...];
for (var i = 0; i < arr.length; i++) {

}

// Lepší zápis
var arr = [...];
for (var i = 0, length = arr.length; i < length; i++) {

}

2. Cacheovanie objektov

Priznám sa, že ešte u nikoho som podobnú optimalizáciu nevidel a dovolím si tvrdiť, že práve podobné optimalizácie vedia zvýšiť performance a znížiť zaťaženie CPU + RAM. V ukážke je znázornený Total.js (Node.js) controller.

// Pomalý zápis
function nejaka_akcia_ktora_vracia_json() {
    this.json({ success: true });
}

// Brutálny zápis
const response = { success: true };

function nejaka_akcia_ktora_vracia_json() {
    this.json(response);
}

Podobný zápis môžete aplikovať aj na Array (polia).

3. Priraďovanie hodnôt je rýchlejšie ako vytváranie objektov

Tento tip naväzuje na tip č.2 s tým, že priraďovanie hodnôt je oveľa rýchlejšie ako vytváranie objektov s následným priradením hodnoty. Podobnú optimalizáciu určite využijete aj v Express.js alebo inom podobnom Node.js frameworku.

// Pomalý zápis
function nejaka_akcia_ktora_vracia_json() {
    this.json({ success: this.query.success === '1' });
}

// Brutálny zápis
const response = { success: true };

function nejaka_akcia_ktora_vracia_json() {
    response.success = this.query.success === '1';
    this.json(response);
}

Metóda SUCCESS() v Total.js používa rovnakú optimalizáciu.

4. Používate "delete" pred "JSON.stringify()"?

Ak áno, mám pre Vás skvelý tip, ktorý Vám dokáže zvýšiť performance. Kľúčové slovo delete je veľmi nápomocné, ale je aj veľmi pomalé. Niekedy proste stačí priradiť hodnotu undefined do nežiadúcej property a výsledok môžete mať rovnaký ako za pomoci delete.

// Pomalý zápis
var obj = { name: 'Peter', age: 30 };
delete obj.name;
console.log(JSON.stringify(obj));

// Brutálny zápis
var obj = { name: 'Peter', age: 30 };
obj.name = undefined;
console.log(JSON.stringify(obj));

5. Cacheovanie dátumu tiež pomáha

Sú prípady, kedy nepotrebujete absolútne presný čas, ale stačí Vám rozdiel +/- 1 minúta. V Total.js to riešim cez property F.datetime ktorá je aktualizovaná každú minútu o aktuálny dátum a čas. Takže ak nepoužívate Total.js a robíte s časom, ktorý nepotrebujete mať na sekundu presný, tak môžete použiť nasledujúci tip na zvýšenie performance:

// V nižšie uvedenej premennej budeme mať vždy uložený aktuálny čas v rozmedzí +/- 30 sekúnd.
var datetime = new Date();
setInterval(function() {
    datetime = new Date();
}, 30000);

6. "string.indexOf()" a "string.lastIndexOf()" vs reguárny výraz

Metódy string.indexOf() a string.lastIndexOf() sú rýchlejšie ako regulárny výraz a doporučujem ich použiť pre jednoduché vyhľadávacie operácie. Taktiež je dobré rozlišovať použitie indexOf() a lastIndexOf(), pretože tu viete získať ešte lepšiu performance, stačí sa zamyslieť, kde najčastejšie sa môže vyskytovať Vami hľadaná fráza - či na začiatku alebo na konci.

7. Menšie funkcie = lepšia performance

Tu nebude nič lepšie ako odkaz na tento článok: https://top.fse.guru/nodejs-a-quick-optimization-advice-7353b820c92e. Chcem len pripomenúť, že táto optimalizácia sa týka len V8.

8. "function.call" vs "function.apply"

Iba v rýchlosti pripomeniem, že function.call() je rýchlejšie ako function.apply() a obidve volania sú niekoľko násobne pomalšie, ako volanie funkcie bez zmeny contextu.