seb/reactShop
1
0
Fork 0
Code Issues Pull Requests Activity

refactor: enhance image preloading logic in InlineCssPlugin for better performance and clarity

Browse Source
This commit is contained in:
sebseb7
2025-07-23 08:52:53 +02:00
parent cee69c9a31
commit c906e0c936
2 changed files with 17 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/services/SocketManager.js
View File

@@ -28,17 +28,13 @@ class SocketManager {
}
this.pendingListeners.get(event).add(callback);
// If not already connecting, initiate connection
if (!this.connectPromise) {
this.connect();
}
// Register the listener now, it will receive events once connected
this.socket.on(event, callback);
}
off(event, callback) {
// Remove from socket listeners
console.log('off', event, callback);
this.socket.off(event, callback);
// Remove from pending listeners if present

25
webpack.config.js
View File

@@ -168,13 +168,19 @@ class InlineCssPlugin {
// Extract current page path from the HTML to determine which images to preload
const htmlContent = data.html;
const isProductPage = htmlContent.includes('/Artikel/') || htmlContent.includes('product-detail');
const isSpecialPage = htmlContent.includes('/impressum') || htmlContent.includes('/datenschutz') ||
htmlContent.includes('/agb') || htmlContent.includes('/profile') ||
htmlContent.includes('/admin') || htmlContent.includes('/404') ||
htmlContent.includes('/widerrufsrecht') || htmlContent.includes('/batteriegesetzhinweise');
const isProductPage = htmlContent.includes('ProductDetailPage') ||
htmlContent.includes('/Artikel/') ||
htmlContent.includes('product-detail');
const isSpecialPage = htmlContent.includes('/impressum') ||
htmlContent.includes('/datenschutz') ||
htmlContent.includes('/agb') ||
htmlContent.includes('/profile') ||
htmlContent.includes('/admin') ||
htmlContent.includes('/404') ||
htmlContent.includes('/widerrufsrecht') ||
htmlContent.includes('/batteriegesetzhinweise');
// Define critical images array
// Define critical images array - only preload these on pages that actually use them
const criticalImages = [
'/assets/images/filiale1.jpg',
'/assets/images/filiale2.jpg',
@@ -186,9 +192,10 @@ class InlineCssPlugin {
// Only preload navigation images for main pages (home, categories, aktionen, filiale)
if (!isProductPage && !isSpecialPage) {
criticalImages.forEach(imagePath => {
imagePreloads += `<link rel="preload" href="${imagePath}" as="image">\n`;
});
// Add the as="image" attribute to ensure proper preloading
criticalImages.forEach(imagePath => {
imagePreloads += `<link rel="preload" href="${imagePath}" as="image">\n`;
});
}
// Add inlined CSS to head