The new Firefox features landing page holds a collection of thumbnail images for each feature that gets promoted. This list will likely grow considerably, so it would be nice if the page had a method to lazy-load images as the user scrolls down the page. This will help improve page load time considerably as the content expands. We'll likely need a placeholder image that gets shown until each thumbnail is lazy-loaded, and also some sort of fallback for no-JS users using <noscript>.
Probably with the Intersection Observer API? It will be enabled by default with Firefox 54 as per Bug 1362168. https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
(In reply to Kohei Yoshino [:kohei] from comment #1) > Probably with the Intersection Observer API? It will be enabled by default > with Firefox 54 as per Bug 1362168. > > https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API I think we'd need something with a little broader cross-browser support for now.
Hmm, although perhaps the polyfill there may prove robust enough, thanks Kohei will investigate :)
Commits pushed to master at https://github.com/mozilla/bedrock https://github.com/mozilla/bedrock/commit/a3ef273c2eca6247b8340a1d1c3dd9d46c2918cd [fix bug 1363304] Lazy load Firefox feature thumbnail images https://github.com/mozilla/bedrock/commit/202f4728edc416975ac0572bfc02bcae73a242de Merge pull request #4860 from alexgibson/bug-1363304-firefox-features-lazy-load [fix bug 1363304] Lazy load Firefox feature thumbnail images