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

Question

我正在尝试找出如何从babel编译过程.[=27=中提取一些信息 ]

更具体地说，当我运行 babel（无论是否使用 Webpack 的 babel-loader, test frameworks' transformers, Babel's CLI 等）时，我需要 extract 每个编译文件的一些信息。喜欢：

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

到目前为止我尝试了什么

Webpack 速度测量插件 (link)

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

挂接到 Webpack 的 compiler/compilation 实例

我考虑过 writing a Webpack plugin to hook into the compilation process as described here，但找不到合适的钩子来识别 babel 正在处理的文件。

更新

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

参见 babel-minify 的 timing plugin。

更新 28/04/18

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

Answer 1

您可以使用 @babel/core 和 babel.transformSync(code)，这将 return 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 并查看结果

这将 return:

{
  "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 文件来控制转换和 add/remove 插件

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

Measure Babel compilation performance (per file or module)

javascript

webpack

babeljs

babel-loader

到目前为止我尝试了什么

Webpack 速度测量插件 (link)

挂接到 Webpack 的 compiler/compilation 实例

更新

更新 28/04/18