A JavaScript-programozók hozzászoktak a párhuzamosság színleléséhez, de van mód a valódi párhuzamosság elérésére, amelyet most használnia kell.

A JavaScript megküzdhet a teljesítményigényes feladatokkal, mert egyszálú nyelv. A párhuzamosság használatával többszálas végrehajtást érhet el JavaScriptben, és javíthatja modern webalkalmazásainak teljesítményét és válaszkészségét.

Parallelizmus a JavaScript programozásban

A párhuzamosság kulcsfontosságú a modern számítástechnikában a teljesítmény és a méretezhetőség javítása érdekében. Ezt a rendelkezésre álló erőforrások hatékony felhasználásával teszi.

A programozás párhuzamosságának elérésére általánosan használt technika a többszálú feldolgozás. A JavaScript-szál azonban egyszálú rendszer, és egyszerre csak egy feladatot tud kezelni. Ez azt jelenti, hogy nem ismeri a párhuzamos programfuttatásokat.

JavaScript hamis párhuzamos programozás

Gyakori tévhit a párhuzamossággal kapcsolatban, hogy ezt a használatával elérheti aszinkron programozási technikák mint az async/await, a visszahívások és az ígéretek:

instagram viewer
// Async/await függvény, amely egy hálózati kérést szimulál
asyncfunkciófetchData() {
const válasz = várja fetch();
const adatok = várja válasz.json();
Visszatérés adat;
}

// Visszahívási funkció, amely naplózza a lekért adatokat a konzolra
funkciólogData(adat) {
konzol.log (adatok);
}

// Promise.all() metódus, amely több ígéretet hajt végre párhuzamosan
Ígéret.minden([
fetchData(),
fetchData(),
]).akkor((eredmények) => {
konzol.log (eredmények);
});

// Hívja meg a fetchData függvényt, és adja át a logData függvényt visszahívásként
fetchData().then (logData);

Ezek a technikák valójában nem hajtanak végre kódot párhuzamosan. A JavaScript az eseményhurkot használja a párhuzamos programozás utánzására az egyszálú kialakításában.

Az eseményhurok a JavaScript futási környezet alapvető része. Lehetővé teszi aszinkron műveletek, például hálózati kérések végrehajtását a háttérben anélkül, hogy blokkolná a fő egyetlen szálat.

Az eseményhurok folyamatosan ellenőrzi, hogy vannak-e új események vagy feladatok egy sorban, és egyenként hajtja végre azokat. Ez a technika lehetővé teszi a JavaScript számára, hogy párhuzamosságot és elméleti párhuzamosságot érjen el.

Egyidejűség vs. Párhuzamosság

Az egyidejűséget és a párhuzamosságot gyakran félreértik és felcserélik a JavaScript világában.

A JavaScript párhuzamossága arra utal, hogy több feladatot is végre lehet hajtani a feladatok végrehajtásának átfedésével. Ahol egy feladat elkezdődhet, mielőtt a másik befejeződik, de a feladatok nem kezdődhetnek és nem is fejeződhetnek be egyszerre. Ez lehetővé teszi a JavaScript számára a műveletek hatékony kezelését, például adatok lekérése egy REST API-ból vagy fájlok olvasása a fő végrehajtási szál blokkolása nélkül.

A párhuzamosság viszont arra utal, hogy több feladatot egyszerre több szálon keresztül lehet végrehajtani. Ezek a háttérszálak önállóan és egyidejűleg is végrehajthatnak feladatokat. Ez lehetőséget teremt a valódi párhuzamosság elérésére a JavaScript alkalmazásokban.

A JavaScript alkalmazásai valódi párhuzamosságot érhetnek el a Web Workers használata.

A webmunkások bevezetik a párhuzamosságot a JavaScriptbe

A Web Workers a modern webböngészők olyan funkciója, amely lehetővé teszi a JavaScript-kód futtatását a háttérszálakban, a fő végrehajtási száltól elkülönítve. A fő száltól eltérően, amely a felhasználói interakciókat és a felhasználói felület frissítéseit kezeli. A Web Worker a számításigényes feladatok elvégzésére szolgálna.

Az alábbiakban egy diagramon látható a Web Worker JavaScriptben való működése.

A fő szál és a Web Worker üzenettovábbítással kommunikálhat. Használni a postMessage üzenetküldési mód és a üzenetben eseménykezelő üzenetek fogadásához, utasításokat vagy adatokat adhat át oda-vissza.

Web Worker létrehozása

Web Worker létrehozásához külön JavaScript-fájlt kell létrehoznia.

