性能是 browserify-loader 的关键指标,但是从目前的测试来看,性能并不理想。

browserify-loader 提供了一个查看性能的接口,window.define.performance(), 调用这个接口,就可以看到各个模块在各环节用时,以及总的性能比。

那如何衡量 browserify-loader 的性能呢?

假设没有加载器,脚本都是通过 script 标签一开始就全都引入到 HTML 中的,那所有这些脚本的加载时间就是性能时间。

加入了 browserify-loader 之后,包含以下这些消耗时间的地方:

  1. xhr 加载脚本,这个时间基本等价于 通过 script 标签加载脚本的时间
  2. define 的时间,给 xhr 加载过来的脚本打上 define 的 wrapper,在创建 script 标记插到页面中,再到 define 执行完毕
  3. 分析模块依赖的时间
  4. 获取真实模块依赖 uri 的时间,包括递归向上查找 node_modules 中模块的时间
  5. 等等

好吧,下面是粗略的测试结果:

`使用 browserify-loader 加载的总时间 / xhr 加载脚本的总时间 ≈ 2 - 5 倍

意思也就是,如果你啥也不用,加载要1s,使用 browserify-loader 可能需要 2 - 5s。这个时间大家可以接受么?


寸志
68 声望37 粉丝

前端开发工程师,《深入浅出CoffeeScript》译者,《Node.js实战》作者之一。