为什么 Tapable 要使用 new Function 动态生成执行函数?

303 阅读2分钟

1. Tapable 作者的答疑 - 为什么要使用 new Funtion 动态编译出 call 方法

Query regarding coding paradigm used in this library

  • 为了性能优化

2. 疑似中国哥哥较真地跟作者 battle 起性能问题 - 明明 MDN 文档说 new Function 性能差, 你却说用 new Function 可以进行性能优化

Is the new Function performance really good?

  • 这个哥哥在掘金有账号, 懒得翻

3. 通过可测量的时间性能, 得出反直觉的结论

使用 new Function 编译代码 vs 循环 taps 列表:

当 tap 上去的 plugins 数量足够多的同时 call 的次数也足够多时, new Function 的性能就会超过 循环 taps 列表 .

4. 反直觉结论的原因

作者提供一篇文档, 谷歌翻译了一下是单态 和 多态 的对比

What's up with monomorphism?

实际上说的是 JS 引擎的性能优化逻辑. 浏览器的性能优化就是基于单态性 的假设, 如果一个 Function 的 参数是 单态 的, 那么浏览器会将他们的特征记录下来, 未来会在对象属性查找上快上那么一丢丢.

(文章还提到了多态缓存 , 没有仔细看)

所以这个反直觉的结论原因:

  1. new Function 最初 N 次的执行效率确实不如 循环 taps 列表

  2. 但是重复执行达到一定次数后, new Function 单次调用的性能就反超了. 浏览器就能对 new Function 进行优化.

  3. 再经过调用次数的积累, new Function 的累计消耗的时间也反超了.

5. tapable 的优化逻辑

如果你的插件少, 那么性能不是问题; 如果你的插件太多, 我们真的尽力了;

6. 大家将就一下

JS 引擎懂的不多, 这个文章的出的结论很浅, 说不定还是错的....有懂哥可以多说说