Page MenuHomePhabricator

[S] Improve image lazy-loading for MediaSearch
Closed, ResolvedPublic

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

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 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%.

I agree that other things may need to be done to improve image loading (I think that we ultimately need to look at how thumbnails get generated – I think https://phabricator.wikimedia.org/T263705 is a better place to discuss that). This does not hurt things and may be helpful so I'm going to merge and close this task.

Change 633241 merged by jenkins-bot:
[mediawiki/extensions/WikibaseMediaInfo@master] Load images before they enter the viewport

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

egardner removed egardner as the assignee of this task.