Enable compression for development

build-scripts/webpack.js

@@ -2,6 +2,7 @@ const webpack = require("webpack");
 const path = require("path");
 const TerserPlugin = require("terser-webpack-plugin");
 const { WebpackManifestPlugin } = require("webpack-manifest-plugin");
+const CompressionWebpackPlugin = require("compression-webpack-plugin");
 const log = require("fancy-log");
 const WebpackBar = require("webpackbar");
 const paths = require("./paths.js");
@@ -75,6 +76,7 @@ const createWebpackConfig = ({
       chunkIds: isProdBuild && !isStatsBuild ? "deterministic" : "named",
     },
     plugins: [
+      new CompressionWebpackPlugin(),
       !isStatsBuild && new WebpackBar({ fancy: !isProdBuild }),
       new WebpackManifestPlugin({
         // Only include the JS of entrypoints

package.json

@@ -100,6 +100,7 @@
     "app-datepicker": "^5.1.0",
     "chart.js": "^3.3.2",
     "comlink": "^4.4.1",
+    "compression-webpack-plugin": "^10.0.0",
     "core-js": "^3.28.0",
     "cropperjs": "^1.5.13",
     "date-fns": "^2.29.3",

src/data/energy.ts

@@ -193,6 +193,12 @@ export interface EnergyPreferencesValidation {
   device_consumption: EnergyValidationIssue[][];
 }
 
+export interface EnergyInfoAndCO2Signal {
+  energyInfo: EnergyInfo;
+  co2SignalEntity: string | undefined;
+  co2SignalConfigEntry: ConfigEntry | undefined;
+}
+
 export const getEnergyInfo = (hass: HomeAssistant) =>
   hass.callWS<EnergyInfo>({
     type: "energy/info",
@@ -332,13 +338,9 @@ export const getReferencedStatisticIds = (
   return statIDs;
 };
 
-const getEnergyData = async (
-  hass: HomeAssistant,
-  prefs: EnergyPreferences,
-  start: Date,
-  end?: Date,
-  compare?: boolean
-): Promise<EnergyData> => {
+const getEnergyInfoAndCO2Signal = async (
+  hass: HomeAssistant
+): Promise<EnergyInfoAndCO2Signal> => {
   const [configEntries, info] = await Promise.all([
     getConfigEntries(hass, { domain: "co2signal" }),
     getEnergyInfo(hass),
@@ -366,6 +368,24 @@ const getEnergyData = async (
     }
   }
 
+  return <EnergyInfoAndCO2Signal>{
+    energyInfo: info,
+    co2SignalEntity: co2SignalEntity,
+    co2SignalConfigEntry: co2SignalConfigEntry,
+  };
+};
+
+const getEnergyDataWithInfo = async (
+  hass: HomeAssistant,
+  energyInfoAndCO2Signal: EnergyInfoAndCO2Signal,
+  prefs: EnergyPreferences,
+  start: Date,
+  end?: Date,
+  compare?: boolean
+): Promise<EnergyData> => {
+  const info = energyInfoAndCO2Signal.energyInfo;
+  const co2SignalEntity = energyInfoAndCO2Signal.co2SignalEntity;
+  const co2SignalConfigEntry = energyInfoAndCO2Signal.co2SignalConfigEntry;
   const consumptionStatIDs: string[] = [];
   for (const source of prefs.energy_sources) {
     // grid source
@@ -595,6 +615,9 @@ export const getEnergyDataCollection = (
 
   energyCollectionKeys.push(options.key);
 
+  let energyInfoAndCO2Signal: EnergyInfoAndCO2Signal | undefined;
+  let forceRefreshEnergyInfo = false;
+
   const collection = getCollection<EnergyData>(
     hass.connection,
     key,
@@ -622,14 +645,20 @@ export const getEnergyDataCollection = (
         }
         nextFetch.setMinutes(20, 0, 0);
 
-        collection._refreshTimeout = window.setTimeout(
-          () => collection.refresh(),
-          nextFetch.getTime() - Date.now()
-        );
+        collection._refreshTimeout = window.setTimeout(() => {
+          forceRefreshEnergyInfo = true;
+          collection.refresh();
+        }, nextFetch.getTime() - Date.now());
       }
 
-      return getEnergyData(
+      if (!energyInfoAndCO2Signal || forceRefreshEnergyInfo) {
+        energyInfoAndCO2Signal = await getEnergyInfoAndCO2Signal(hass);
+        forceRefreshEnergyInfo = false;
+      }
+
+      return getEnergyDataWithInfo(
         hass,
+        energyInfoAndCO2Signal,
         collection.prefs,
         collection.start,
         collection.end,

web-dev-server.config.js

@@ -19,6 +19,7 @@ module.exports = {
     "**/*.json": "js",
     "**/*.css": "js",
   },
+  compress: true,
   middleware: [cors()],
   plugins: rollupWDSPlugins,
 };

yarn.lock

@@ -6860,6 +6860,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"compression-webpack-plugin@npm:^10.0.0":
+  version: 10.0.0
+  resolution: "compression-webpack-plugin@npm:10.0.0"
+  dependencies:
+    schema-utils: ^4.0.0
+    serialize-javascript: ^6.0.0
+  peerDependencies:
+    webpack: ^5.1.0
+  checksum: 2ac9079b7ab87141639c62ddbb2820a06f105198e27ef4c3860da3186bdbefc00d1e206969833ce7a4b7b26161ddbec7b8d20d30f9f9c1d494818b9b86f0d5cc
+  languageName: node
+  linkType: hard
+
 "compression@npm:1.7.3":
   version: 1.7.3
   resolution: "compression@npm:1.7.3"
@@ -9626,6 +9638,7 @@ fsevents@~2.3.2:
     chai: ^4.3.7
     chart.js: ^3.3.2
     comlink: ^4.4.1
+    compression-webpack-plugin: ^10.0.0
     core-js: ^3.28.0
     cropperjs: ^1.5.13
     date-fns: ^2.29.3