feat: enhance image loading and socket handling in Product and Images components, and update prerender logic in App and ProductDetailPage

src/components/ProductDetailPage.js

@@ -356,7 +356,6 @@ class ProductDetailPage extends Component {
     if (!this.props.socket || !this.props.socket.connected) {
       // Socket not connected yet, but don't show error immediately on first load
       // The componentDidUpdate will retry when socket connects
-      console.log("Socket not connected yet, waiting for connection to load product data");
       return;
     }
 
@@ -538,11 +537,27 @@ class ProductDetailPage extends Component {
     }
   };
 
-  render() {
+    render() {
     const { product, loading, error, attributeImages, isSteckling, attributes, komponentenLoaded, komponentenData, komponentenImages, totalKomponentenPrice, totalSavings } =
       this.state;
 
+    // Debug alerts removed
+
+    
+
     if (loading) {
+      // Check if prerender fallback is available
+      if (typeof window !== "undefined" && window.__PRERENDER_FALLBACK__) {
+        return (
+          <div
+            dangerouslySetInnerHTML={{
+              __html: window.__PRERENDER_FALLBACK__.content,
+            }}
+          />
+        );
+      }
+      
+      // Fallback to loading message if no prerender content
       return (
         <Box
           sx={{