Íme egy példa:

// main.js

// Új Web Worker létrehozása
const munkás = új Munkás("dolgozó.js");

// Üzenet küldése a Web Workernek
worker.postMessage('Üdvözlöm a főszálat!');

// Hallgassa meg a Web Worker üzeneteit
dolgozó.onmessage = funkció(esemény) {
konzol.log("Üzenet érkezett a Web Workertől:", event.data);
};

A fenti példa egy új Web Workert hoz létre úgy, hogy átadja az elérési utat a worker szkriptnek (dolgozó.js) érvként a Munkás konstruktőr. Üzenetet küldhet a Web Workernek a postMessage módszerrel, és figyelje meg a Web Worker üzeneteit a üzenetben eseménykezelő.

Ezután létre kell hoznia a dolgozó szkriptet (dolgozó.js) fájl:

// worker.js

// Hallgassa meg a főszál üzeneteit
self.onmessage = funkció(esemény) {
konzol.log("Üzenet érkezett a fő szálból:", event.data);

// Üzenet visszaküldése a főszálhoz
self.postMessage("Üdvözlöm a worker.js-től!");
};

A Web Worker szkript a fő szál üzeneteit figyeli a üzenetben eseménykezelő. Üzenet érkezésekor kijelentkezik az üzenetből esemény.adatok és küldjön új üzenetet a fő szálba a postMessage módszer.

A párhuzamosság kihasználása a webmunkásokkal

A Web Workers elsődleges használati esete a számításigényes JavaScript-feladatok párhuzamos végrehajtása. Ha átrakja ezeket a feladatokat a Web Workersre, jelentős teljesítményjavulást érhet el.

Íme egy példa arra, hogyan használjunk webmunkás segítségével nehéz számításokat:

// main.js

const munkás = új Munkás("dolgozó.js");

// Adatok küldése a Web Workernek számításhoz
worker.postMessage([1, 2, 3, 4, 5]);

// Hallgassa meg a Web Worker eredményét
dolgozó.onmessage = funkció(esemény) {
const eredmény = event.data;
konzol.log("Számítási eredmény:", eredmény);
};

Worker.js:

// Figyeljen a fő szálból származó adatokra
self.onmessage = funkció (esemény) {
const számok = esemény.adatok;

const eredmény = performHeavyCalculation (számok);

// Az eredmény visszaküldése a főszálba
self.postMessage (eredmény);
};

funkcióvégreHeavyCalculation(adat) {
// Végezzen összetett számítást a számtömbön
Visszatérés adat
.térkép((szám) =>Math.pow (szám, 3)) // Cube minden szám
.szűrő((szám) => szám % 20) // Páros számok szűrése
.reduce((összeg, szám) => összeg + szám, 0); // Összeadja az összes számot
}

Ebben a példában a fő szálból egy számtömböt ad át a Web Workernek. A Web Worker elvégzi a számítást a megadott adattömb felhasználásával, és az eredményt visszaküldi a fő szálnak. A végreHeavyCalculation() A függvény minden számot leképez a kockájára, kiszűri a páros számokat, és végül összeadja őket.

Korlátozások és szempontok

Bár a Web Workers mechanizmust biztosít a párhuzamosság elérésére a JavaScriptben, fontos figyelembe venni néhány korlátozást és szempontot:

  • Nincs megosztott memória: A Web Workerek külön szálakban működnek, és nem osztanak meg memóriát a fő szálal. Így nem férhetnek hozzá közvetlenül a változókhoz vagy objektumokhoz a főszálból üzenettovábbítás nélkül.
  • Sorozatosítás és deszerializáció: Amikor adatot ad át a fő szál és a Web Workers között, sorba kell állítani és deszerializálni kell az adatokat, mivel az üzenettovábbítás szöveges kommunikáció. Ez a folyamat teljesítményköltséggel jár, és hatással lehet az alkalmazás általános teljesítményére.
  • Böngésző támogatás: Bár a Web Workers a legtöbb modern webböngészőben jól támogatott, egyes régebbi böngészők vagy korlátozott környezetek részben vagy egyáltalán nem támogatják a Web Workereket.

Valódi párhuzamosság elérése JavaScriptben

A JavaScript párhuzamosítása egy izgalmas koncepció, amely lehetővé teszi a feladatok valódi egyidejű végrehajtását, még egy elsősorban egyszálú nyelven is. A Web Workers bevezetésével kiaknázhatja a párhuzamosság erejét, és jelentős teljesítménynövekedést érhet el JavaScript-alkalmazásaiban.