Games-of-Switzerland / swissgamesgarden

👾 🇨🇭 Games of Switzerland - React Frontend Application
https://swissgames.garden
GNU General Public License v2.0
14 stars 1 forks source link

fix placeholder image still visible when images are loaded from Browser cache #148

Closed WengerK closed 6 months ago

WengerK commented 6 months ago

fix placeholder image still visible when images are loaded from Browser cache

Screenshot 2024-02-23 at 16 14 44

This is a known problem. Here the code use onLoadto trigger removal of the placeholder low-res image. Still, onLoad in never trigger by a Browser when the image is loaded from Cache.

The solution is to use .complete and a useEffect

@see https://ahndongjin.medium.com/if-image-onload-is-not-called-fe3eae74ec7f and https://stackoverflow.com/questions/59787642/nextjs-images-loaded-from-cache-dont-trigger-the-onload-event