ParallelJS：優(yōu)雅的Web Worker解決方案

ParallelJS為使用Web Worker時可能出現(xiàn)的問題提供了一種優(yōu)雅的解決方案，它提供了一個具有便捷抽象和輔助工具的實用API。 HTML5引入的Worker接口允許創(chuàng)建具有較長運行時間和高計算量需求的函數(shù)，這些函數(shù)可以同時使用以提高網(wǎng)站響應(yīng)速度。 ParallelJS允許對JavaScript代碼進(jìn)行並行化處理，利用同時多線程 (SMT) 更有效地使用現(xiàn)代CPU。 ParallelJS庫提供諸如spawn、map和reduce等方法，分別用於並行執(zhí)行計算、處理數(shù)據(jù)和聚合碎片化結(jié)果。

HTML5帶來的一個最酷的新可能性是Web Workers API的Worker接口。在此之前，我們不得不採用一些技巧來向用戶展示響應(yīng)迅速的網(wǎng)站。 Worker接口允許我們創(chuàng)建具有較長運行時間和高計算量需求的函數(shù)。此外，Worker實例可以同時使用，使我們能夠根據(jù)需要生成任意數(shù)量的這些工作器。在本文中，我將討論為什麼多線程很重要，以及如何使用ParallelJS在JavaScript中實現(xiàn)它。

為什麼需要多線程？

這是一個合理的問題。從歷史上看，生成線程的能力提供了一種優(yōu)雅的方式來劃分進(jìn)程中的工作。操作系統(tǒng)負(fù)責(zé)調(diào)度每個線程的可用時間，這樣優(yōu)先級更高、工作量更大的線程將優(yōu)先於低優(yōu)先級的空閒線程。在過去的幾年裡，同時多線程 (SMT) 已經(jīng)成為訪問現(xiàn)代CPU計算能力的關(guān)鍵。原因很簡單：摩爾定律在每單位面積晶體管數(shù)量方面仍然有效。然而，由於多種原因，頻率縮放不得不停止。因此，必須以其他方式使用可用的晶體管。人們決定，架構(gòu)改進(jìn)（例如SIMD）和多核代表最佳選擇。

為了使用SMT，我們需要編寫並行代碼，即為獲得單個結(jié)果而並行運行的代碼。我們通常需要考慮特殊的算法，因為大多數(shù)順序代碼要么很難並行化，要么效率非常低。原因在於Amdahl定律，該定律指出加速比S由下式給出：

其中N是並行工作器的數(shù)量（例如處理器、核心或線程），P是並行部分。將來可能會使用更多依賴於並行算法的多核架構(gòu)。在高性能計算領(lǐng)域，GPU系統(tǒng)和特殊架構(gòu)（例如英特爾至強(qiáng)Phi）代表了此類平臺。最後，我們應(yīng)該區(qū)分一般的並發(fā)應(yīng)用程序或算法和並行執(zhí)行。並行性是（可能相關(guān)的）計算的同時執(zhí)行。相反，並發(fā)是獨立執(zhí)行進(jìn)程的組合。

JavaScript中的多線程

在JavaScript中，我們已經(jīng)知道如何編寫並發(fā)程序，即使用回調(diào)函數(shù)?，F(xiàn)在可以將此知識轉(zhuǎn)移到創(chuàng)建並行程序中！根據(jù)其自身的結(jié)構(gòu)，JavaScript是在由事件循環(huán)（通常遵循反應(yīng)器模式）調(diào)解的單個線程中執(zhí)行的。例如，這為我們處理對（外部）資源的異步請求提供了一些很好的抽象。它還保證先前定義的回調(diào)始終在相同的執(zhí)行線程中觸發(fā)。沒有與線程相關(guān)的跨線程異常、競爭條件或其他問題。但是，這並沒有讓我們更接近JavaScript中的SMT。隨著Worker接口的引入，已經(jīng)找到了一個優(yōu)雅的解決方案。從主應(yīng)用程序的角度來看，Web Worker中的代碼應(yīng)被視為並發(fā)運行的任務(wù)。通信也是以這種方式進(jìn)行的。我們使用消息API，該API也可用於從包含的網(wǎng)站到託管頁面的通信。例如，以下代碼通過向發(fā)起者發(fā)送消息來響應(yīng)傳入的消息。

window.addEventListener('message', function (event) {
    event.source.postMessage('Howdy Cowboy!', event.origin);
}, false);

