Laravel Mix: Analyze Webpack Bundle Size

npm install webpack-bundle-analyzer --save-dev

In „webpack.mix.js“ require the new module

const BundleAnalyzerPlugin = require('webpack-bundle analyzer').BundleAnalyzerPlugin;

Still inside „webpack.mix.js“ use mix.webpackConfig() to dynamically merge the new plugin into the default mix Webpack config:

// Custom webpack config
mix.webpackConfig({
    plugins: [
        new BundleAnalyzerPlugin()
    ]
});

Build the assets

npm run dev

webpack-bundle-analyzer will run and open the result of the analysis at http://127.0.0.1:8888/ on your local machine.

Two more Tipp´s

On the command line use „npm list“ to get an overview about your package tree.

Use „mix.extract()“ to seperate often chaning sources from the ones which will be not so likely to change (vendor etc).

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.