广州web培训
达内广州五羊中心

18589266248

热门课程

JS中的并行处理:Webpack

  • 时间:2016-12-26 14:22
  • 发布:广州web培训
  • 来源:拿客

在Webpack中使用Web worker时,你需要用worker-loader。将它添加到package.json中的devDependencies,然后运行npm install,就可以了。

用到worker时,只需要require它。

const workerCode = require("worker!./worker.js");

...

const worker = new workerCode();

这样就初始化了worker,然后就像上面讲的一样使用worker。

如果需要使用行内worker,你需要传递inline参数给loader。

const workerCode = require("worker?inline!./worker.js");

...

const worker = new workerCode();

在worker中你也可以import模块。

import fibonacci from "./fibonacci.js";

...

const result = fibonacci(num);

缺点

在Webpack中使用worker很简单,但是在使用时达内广州前端开发培训认为也有一些坑值得你注意。

首先,无法将代码共用部分提取出来。如果你的worker中依赖一段共用代码,你只能把代码添加到worker中,不管其他地方是否也用到同样的代码。而且如果你多个worker要用同样的库,你也需要在每个worker中引入它们。

你可能会想如果你不用worker-loader,然后用CommonsChunkPlugin指定一个新的入口,可能会解决这个问题。但是不幸的是worker不像是浏览器window,一些feature不可用,所以一些代码必须要引入。

同时,用行内worker也不会解决问题,共用的代码依然会出现在多个地方。

第二点缺点是,行内worker可能会导致ObjectURLs内存泄露.它们被创建出来以后就不会被释放。这虽然不是一个大问题,但是如果你有很多“一次性”worker的话,就会影响性能。

综上所述,达内广州前端开发培训建议使用标准的worker,注意在worker中引入了什么。还要注意使用缓存。

广州Web前端培训就到广州达内,详情请登陆广州达内Web前端培训官网(gz.web.tedu.cn)!

上一篇:JS中的并行处理:Web Workers
下一篇:web前端开发工程师是什么?web前端需要掌握哪些基础?

马上预约三天免费体验课

姓名:

电话:

如何解决JavaScript数组排序稳定性的差异?

选择城市和中心
江西省

贵州省

广西省

海南省