Skip to content

Images NOT showing if you use browser Back button to go back to the previous page with yall lazy loaded images #38

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

Closed
Badhumvee opened this issue Jan 4, 2019 · 6 comments
Assignees

Comments

@Badhumvee
Copy link

Images NOT showing if you use browser Back button to go back to the previous page with yall lazy loaded images. That previous page loaded fine initially, but then you click on a link and navigate to second page ... then you hit browser back button (chrome and edge) the images that you saw on the first page are not visible anymore and instead, in developer tools you see the 1px-1px placeholder.jpg image in place of the real image.
Maybe we are doing something wrong. Could you please advise? Thanks a lot.

TS

@malchata
Copy link
Owner

malchata commented Jan 4, 2019

Do these images reappear if you scroll or otherwise interact with the page after hitting the back button? In any event, I'll need a minimally reproducible test page (or pages in this case) to see the effect in action.

@malchata malchata self-assigned this Jan 4, 2019
@malchata malchata added the bug label Jan 4, 2019
@Badhumvee
Copy link
Author

https://docs.google.com/document/d/1gIxTtMXDW4ggoIJ-Ts1y33zlLX-ZeiCVg0EjbQszyFQ/edit?usp=sharing

Once you open that URL page in Chrome, we load a bunch of images using yall with the following settings:

       document.addEventListener("DOMContentLoaded", function() {
           yall({
               observeChanges: true,
               idlyLoad: true,
               threshold: 600
           });
       });

Then, just click on Sign-up on the top right corner.
Then click on the browser back button. At this point, we do not see any of the images we saw before.

I dont feel like it has anything to do with the idlyLoad issue.

Thanks for your help.

@malchata
Copy link
Owner

malchata commented Jan 5, 2019

Try dropping the attached version in to see if this helps:
yall-2.2.1.min.js.zip

I need to test this more in other browsers, but when I use local sources in Chrome to test this on a local version of your site, it appears to work. It adds the subtree option in the MutationObserver option, which is what I think fixes this issue.

@Badhumvee
Copy link
Author

Hi malchata, Thanks for the updated file. I tried it locally, and it seems to fix this issue. I expect it will be fine when deployed. Will let you know if we see any issues. Thanks again.

@malchata
Copy link
Owner

malchata commented Jan 14, 2019 via email

@malchata
Copy link
Owner

Officially fixed and released as version 2.2.1.

malchata added a commit that referenced this issue Jan 26, 2019
- Fixed issue where order of src/srcset could cause Safari (and possibly other browsers) to download redundant resources.
- Fixed #38.
- Updated packages.
- Tweaked README.
- Build is slightly smaller now.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants