refactor: enhance image preloading logic in InlineCssPlugin for better performance and clarity
This commit is contained in:
@@ -28,17 +28,13 @@ class SocketManager {
|
|||||||
}
|
}
|
||||||
this.pendingListeners.get(event).add(callback);
|
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
|
// Register the listener now, it will receive events once connected
|
||||||
this.socket.on(event, callback);
|
this.socket.on(event, callback);
|
||||||
}
|
}
|
||||||
|
|
||||||
off(event, callback) {
|
off(event, callback) {
|
||||||
// Remove from socket listeners
|
// Remove from socket listeners
|
||||||
|
console.log('off', event, callback);
|
||||||
this.socket.off(event, callback);
|
this.socket.off(event, callback);
|
||||||
|
|
||||||
// Remove from pending listeners if present
|
// Remove from pending listeners if present
|
||||||
|
|||||||
@@ -168,13 +168,19 @@ class InlineCssPlugin {
|
|||||||
|
|
||||||
// Extract current page path from the HTML to determine which images to preload
|
// Extract current page path from the HTML to determine which images to preload
|
||||||
const htmlContent = data.html;
|
const htmlContent = data.html;
|
||||||
const isProductPage = htmlContent.includes('/Artikel/') || htmlContent.includes('product-detail');
|
const isProductPage = htmlContent.includes('ProductDetailPage') ||
|
||||||
const isSpecialPage = htmlContent.includes('/impressum') || htmlContent.includes('/datenschutz') ||
|
htmlContent.includes('/Artikel/') ||
|
||||||
htmlContent.includes('/agb') || htmlContent.includes('/profile') ||
|
htmlContent.includes('product-detail');
|
||||||
htmlContent.includes('/admin') || htmlContent.includes('/404') ||
|
const isSpecialPage = htmlContent.includes('/impressum') ||
|
||||||
htmlContent.includes('/widerrufsrecht') || htmlContent.includes('/batteriegesetzhinweise');
|
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 = [
|
const criticalImages = [
|
||||||
'/assets/images/filiale1.jpg',
|
'/assets/images/filiale1.jpg',
|
||||||
'/assets/images/filiale2.jpg',
|
'/assets/images/filiale2.jpg',
|
||||||
@@ -186,9 +192,10 @@ class InlineCssPlugin {
|
|||||||
|
|
||||||
// Only preload navigation images for main pages (home, categories, aktionen, filiale)
|
// Only preload navigation images for main pages (home, categories, aktionen, filiale)
|
||||||
if (!isProductPage && !isSpecialPage) {
|
if (!isProductPage && !isSpecialPage) {
|
||||||
criticalImages.forEach(imagePath => {
|
// Add the as="image" attribute to ensure proper preloading
|
||||||
imagePreloads += `<link rel="preload" href="${imagePath}" as="image">\n`;
|
criticalImages.forEach(imagePath => {
|
||||||
});
|
imagePreloads += `<link rel="preload" href="${imagePath}" as="image">\n`;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Add inlined CSS to head
|
// Add inlined CSS to head
|
||||||
|
|||||||
Reference in New Issue
Block a user