理論上，Web Worker也可以生成另一個Web Worker。但是，實際上大多數(shù)瀏覽器禁止這樣做。因此，Web Worker之間通信的唯一方法是通過主應(yīng)用程序。通過消息進(jìn)行的通信是並發(fā)進(jìn)行的，因此只有異步（非阻塞）通信。起初，這在編程中可能很奇怪，但它帶來了許多優(yōu)點。最重要的是，我們的代碼應(yīng)該沒有競爭條件！讓我們來看一個使用兩個參數(shù)表示序列的開始和結(jié)束來在後臺計算素數(shù)序列的簡單示例。首先，我們創(chuàng)建一個名為prime.js的文件，其中包含以下內(nèi)容：

onmessage = function (event) {
    var arguments = JSON.parse(event.data);
    run(arguments.start, arguments.end);
};
function run (start, end) {
    var n = start;

    while (n < end) {
        var k = Math.sqrt(n);
        var found = false;

        for (var i = 2; !found && i <= k; i++) {
            found = n % i === 0;
        }

        if (!found) {
            postMessage(n.toString());
        }

        n++;
    }
}

現(xiàn)在，我們只需要在主應(yīng)用程序中使用以下代碼來啟動後臺工作器即可。

if (typeof Worker !== 'undefined') {
    var w = new Worker('prime.js');
    w.onmessage = function(event) {
        console.log(event);
    };
    var args = { start : 100, end : 10000 };
    w.postMessage(JSON.stringify(args));
}

相當(dāng)多的工作。尤其令人討厭的是使用另一個文件。這產(chǎn)生了很好的分離，但對於較小的任務(wù)似乎完全是多餘的。幸運的是，有一種解決方法?？紤]以下代碼：

var fs = (function () { 
    /* code for the worker */ 
}).toString(); 
var blob = new Blob(
   [fs.substr(13, fs.length - 14)],
   { type: 'text/javascript' }
);
var url = window.URL.createObjectURL(blob);
var worker = new Worker(url);
// Now setup communication and rest as before

當(dāng)然，我們可能希望有一個比這樣的幻數(shù)（13和14）更好的解決方案，並且根據(jù)瀏覽器，必須使用Blob和createObjectURL的回退。如果您不是JavaScript專家，fs.substr(13, fs.length - 14)的作用是提取函數(shù)體。我們通過將函數(shù)聲明轉(zhuǎn)換為字符串（使用toString()調(diào)用）並刪除函數(shù)本身的簽名來做到這一點。

ParallelJS能幫上忙嗎？

這就是ParallelJS發(fā)揮作用的地方。它為一些便利以及Web Worker提供了一個不錯的API。它包括許多輔助工具和非常有用的抽象。我們首先提供一些要處理的數(shù)據(jù)。

var p = new Parallel([1, 2, 3, 4, 5]);
console.log(p.data);

data字段產(chǎn)生提供的數(shù)組。還沒有調(diào)用任何“並行”操作。但是，實例p包含一組方法，例如spawn，它將創(chuàng)建一個新的Web Worker。它返回一個Promise，這使得使用結(jié)果變得輕而易舉。

window.addEventListener('message', function (event) {
    event.source.postMessage('Howdy Cowboy!', event.origin);
}, false);

上面代碼的問題是計算不會真正並行。我們只創(chuàng)建一個單個後臺工作器，它一次性處理整個數(shù)據(jù)數(shù)組。只有在處理完整個數(shù)組後，我們才能獲得結(jié)果。更好的解決方案是使用Parallel實例的map函數(shù)。

onmessage = function (event) {
    var arguments = JSON.parse(event.data);
    run(arguments.start, arguments.end);
};
function run (start, end) {
    var n = start;

    while (n < end) {
        var k = Math.sqrt(n);
        var found = false;

        for (var i = 2; !found && i <= k; i++) {
            found = n % i === 0;
        }

        if (!found) {
            postMessage(n.toString());
        }

        n++;
    }
}

在前面的示例中，核心非常簡單，可能過於簡單。在一個真實的示例中，將涉及許多操作和函數(shù)。我們可以使用require函數(shù)包含引入的函數(shù)。

if (typeof Worker !== 'undefined') {
    var w = new Worker('prime.js');
    w.onmessage = function(event) {
        console.log(event);
    };
    var args = { start : 100, end : 10000 };
    w.postMessage(JSON.stringify(args));
}

reduce函數(shù)有助於將碎片化的結(jié)果聚合到單個結(jié)果中。它提供了一個方便的抽象，用於收集子結(jié)果並在知道所有子結(jié)果後執(zhí)行某些操作。

