fix: speed up initial client bundling

Author: alexander-akait

client-src/index.js

@@ -1,11 +1,11 @@
 /* global __resourceQuery, __webpack_hash__ */
 /// <reference types="webpack/module" />
 import webpackHotLog from "webpack/hot/log.js";
+import hotEmitter from "webpack/hot/emitter.js";
 import socket from "./socket.js";
 import { formatProblem, createOverlay } from "./overlay.js";
 import { log, setLogLevel } from "./utils/log.js";
 import sendMessage from "./utils/sendMessage.js";
-import reloadApp from "./utils/reloadApp.js";
 import { isProgressSupported, defineProgressElement } from "./progress.js";
 
 /**
@@ -249,6 +249,71 @@ const overlay =
       )
     : { send: () => {} };
 
+/**
+ * @param {Options} options
+ * @param {Status} currentStatus
+ */
+const reloadApp = ({ hot, liveReload }, currentStatus) => {
+  if (currentStatus.isUnloading) {
+    return;
+  }
+
+  const { currentHash, previousHash } = currentStatus;
+  const isInitial =
+    currentHash.indexOf(/** @type {string} */ (previousHash)) >= 0;
+
+  if (isInitial) {
+    return;
+  }
+
+  /**
+   * @param {Window} rootWindow
+   * @param {number} intervalId
+   */
+  function applyReload(rootWindow, intervalId) {
+    clearInterval(intervalId);
+
+    log.info("App updated. Reloading...");
+
+    rootWindow.location.reload();
+  }
+
+  const search = self.location.search.toLowerCase();
+  const allowToHot = search.indexOf("webpack-dev-server-hot=false") === -1;
+  const allowToLiveReload =
+    search.indexOf("webpack-dev-server-live-reload=false") === -1;
+
+  if (hot && allowToHot) {
+    log.info("App hot update...");
+
+    hotEmitter.emit("webpackHotUpdate", currentStatus.currentHash);
+
+    if (typeof self !== "undefined" && self.window) {
+      // broadcast update to window
+      self.postMessage(`webpackHotUpdate${currentStatus.currentHash}`, "*");
+    }
+  }
+  // allow refreshing the page only if liveReload isn't disabled
+  else if (liveReload && allowToLiveReload) {
+    let rootWindow = self;
+
+    // use parent window for reload (in case we're in an iframe with no valid src)
+    const intervalId = self.setInterval(() => {
+      if (rootWindow.location.protocol !== "about:") {
+        // reload immediately if protocol is valid
+        applyReload(rootWindow, intervalId);
+      } else {
+        rootWindow = rootWindow.parent;
+
+        if (rootWindow.parent === rootWindow) {
+          // if parent equals current window we've reached the root which would continue forever, so trigger a reload anyways
+          applyReload(rootWindow, intervalId);
+        }
+      }
+    });
+  }
+};
+
 const ansiRegex = new RegExp(
   [
     "[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]+)*|[a-zA-Z\\d]+(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]*)*)?\\u0007)",