前言：对构建工具的理解、选择和使用很大程度上决定了我们的产品的使用体验。
几种主流构建工具的横向对比：
一. webpack, 秉承在compiler实例对象基础上的即插即用的plugin和loader设计理念，webpack实现了强大的功能，虽然配置繁琐但文档逐步完善清晰且社区强大，近几年伴随vue、react等主流框架的快速发展而使用广泛。美中不足的是编译速度尤其是首次构建速度较慢。
二. parcel, 一款零配置，开箱即用的构建工具，虽简单好用但功能有限。内置了多核并行构建能力，利用多线程实现编译，速度较快。
三. vite, 基于现代浏览器原生ESM特性而实现，因此开发模式下可以秒级启动，而生产环境利用Rollup实现打包。
综上，设计一款构建工具，核心考虑的是功能是否强大，构建速度够快。而这可以从以下几个维度反映出来：
性能上看
-
code splitting, 代码分割, 将文件分成多个chunks, 提取出commonChunk。与之配合的是运行时的合理的按需加载策略。代码分割直接决定了前端的静态资源产出情况，直接影响性能表现。
-
hashing, 对打包资源进行版本信息映射以便充分且合理利用缓存，提高浏览器加载速度，提升用户体验。因为构建工具需要分析各导出模块间的依赖关系，根据依赖关系上下文生成包的hash值。
痛点：每一次构建都会产生一个新的hash值，即使包的内容完全没有发生改变。
解决：根据实际情况分别使用chunkhash策略或者contenthash策略. 例如：
将公共库和项目入口文件单独打包配置，并且使用chunkhash策略时，分别改了库文件或者入口文件，则另外一个文件的hash值不会发生改变。否则适用于contenthash策略。
编译和支持
-
非js资源，因为构建工具打包出来的最终产物是一个js文件，所以需要支持其它类型的资源。
-
编译能力，比如TSX、TS等文件需要利用插件等社区能力实现。
-
模块导入。
-
模块导出。
