Bilder blinken auf Bildlauf? (Ohne Lazy-Load)

Question

In meiner eckigen Anwendung habe ich eine Seite mit 25 carousels und ~ 600 Bilder.

Jede Bildgröße ist fast 40-50kb, und auf Bildlauf-Bilder blinkt nur in Chrom (siehe Bild unten). Ich verwende keine Lazyload-Bibliothek für Bilder.

Was ist der Grund und wie kann ich das beheben?

Vielen Dank im Voraus.

Answer 1

Ich denke, es ist nicht so eine schlechte Idee einfach Ihre Bilder auf einfachste Weise vorab geladen werden wie

const preloadImages = (urls) => 
    Promise.all(urls.map(url => 
    new Promise(resolve => { 
     const img = new Image(); 
     img.onload =() => resolve(img); 
     img.onerror =() => resolve(img); 
     img.src = url; 
    }) 
));