测量 Babel 编译性能（每个文件或模块）答案

【问题标题】：Measure Babel compilation performance (per file or module)测量 Babel 编译性能（每个文件或模块）
【发布时间】：2019-08-27 11:45:36
【问题描述】：

我正试图弄清楚如何从babel编译过程中提取一些信息。

更具体地说，当我运行 babel（无论是使用 Webpack 的 babel-loader、测试框架的 transformers、Babel's CLI 等）时，我都需要提取一些每个编译文件的strong>信息。喜欢：

文件路径
编译时间
还有其他元数据吗？

到目前为止我已经尝试过什么

Webpack 测速插件 (link)

工作正常，但它只提供 Webpack 的加载器运行时间。没有关于单个编译文件的信息。

挂钩到 Webpack 的编译器/编译实例

我考虑将writing a Webpack plugin 挂接到here 描述的编译过程中，但我找不到合适的挂钩来识别babel 正在处理的文件。

更新

我猜@kidroca 指出了正确的方向。更具体地说，我了解 Babel 的 wrapPluginVisitorMethod option 是挂钩 Babel 编译过程的关键。

见babel-minify的timing plugin。

28/04/18 更新

我最终尝试将解决方案包装到我称为babel-timing的工具中。

【问题讨论】：

只是一个想法，而不是创建另一个插件，只是拦截babel-loader。
^ 为什么要停在装载机上，拦截babel.transform。如果可能的话，将你的度量逻辑直接压缩到 babel 的源代码中。
我肯定想找到一个只涉及 babel 的解决方案，以便能够独立于周围的工具来测量编译时间。
babel-minify 的插件计时和基准测试似乎是在 babel 中挖掘的方法。我不确定wrapPluginVisitorMethod 是否可以从像.babelrc 这样的外部配置传递。如果可能的话，它将允许您在不修改 babel 代码的情况下集成此基准/分析，并为任何使用 babel 的项目运行它

标签： javascript webpack babeljs babel-loader

【解决方案1】：

您可以使用 @babel/core 和 babel.transformSync(code) 将返回 Abstract Syntax Tree (AST) 信息以及其他一些数据。而且你还可以添加一些逻辑来衡量这个方法的性能

我已经设置了一个最小的 repo 并自己玩了一下：https://github.com/kidroca/babel-meta

基本上你可以运行npm run analyze-file ./es6-src/es6-module.js 或npm run analyze-dir ./es6-src/es6-module.js 并查看结果

这将返回：

{
  "filename": "/full/path/to/src/file.js",
  "cwd": "current/dir",
  "ast": "ast information json - lines, comments, and other info",
  "executionTime": "execution time in ms",
  /* a lot of other info */
}

您可以修改analyze.js 文件以过滤掉您需要的信息
您可以修改.babelrc文件来控制转换和添加/删除插件

【讨论】：