add max reconnections

devjiwonchoi · ijjk · devjiwonchoi · commit 60bfa28d2f0c · 2025-09-23T01:13:39.000+02:00
Co-authored-by: JJ Kasper &lt;jj@jjsweb.site&gt;
diff --git a/packages/next/src/client/dev/hot-reloader/app/web-socket.ts b/packages/next/src/client/dev/hot-reloader/app/web-socket.ts
@@ -17,6 +17,7 @@ import {
   logQueue,
 } from '../../../../next-devtools/userspace/app/forward-logs'
 import { InvariantError } from '../../../../shared/lib/invariant-error'
+import { WEB_SOCKET_MAX_RECONNECTIONS } from '../../../../lib/constants'
 
 let reconnections = 0
 let reloading = false
@@ -126,7 +127,7 @@ export function createWebSocket(
       reconnections++
 
       // After 25 reconnects we'll want to reload the page as it indicates the dev server is no longer running.
-      if (reconnections > 25) {
+      if (reconnections > WEB_SOCKET_MAX_RECONNECTIONS) {
         reloading = true
         window.location.reload()
         return
diff --git a/packages/next/src/client/dev/hot-reloader/pages/websocket.ts b/packages/next/src/client/dev/hot-reloader/pages/websocket.ts
@@ -7,6 +7,7 @@ import {
   type HmrMessageSentToBrowser,
 } from '../../../../server/dev/hot-reloader-types'
 import { getSocketUrl } from '../get-socket-url'
+import { WEB_SOCKET_MAX_RECONNECTIONS } from '../../../../lib/constants'
 
 let source: WebSocket
 
@@ -79,7 +80,7 @@ export function connectHMR(options: { path: string; assetPrefix: string }) {
       source.close()
       reconnections++
       // After 25 reconnects we'll want to reload the page as it indicates the dev server is no longer running.
-      if (reconnections > 25) {
+      if (reconnections > WEB_SOCKET_MAX_RECONNECTIONS) {
         reloading = true
         window.location.reload()
         return
diff --git a/packages/next/src/lib/constants.ts b/packages/next/src/lib/constants.ts
@@ -100,6 +100,8 @@ export const SERVER_RUNTIME: Record<string, ServerRuntime> = {
   nodejs: 'nodejs',
 }
 
+export const WEB_SOCKET_MAX_RECONNECTIONS = 12
+
 /**
  * The names of the webpack layers. These layers are the primitives for the
  * webpack chunks.
