Back to Webpack Js Org

ProfilingPlugin

src/content/plugins/profiling-plugin.mdx

4.41.21000 B
Original Source

Generate Chrome profile file which includes timings of plugins execution. Outputs events.json file by default. It is possible to provide custom file path using outputPath option.

Note : ProfilingPlugin accepts only absolute paths.

Options

  • outputPath: An absolute path to a custom output file (json)

Usage: default

js
new webpack.debug.ProfilingPlugin();

Usage: custom outputPath

js
import path from "node:path";
import { fileURLToPath } from "node:url";

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

new webpack.debug.ProfilingPlugin({
  outputPath: path.join(__dirname, "profiling/profileEvents.json"),
});

In order to view the profile file:

  1. Run webpack with ProfilingPlugin.
  2. Go to Chrome, open DevTools, and go to the Performance tab (formerly Timeline).
  3. Drag and drop generated file (events.json by default) into the profiler.

It will then display timeline stats and calls per plugin!