首页 >> 大全

tooling.report- 构建工具测试结果

2023-12-19 大全 22 作者:考证青年

参考文档:

因此篇知乎回答 , 本文属于讲解 + 翻译,摘自 .

有能力的同学还是直接看原文比较清楚,不复杂的哦。

简介

什么是 ? 这个报告提供了快速确定项目最佳构建工具的数据,可用于确定工具迁移的代价,或确定如何应用打包工具。

报告选择了最受欢迎的 、、和四个打包工具,做了共计48个项目的特性测试;每个特性测试都有对应的测试文件。

性能总览

绿圆 - 通过, 黄色半圆 - 部分通过 , 红圈 - 失败,

1 - 代码分割

1.1 new () 能否打包成不同?

JS是单线程的,为了充分利用电脑多核,可以利用-的主从模式,实现多线程,提升CPU利用效率。

new () 属于H5的一部分,参考阮一峰的Web 使用教程

打包预期: 不同线程()应打包成不同的.js;且如果有抽取公共部分,各线程应正确获取到公共部分代码。

1.2 之间的是否支持共享?

对于多线程打包结果,包括 - 或 - 模式,应包括以下三个文件: 一个主线程; 一个从线程,且该从线程应正确引用对应的.js ; 还有一个文件,用于两者共享的依赖项。

虽然能打包公共模块,但还需要手动引入,预期不佳。

使用方法,会抽取公共的js,并引入路径。

使用抽取公共js,但对 就不支持了,因为 在设计之初还没有 , 为了保证不会有变量冲突,会用函数把封装起来。

Since there was no when were , the API for code into a and has to the in 2009.

As an , like embed a small into code that uses () for code , but wraps in to avoid and and .

1.3 对动态异步载入的js能否分割打包?

由于 的 机制,不支持这类动态的 模块。

其他三个支持。

code by () calls to . Since usage and are both , can be used to split point

1.4 多个入口有没有混合公用某公共引入,而非多次实例化。

【翻的有点绕口,哭了】

在js中,一个模块只能被实例化一次。多入口的情况下,模块是被实例化多次还是一次,将造成结果不一致。

测试方式是,两个不同js,都同一个obj.js,该obj里的方法应该被混合公用。

测试结果是,和都支持配置,选择 各自复制该模块 ,还是混合公用该模块。而仅支持混合公用方式。仅支持各自复制方式,但直接用 ES 时又不一致(这个是有问题的)。 比更优秀,因为它还支持配置大小限制等。

or , it’s that a never be times - both and that a must only be once per .

1.5 共同依赖包被抽取到共享包

比如两个页面(multi page 就有 multi entry )都加载了同一个大资源包。这个包应该被正确抽取到一处,并被两个不同页面正确引用。这将有助于打包后体积减少。

有些打包机制不全,就会各自复制一份,没有做“抽取”。

这四个工具,简单来说,根据配置不同,想复制就复制,想抽取就抽取。但 是个半圆,因为打包不灵活,二选一:

… users must “scope-” with , or “scope-” .

1.6 共享引用

由于1.4,理论上根据适当的配置,不管是否是重复导入,由于被实例化只有一次,一但改变了变量,其他引用的地方都会随之变化。

1.7 单模块拆分

Code 是指为模块分组处理成小包的过程,这些小包可以在时有用,并被处理,也避免了加载当前用不着的代码。

假如一个对象有两个,两处不同的内容,结果?

case1: 两处属于动态载入场景: 除了 利用 插件可以拆分,其他三个不支持,全都混在一个文件。

case2: 两处属于multi entry:可以为每个生成不同的文件,其他三个不支持。

2 - 哈希

测试数据构造工具_构建测试数据_

2.1 JS依赖的资源发生变化,hash值是否更新?

理论上这种场景应该被监听到并被更新,但 即使利用,也不能自动监听并更新,还需要code,所以是“”半圆。 其他都很好的支持这个基本功能。

2.2 依赖的资源再依赖的资源发生变化,hash值是否更新?

举例:某个css文件里的图片文件img or svg 发生更新。

+ gulp-rev-all,分析包含的文件,根据是否更新才更新hash值,都支持。

:支持css,不支持svg(压根没支持)。

+ 可以解析CSS URL,但没有用而导致可能出现重复包; 而 合理的配置监听,可对svg监听并更新hash值。

+ -, 原理上首先把css解析成,再解析后反写成css,都能监测到。

2.3 .js 能否在各种入口进行正确的hash更新和处理。

fail

2.4 能否选择性的禁用部分资源的hash?

only pass

2.5 JS 是否是基于其内容的?

All pass,是基于其内容的。

2.6 hash一般是根据文件路径来的,如果父组件引用后又更新了,那么hash值会更新吗?

fail

2.7 比如改了一个注释,hash值会刷新吗?即是否根据其最终生成的文件内容来确定hash值的?

fail

2.8 比如一个子组件发生了更新,那么引用他的两个index.js的hash值是否应该更新呢?

本身不提供能力,其他三个pass。

2.9 code ( 异步加载) 的内容发生更新,会更新入口文件hash值吗?

本身不提供能力,其他三个pass。

tags: hash

关于我们

最火推荐

小编推荐

联系我们


版权声明:本站内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 88@qq.com 举报,一经查实,本站将立刻删除。备案号:桂ICP备2021009421号
Powered By Z-BlogPHP.
复制成功
微信号:
我知道了