結(jié)論

ParallelJS為我們提供了一種優(yōu)雅的方式來規(guī)避使用Web Worker時可能出現(xiàn)的問題。此外，我們獲得了一個包含一些有用抽象和輔助工具的不錯的API。將來可以集成進(jìn)一步的改進(jìn)。除了能夠在JavaScript中使用SMT之外，我們可能還想使用矢量化功能。如果支持，SIMD.js似乎是一種可行的方法。在某些（希望不會太遙遠(yuǎn)的）將來，使用GPU進(jìn)行計算也可能是一個有效的選項。在Node.js中存在CUDA（一種並行計算架構(gòu)）的包裝器，但是仍然無法執(zhí)行原始JavaScript代碼。在那之前，ParallelJS是我們充分利用多核CPU處理長時間運行計算的最佳選擇。你呢？你如何使用JavaScript釋放現(xiàn)代硬件的強(qiáng)大功能？

關(guān)於使用ParallelJS的並行JavaScript的常見問題解答 (FAQ)

什麼是ParallelJS，它是如何工作的？

ParallelJS是一個JavaScript庫，允許您通過利用多核處理器來並行化數(shù)據(jù)處理。它的工作原理是創(chuàng)建一個新的Parallel對象並將一個數(shù)據(jù)數(shù)組傳遞給它。然後可以使用.map()方法並行處理此數(shù)據(jù)，該方法將指定的函數(shù)應(yīng)用於數(shù)組中的每個項目。然後在新的數(shù)組中返回結(jié)果。

如何安裝ParallelJS？

可以使用npm（Node.js包管理器）安裝ParallelJS。只需在終端中運行命令“npm install paralleljs”。安裝完成後，您可以使用“var Parallel = require('paralleljs');”在您的JavaScript文件中引用它。

使用ParallelJS的好處是什麼？

ParallelJS允許您充分利用多核處理器進(jìn)行數(shù)據(jù)處理任務(wù)。這可以大大加快大型數(shù)據(jù)集的處理時間。它還提供了一個簡單直觀的API，使並行化代碼變得容易。

我可以在瀏覽器中使用ParallelJS嗎？

是的，ParallelJS可以在瀏覽器中使用。您可以使用腳本標(biāo)籤和ParallelJS文件的URL將其包含在HTML文件中。包含後，您可以像在Node.js中一樣使用Parallel對象。

如何在ParallelJS中使用.map()方法？

ParallelJS中的.map()方法用於將函數(shù)應(yīng)用於數(shù)據(jù)數(shù)組中的每個項目。該函數(shù)作為字符串傳遞給.map()方法。然後在新的數(shù)組中返回結(jié)果。例如，“var p = new Parallel([1, 2, 3]); p.map('function(n) { return n * 2; }');”將返回一個值為[2, 4, 6]的新數(shù)組。

ParallelJS中的.reduce()方法是什麼？

ParallelJS中的.reduce()方法用於使用指定的函數(shù)將數(shù)據(jù)數(shù)組減少為單個值。該函數(shù)作為字符串傳遞給.reduce()方法。例如，“var p = new Parallel([1, 2, 3]); p.reduce('function(a, b) { return a b; }');”將返回值6。

我可以在ParallelJS中鏈接方法嗎？

是的，ParallelJS中的方法可以鏈接在一起。例如，您可以使用.map()方法處理數(shù)據(jù)，然後使用.reduce()方法將結(jié)果組合成單個值。

如何在ParallelJS中處理錯誤？

可以使用.catch()方法處理ParallelJS中的錯誤。此方法接受一個函數(shù)，如果在處理過程中發(fā)生錯誤，則會調(diào)用該函數(shù)。錯誤對象將傳遞給此函數(shù)。

我可以將ParallelJS與其他JavaScript庫一起使用嗎？

是的，ParallelJS可以與其他JavaScript庫一起使用。但是，您需要確保使用.require()方法將庫包含在worker上下文中。

ParallelJS適用於所有數(shù)據(jù)處理任務(wù)嗎？

雖然ParallelJS可以大大加快大型數(shù)據(jù)集的處理時間，但它可能並非所有任務(wù)的最佳選擇。對於小型數(shù)據(jù)集，創(chuàng)建worker和傳輸數(shù)據(jù)的開銷可能超過並行化的益處。最好使用您的具體用例測試ParallelJS，以查看它是否提供了性能優(yōu)勢。

以上是並聯(lián)JavaScript的詳細(xì)內(nèi)容。更多資訊請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！