image
image copied to clipboard
Lazy Preload
Again, I haven't actually played with this yet. But what would be cool is the ability to mark an image as a lazy preload (similar to lazysizes).
What it does is, when there is no scrolling, activity etc.. any image marked as preload would be lazy loaded even when it's not within the viewport. We do this for our menu items. They aren't viewable when you first hit the site, but we want the images ready when people use our menu, but only after the rest of the critical assets are loaded.
example https://realtruck.com/
cc: @pi0
There is a fallback option in nuxt-image
to disable lazy-load. It could be used in situations like this. For now it's called legacy
@hecktarzuli This would be a very nice feature. I currently have an issue where a user can change color on a car (a new img src).

However, as nuxt-image does not support @load function I can't set a spinner/placeholder while loading the new image. This results in a blank product for 1-2 seconds before the image is loaded. My next thought would be to load images in the background after the page has been fully loaded and then this wait time would be non-existing.