Page MenuHomePhabricator

[S] Improve image lazy-loading for MediaSearch
Open, Needs TriagePublic

Description

In T246792 @Gilles had a good suggestion for improving the lazy-loading images in search results:

While the image lazy loading is a great idea, it seems like it's not doing enough "look ahead", images only start loading when they get into the viewport. By using an Intersection Observer with a properly set rootMargin parameter, you can actually have images that are slightly below the viewport get loaded. This would ensure a lot smoother scrolling experience for users with reasonably fast internet connections, who would never see a loading thumbnail.

This should be pretty straightforward to fix.

Event Timeline

egardner created this task.Oct 6 2020, 9:16 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptOct 6 2020, 9:16 PM
CBogen renamed this task from Improve image lazy-loading for MediaSearch to [S] Improve image lazy-loading for MediaSearch.Oct 7 2020, 4:36 PM

Change 633241 had a related patch set uploaded (by Anne Tomasevich; owner: Anne Tomasevich):
[mediawiki/extensions/WikibaseMediaInfo@master] Load images before they enter the viewport

https://gerrit.wikimedia.org/r/633241

AnneT reassigned this task from AnneT to egardner.Oct 19 2020, 7:36 PM
AnneT added a subscriber: AnneT.

Assigning this to @egardner to take a look at the WIP patch. As we discussed last week, the rootMargin isn't having a noticeable effect on when images are loaded, even when bumped up to something excessive like 300%.