Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(gatsby-image): use the cache to tell if the image was already loaded #11303

Merged
merged 1 commit into from
Jan 28, 2019
Merged

fix(gatsby-image): use the cache to tell if the image was already loaded #11303

merged 1 commit into from
Jan 28, 2019

Conversation

carlrosell
Copy link
Contributor

@carlrosell carlrosell commented Jan 25, 2019

Description

I found a weird issue while browsing the gatsby store earlier today. When I reloaded the product detail page the images were not loaded correctly.
It turns out that the order of the IntersectionObserver and the image load event is not deterministic. By using the image cache to tell if the image was loaded or not, the call order will no longer be an issue.

Before:

kapture 2019-01-25 at 23 31 32

After:

kapture 2019-01-25 at 23 36 00

Related Issues

Fixes: #11298

The order of the IntersectionObserver and the image load event is not deterministic. By using the image cache to tell if the image was loaded or not, the call order will no longer be an issue.
@carlrosell
Copy link
Contributor Author

This issue might be related #11298

@wmcheung
Copy link

@carlrosell thanks for referencing to my issue. I cloned your project and tested it by replacing the gatsby-image index file and it fixed my problem.

Before:
https://cl.ly/c2729110e408

After
https://cl.ly/8cfc535ec836

Copy link
Contributor

@pieh pieh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It makes sense. Thanks @carlrosell!

@pieh pieh merged commit 1d5ccff into gatsbyjs:master Jan 28, 2019
jlengstorf pushed a commit to gatsbyjs/store.gatsbyjs.org that referenced this pull request Feb 8, 2019
I found an issue with gatsby-image on the store site, I created this PR gatsbyjs/gatsby#11303, so the issue has been fixed in the latest version.

close #211
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants