feat: enhance SocketProvider to support polling and websocket transports, improve error logging for development, and update image preloading logic in webpack config for better performance on main pages

src/providers/SocketProvider.js

@@ -23,7 +23,9 @@ class SocketProvider extends Component {
     console.log(`SocketProvider: Connecting to socket server... ${url}`);
 
     this.socket = io(url, {
-      transports: ["websocket"],
+      transports: ["polling", "websocket"],
+      upgrade: true,
+      rememberUpgrade: true,
     });
 
     this.socket.on("connect", () => {
@@ -67,7 +69,10 @@ class SocketProvider extends Component {
     });
 
     this.socket.on("connect_error", (error) => {
-      console.error("SocketProvider: Connection error:", error);
+      // Only log connection errors in development mode to reduce noise in production
+      if (process.env.NODE_ENV === "development") {
+        console.error("SocketProvider: Connection error:", error);
+      }
       this.handleConnectionFailure();
     });
 
@@ -81,7 +86,9 @@ class SocketProvider extends Component {
     });
 
     this.socketB = io(url, {
-      transports: ["websocket"],
+      transports: ["polling", "websocket"],
+      upgrade: true,
+      rememberUpgrade: true,
     });
 
     this.socketB.on("connect", () => {
@@ -95,7 +102,10 @@ class SocketProvider extends Component {
     });
 
     this.socketB.on("connect_error", (error) => {
-      console.error("SocketProvider: Connection errorB:", error);
+      // Only log connection errors in development mode to reduce noise in production
+      if (process.env.NODE_ENV === "development") {
+        console.error("SocketProvider: Connection errorB:", error);
+      }
     });
 
     this.socketB.on("reconnect_attempt", (attemptNumber) => {