内联网络工作者：何时以及如何使用它们？
- Mary-Kate Olsen原创
- 2024-10-30 00:14:02374浏览
内联 Web Workers：综合指南
虽然 Web Workers 通常在单独的 JavaScript 文件中定义，但有一种方法可以内联创建它们在同一个 HTML 文件中。当旨在最大限度地减少要分发的单独文件的数量时，特别是在使用闭包编译器等工具进行代码优化时，此方法非常有利。
创建内联 Web Workers
内联网络工作人员利用 Blob() 以字符串形式创建工作人员代码的 URL 句柄。这允许工作器直接包含在 HTML 文件中。这是一个完整的示例：
带有内联工作器代码的 HTML：
<code class="html"><!DOCTYPE html>
<script id="worker1" type="javascript/worker">
// This script won't be parsed by JS engines due to its type.
self.onmessage = function(e) {
self.postMessage('msg from worker');
};
</script></code>
主要 JavaScript 代码：
<code class="javascript">var blob = new Blob([
document.querySelector('#worker1').textContent
], { type: "text/javascript" });
// Use window.webkitURL.createObjectURL() for Chrome versions below 11.
var worker = new Worker(window.URL.createObjectURL(blob));
worker.onmessage = function(e) {
console.log("Received: " + e.data);
};
worker.postMessage("hello"); // Start the worker.</code>
在此示例中，内联工作代码在 <script> 中定义。 type 属性设置为“javascript/worker”的标记。然后，主 JavaScript 代码从工作程序代码创建一个 Blob 对象，并使用 window.URL.createObjectURL() 为工作程序创建 URL 句柄。</script>
优点和用例
内联 Web Worker 具有多种优势：
- 将 Worker 和主代码合并到一个文件中，以优化分发并减少 HTTP 请求。
- 增强安全性，因为内联 Worker 代码无法被由外部站点访问。
内联 Web Worker 的一些可能的用例包括：
- 需要从主线程卸载的长时间运行计算。
- 在不中断主线程的情况下处理时间敏感的任务。
- 出于安全或可维护性目的隔离特定代码。
以上是内联网络工作者：何时以及如何使用它们？的详细内容。更多信息请关注PHP中文网其他相关文章！
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn