內嵌 Web Worker 能否簡化部署和縮小？

Web Workers 內聯：繞過單獨的JavaScript 檔案

傳統上，Web Workers 是透過載入單獨的JavaScript 檔案來實例化的，如您所提到的：

<code class="html">new Worker('longrunning.js')</code>

雖然方便，但在使用Closure Compiler 等工具時，這種方法可能會使部署和縮小變得複雜。為了解決這個問題，您可以利用 Blob() 在與主邏輯相同的 HTML 檔案中建立內聯工作器。

使用Blob() 的內聯工作器

以下是建立內聯工作器的方法使用Blob():

1. 在<script> 中定義您的工作腳本類型為「javascript/worker」的元素：</script>

<code class="html"><script id="worker1" type="javascript/worker">
  // Worker code goes here
</script></code>

2. 建立一個以工作腳本為內容的Blob 物件：

<code class="html">var blob = new Blob([
  document.querySelector('#worker1').textContent
], { type: "text/javascript" })</code>

3. 使用window.URL.createObjectURL(blob) 建立一個Worker 物件：

<code class="html">var worker = new Worker(window.URL.createObjectURL(blob));</code>

4. 在主執行緒中處理來自Worker 的訊息：

在主執行緒中處理來自Worker 的訊息：

<code class="html">worker.onmessage = function(e) {
  console.log("Received: " + e.data);
}</code>

透過發送訊息來啟動工作程序：

<code class="html">worker.postMessage("hello");</code>

這種方法允許您使工作程序代碼與主邏輯保持一致，從而實現獨立且易於部署包裹。

以上是內嵌 Web Worker 能否簡化部署和縮小？的詳細內容。更多資訊請關注PHP中文網其他相關文章！