fix(loop): thumbnails and lazy images for pages Load More adds - #344
Merged
Merged
Conversation
- Carousel Thumbnails take the strip the fetched page rendered, so every appended slide has its thumbnail. - The parsed page drops noscript copies: DOMParser runs without scripts and turned them into images that loaded at once.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Load More and infinite scroll parse the fetched page with
DOMParser, which runs without scripts. It reads the<noscript>copy of every lazy image as real markup, so each appended page loaded its images twice, once at once and once lazily. On a dev page, one Load More added 4 extra image requests. The parsed page now drops itsnoscriptnodes before the items move over. Router swaps (filter, sort, numbered pages) were never affected.Carousel Thumbnails also stopped at the first page, which the docs listed as a limit ("do not combine the two"). The strip the server rendered for the fetched page is now moved over with its buttons renumbered, so every appended slide has a thumbnail, and Back removes them with the rest of the Load More.
The noscript test needs lazy images on screen. The tests site has the plugin's lazy loading off, so the first version of the test passed without the fix. It now uses one column, so the items below the first row load lazily, and it fails without the fix.
Checks: lint 0, lint:php 0, PHPUnit 450 OK, e2e 208 passed.