Incremental rebuild is slower and slower

I couldn’t find any issue related so I’m wondering if I’m the only one experiencing that, and if so, why this happens. Basically, my initial build time takes around 15s, but that’s alright. The first incremental rebuild is however pretty quick and takes roughly 2.5s. However, each subsequent rebuild takes an additional 800ms to 1s more, so that after a few edit and save of, even, the same file, it will take around 10s to rebuild after 10 rebuild. And this goes up so that after some time, it’s just better for me to stop the server and restart it again. I’m using webpack 2.1.0-beta.4, and I start the dev server with following command:
webpack-dev-server -d --progress --hot --inline --watch --content-base src/ --open --info

Below is the module.exports of webpack.config.js:

module.exports = {
    // our angular app
    cache: true,
    debug: true,
    devtool: 'eval',
    metadata: metadata[app],
    target: 'web',
    entry: {
        'main': './src/startApp.js'
    },
    module: {

        loaders: [{
            test: /\.sass$/,
            loader: 'style!css!sass?sourceMap&indentedSyntax',
            include: [helpers.root('/src')]
        }, {
            test: /\.html$/,
            loader: 'html',
            include: [root('/src')]
        }, {
            test: /\.js$/,
            loader: 'babel',
            include: [root('/src')]
        }, {
            test: /\.coffee$/,
            loader: 'coffee',
            include: [root('/src')]
        }, {
            test: /\.json$/,
            loader: 'json',
            include: [root('/src')]
        }, {
            test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
            loader: 'url-loader?limit=10000&mimetype=application/font-woff'
        }, {
            test: /\.(ttf|eot|svg|png|jpg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
            loader: 'file'
        }, {
            test: /(\\|\/)angular\.min\.js$/,
            loader: 'imports?jquery'
        }, {
            test: /(\\|\/)ionic-angular\.min\.js$/,
            loader: 'imports?ionicCore,animate,sanitize,touch,router!exports?ionic'
        }, {
            test: /coffee\-namespace(\\|\/)index\.js$/,
            loader: 'imports?global=>undefined&this=>window'
        }],
        noParse: [
            helpers.rootNode('angular-animate/angular-animate.js'),
            helpers.rootNode('angular-sanitize/angular-sanitize.js'),
            helpers.rootNode('angular-touch/angular-touch.js'),
            helpers.rootNode('angular-ui-router/release/angular-ui-router.js'),
            helpers.rootNode('angular-translate/dist/angular-translate.js'),
            helpers.rootNode('ionic-sdk/release/js/ionic-angular.min.js'),
            helpers.rootNode('ionic-sdk/release/js/ionic.min.js'),
            helpers.rootNode('lodash/lodash.min.js'),
            helpers.rootNode('jquery/dist/jquery.min.js'),
            helpers.root('/vendor/auth-legacy/connection.js'),
            helpers.root('/vendor/ydn/index.min.js')
        ]
    },
    output: {
        path: helpers.root('dist'),
        filename: '[name].bundle.js',
        sourceMapFilename: '[name].map',
        chunkFilename: '[id].chunk.js'
    },
    resolve: {
        extensions: ['', '.js', '.coffee', '.json'],
        alias: {
            acnNg: helpers.root('/src/acn-one/acn-ng'),
            acnCore: helpers.root('/src/acn-one/acn-core'),
            angularTranslateLoaderStaticFiles: helpers.root('/vendor/angular-translate-loader-static-files/angular-translate-loader-static-files'),
            app: helpers.root('/src/apps/', app, 'app'),
            salesforce: helpers.root('/vendor/auth-legacy/salesforce'),
            client: helpers.root('/src/apps/' + app),
            connection: helpers.root('/vendor/auth-legacy/connection'),
            core: helpers.root('/src/acn-one/acn-core'),
            'coffee-namespace': helpers.root('/vendor/coffee-namespace/index'),
            coreapi: helpers.root('/src/acn-one/acn-ng/components/coreapi/coreapi'),
            components: helpers.root('/src/acn-one/acn-ng/components'),
            currentTheme: helpers.root('/src/themes/'),
            forcetk: helpers.root('/vendor/auth-legacy/forcetk'),
            'forcetk.ui': helpers.root('/vendor/auth-legacy/forcetk.ui'),
            ionic: helpers.rootNode('ionic-sdk/release/js/ionic-angular.min'),
            ionicCore: helpers.rootNode('ionic-sdk/release/js/ionic.min'),
            isoCountries: helpers.root('/vendor/iso-countries/dist/countries.min'),
            'localstorage-store': helpers.root('/vendor/localstorage-store/index'),
            'logentries': helpers.root('/vendor/logentries/index'),
            md2: helpers.root('/vendor/js-md2/src/md2'),
            mobileDetect: helpers.root('/vendor/mobile-detect/mobile-detect'),
            router: '@angular/router/angular1/angular_1_router.js',
            animate: 'angular-animate',
            sanitize: 'angular-sanitize',
            touch: 'angular-touch',
            lodash: 'lodash/lodash.min.js',
            jquery: 'jquery/dist/jquery.min.js',
            'ui.router': 'angular-ui-router',
            uiRouter: 'angular-ui-router',
            'angularTranslate': 'angular-translate',
            templatesApp: helpers.root('/build/templates-app'),
            templatesCommon: helpers.root('/build/templates-common'),
            vendor: helpers.root('vendor'),
            youOne: helpers.root('/src/you-one'),
            ydn: helpers.root('/vendor/ydn/index.min')
        }
    },
    plugins: [
        new ProvidePlugin({
            'Salesforce': 'salesforce',
            'forcetk': 'forcetk',
            'LE': 'logentries'
        }),
        new CopyWebpackPlugin([{
            from: 'src/acn-one/acn-ng/components/translations/ACN_EN.json'
        }, {
            from: 'src/you-one/translations/you-one.en.json'
        }]),
        new HtmlWebpackPlugin({
            template: './src/index.webpack.tpl'
        }),
        new webpack.optimize.MinChunkSizePlugin({
            minChunkSize: Infinity
        })
    ],
    // our Webpack Development Server config
    devServer: {
        port: metadata.port,
        host: metadata.host,
        // contentBase: 'src/',
        historyApiFallback: true,
        watchOptions: {
            aggregateTimeout: 300,
            poll: 1000
        }
    },
    watch: true
};

Author: Fantashit

1 thought on “Incremental rebuild is slower and slower

  1. for me, I heard that multiStep of HMR is not working with html-webpack-plugin at the moment, so I tried disabling it, and build time became constant again

Comments are closed.