Add script to show stats (#2195)

script/develop

@@ -4,6 +4,8 @@
 # Stop on errors
 set -e
 
+cd "$(dirname "$0")/.."
+
 BUILD_DIR=build
 OUTPUT_DIR=hass_frontend
 OUTPUT_DIR_ES5=hass_frontend_es5

script/size_stats

@@ -0,0 +1,11 @@
+#!/bin/sh
+# Analyze stats
+
+# Stop on errors
+set -e
+
+cd "$(dirname "$0")/.."
+
+STATS=1 NODE_ENV=production webpack --profile --json > compilation-stats.json
+npx webpack-bundle-analyzer compilation-stats.json hass_frontend
+rm compilation-stats.json

webpack.config.js

@@ -16,6 +16,7 @@ if (!version) {
 }
 const VERSION = version[0];
 const isCI = process.env.CI === "true";
+const isStatsBuild = process.env.STATS === "1";
 
 const generateJSPage = (entrypoint, latestBuild) => {
   return new HtmlWebpackPlugin({
@@ -51,10 +52,6 @@ function createConfig(isProdBuild, latestBuild) {
     entry["service-worker-hass"] = "./src/entrypoints/service-worker-hass.js";
   }
 
-  const chunkFilename = isProdBuild
-    ? "[chunkhash].chunk.js"
-    : "[name].chunk.js";
-
   return {
     mode: isProdBuild ? "production" : "development",
     devtool: isProdBuild
@@ -161,6 +158,7 @@ function createConfig(isProdBuild, latestBuild) {
       ),
       isProdBuild &&
         !isCI &&
+        !isStatsBuild &&
         new CompressionPlugin({
           cache: true,
           exclude: [/\.js\.map$/, /\.LICENSE$/, /\.py$/, /\.txt$/],
@@ -223,7 +221,10 @@ function createConfig(isProdBuild, latestBuild) {
         if (!isProdBuild || dontHash.has(chunk.name)) return `${chunk.name}.js`;
         return `${chunk.name}-${chunk.hash.substr(0, 8)}.js`;
       },
-      chunkFilename: chunkFilename,
+      chunkFilename:
+        isProdBuild && !isStatsBuild
+          ? "[chunkhash].chunk.js"
+          : "[name].chunk.js",
       path: path.resolve(__dirname, buildPath),
       publicPath,
     },
@@ -243,7 +244,7 @@ function createConfig(isProdBuild, latestBuild) {
 
 const isProdBuild = process.env.NODE_ENV === "production";
 const configs = [createConfig(isProdBuild, /* latestBuild */ true)];
-if (isProdBuild) {
+if (isProdBuild && !isStatsBuild) {
   configs.push(createConfig(isProdBuild, /* latestBuild */ false));
 }
 module.exports = configs;