Measure Babel compilation performance (per file or module)

Question

I'm trying to figure out how to extract some information from babel compilation process.

More specifically, when I run babel (no matter if using Webpack's babel-loader, test frameworks' transformers, Babel's CLI, etc) I'd need to extract some information for each compiled file. Like:

• file path
• time taken to compile
• any other meta data?

What I've tried so far

Speed Measure Plugin for Webpack (link)

Works fine but it provides only Webpack's loaders running time. No info about single compiled files.

Hook into Webpack's compiler/compilation instance

I considered writing a Webpack plugin to hook into the compilation process as described here, but I couldn't find the proper hooks to recognize a file being processed by babel.

Updates

I guess @kidroca pointed out the right direction. More specifically I understand that Babel’s wrapPluginVisitorMethod option is the key for hooking into Babel compilation process.

See babel-minify’s timing plugin.

Related threads:

• 
https://github.com/babel/babel/issues/5340
• https://github.com/babel/babel/issues/2206
• https://github.com/babel/babel/pull/3659
• https://github.com/babel/minify/pull/93
• https://github.com/babel/babel/pull/3659

Updates 28/04/18

I eventually tried to wrap a solution into a tool I called babel-timing.

Answer 1

You can use @babel/core and babel.transformSync(code) which will return Abstract Syntax Tree (AST) information along with some other data. And you can also add some logic to measure the performance of this method

I've setup a minimal repo and played with it myself a little bit: https://github.com/kidroca/babel-meta

Basically you can run npm run analyze-file ./es6-src/es6-module.js or npm run analyze-dir ./es6-src/es6-module.js and checkout the results

This will 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 */
}

You can modify the analyze.js file to filter out the info you need
You can modify the .babelrc file to control the transformation and add/remove plugins