Loading background image (with gatsby-image) only once

[michaeljblum]

I'm using gatsby-image for one of my website's background images (I'm using two different backgrounds depending on the route).

It's working great, except when I'm on a route that doesn't use the gatsby-image background (just a solid color background), and then navigate to a route that does use the gatsby-image background, it blurs up in a less-than-appealing way.

Is it possible to just have the image load once, and not blur up multiple times across the same session, depending on how recent a route using the gatsby-image background has been visited?

If I useRef the gatsby-image just to log out some of its properties, I see things like imgCached: false and durationFadeIn - is there any (recommended) way to tweak these values so my background only loads once?

In general is there any reference or best practice for using gatsby-image for background images? Any help would be super appreciated 👍