HTML5 Web Worker是利器还是摆设

一、HTML5 Web Worker是利器还是摆设

Worker能解决两个问题：解决程序阻塞问题：提升效率。不过Worker还有局限性，它不能操作DOM。解决方法如下：

1、首先在创建之前，检测所用浏览器是否支持它，当前除了IE浏览器以外，其它主流浏览器都是支持的。

2、创建web worker文件：通过postMessage方法向页面传回一段消息。

3、创建 Web Worker对象：添加一个事件监听器，传递消息时，执行事件监听器中的代码。

4、使用terminate方法终止 Web Worker。

5、最后检测是否存在 worker，如果不存在，则创建一个新的对象，然后运行 js代码中的内容。被调用的js文件内容如下。

二、worker 引入其他 js 报错

1、worker引入其他 js报错的原因是其他模块与标准脚本的不同。

2、你需要注意本地测试—如果你通过本地加载Html文件(比如一个 file://路径的文件),你将会遇到 CORS错误，因为Javascript模块安全性需要。你需要通过一个服务器来测试。另请注意，您可能会从模块内部定义的脚本部分获得不同的行为，而不是标准脚本。这是因为模块自动使用严格模式。加载一个模块脚本时不需要使用 defer属性(see attributes)模块会自动延迟加载。最后一个但不是不重要，你需要明白模块功能导入到单独的脚本文件的范围—他们无法在全局获得。因此，你只能在导入这些功能的脚本文件中使用他们，你也无法通过Javascript console中获取到他们，比如，在DevTools中你仍然能够获取到语法错误，但是你可能无法像你想的那样使用一些debug技术。

三、module里面可以写webworker

1、WebWorkers使得一个Web应用程序可以在与主执行线程分离的后台线程中运行一个脚本操作。这样做的好处是可以在一个单独的线程中执行费时的处理任务，从而允许主（通常是UI）线程运行而不被阻塞。它的作用就是给JS创造多线程运行环境，允许主线程创建worker线程，分配任务给后者，主线程运行的同时worker线程也在运行，相互不干扰，在worker线程运行结束后把结果返回给主线程。这样做的好处是主线程可以把计算密集型或高延迟的任务交给worker线程执行，这样主线程就会变得轻松，不会被阻塞或拖慢。这并不意味着JS语言本身支持了多线程能力，而是浏览器作为宿主环境提供了JS一个多线程运行的环境。

2、JavaScript是单线程的（帮助理解单线程）。一些复杂而又耗时的操作，势必会阻塞页面的渲染/交互，影响用户体验。webworker允许开发者为页面额外开启一个线程，用来处理复杂而耗时的操作，不会阻塞主线程，从而达到优化用户体验的目的。历史上，JavaScript一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。其他语言都有这项功能，比如Ruby的require、Python的import，但是JavaScript任何这方面的支持都没有，这对开发大型的、复杂的项目形成了巨大障碍。