speed-measure-webpack-plugin

1.6.0 verified Sat Apr 25 auth: no javascript

Measure and analyse the speed of your webpack loaders and plugins. Current stable version is 1.6.0, released in 2024 after a period of inactivity. Supports webpack 1 through 5, Node >=6. Key differentiator: it wraps your existing webpack config to add timing instrumentation without modifying your original configuration. Output can be human-readable, JSON, or custom. Commonly used to identify bottlenecks in build performance. Active development now maintained by 18ways.

Common errors

error TypeError: smp.wrap is not a function ↓

cause Using default import (ESM) instead of require().

fix

Use const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');

error Error: Plugin name not found. Make sure to use correct constructor. ↓

cause Missing plugin in plugins array or mismatched name/constructor.

fix

Ensure the plugin instance is passed in the plugins array and its constructor name is correct.

error Module not found: Can't resolve 'speed-measure-webpack-plugin' ↓

cause Package not installed or wrong import path for Neutrino preset.

fix

Run npm install --save-dev speed-measure-webpack-plugin. For Neutrino, require('speed-measure-webpack-plugin/neutrino').

error outputTarget is not a function ↓

cause outputTarget set to an invalid type (e.g., number).

fix

Set outputTarget to a string (file path) or a function (e.g., console.log).

Warnings

breaking API changed in v1.0.0: removed .wrapPlugins() in favor of .wrap(). ↓

fix Use smp.wrap(config) instead of smp.wrapPlugins(config).

deprecated Option 'outputFormat' string values other than 'human', 'humanVerbose', 'json' are deprecated. ↓

fix Use 'human', 'humanVerbose', 'json', or a custom function.

gotcha SMP wraps plugin constructors; some plugins may not proxy correctly (e.g., MiniCssExtractPlugin). ↓

fix Add such plugins to options.excludedPlugins array.

gotcha SMP does not support webpack config as a function (multiple configurations). ↓

fix Call smp.wrap() on each individual config object.

gotcha If using TypeScript, you must install @types/speed-measure-webpack-plugin separately. ↓

fix Run npm install --save-dev @types/speed-measure-webpack-plugin

Install

npm install speed-measure-webpack-plugin

yarn add speed-measure-webpack-plugin

pnpm add speed-measure-webpack-plugin

Imports

SpeedMeasurePlugin

wrong

import SpeedMeasurePlugin from 'speed-measure-webpack-plugin'; // Not ESM-friendly

correct

const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
const smp = new SpeedMeasurePlugin();
const wrappedConfig = smp.wrap(originalConfig);

CommonJS requires using require(). No default or named ESM export available. Use '.wrap()' method.

SpeedMeasurePlugin

wrong

const { SpeedMeasurePlugin } = require('speed-measure-webpack-plugin');

correct

const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');

The package exports the constructor directly via module.exports, not as a named export.

wrap

wrong

new SpeedMeasurePlugin().wrap(originalConfig) // Missing instance reuse or options

correct

const wrappedConfig = smp.wrap(originalConfig);

Always create an instance first (with optional options) then call .wrap(). Do not call .wrap() on the prototype.

Quickstart

Basic setup wrapping a webpack config with SMP to measure build times.

const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
const path = require('path');

const smp = new SpeedMeasurePlugin({
  outputFormat: 'human',
  outputTarget: console.log,
});

const webpackConfig = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
  },
  plugins: [
    new (require('webpack').DefinePlugin)({ 'process.env.NODE_ENV': JSON.stringify('production') }),
  ],
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
        },
      },
    ],
  },
};

const wrappedConfig = smp.wrap(webpackConfig);
module.exports = wrappedConfig;