Right now when loading a large list of files, it takes a long time for the images to show up, even more so because masonry needs the images loaded to get its height/width.

In addition, there is styling on the grid-item, so the CSS that wraps the image shows up, which looks bad.

I propose we hide the grid item until the images are loaded, and add a loading icon to let the user know its still working.

CommentFileSizeAuthor
#3 image-preload-styling-2718897-3.patch1.86 KBsamuel.mortenson
#2 image-preload-styling-2718897-2.patch44.15 KBBcwald
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Bcwald created an issue. See original summary.

Bcwald’s picture

Bcwald CreditAttribution: Bcwald commented
FileSize
image-preload-styling-2718897-2.patch44.15 KB
samuel.mortenson’s picture

samuel.mortenson
he/him
Primary language English
CreditAttribution: samuel.mortenson at Acquia commented
Status: Active » Needs review
FileSize
image-preload-styling-2718897-3.patch1.86 KB

Here's a follow-up patch which uses the standard Drupal.Ajax loading element, which reduces the codebase and adds consistency as the initial loading icon will visually match the Views AJAX loading icon.

Bcwald’s picture

Bcwald CreditAttribution: Bcwald commented

Yeah, that makes sense. patch #3 works for me.

Bcwald’s picture

Bcwald CreditAttribution: Bcwald commented
Status: Needs review » Reviewed & tested by the community

samuel.mortenson’s picture

samuel.mortenson
he/him
Primary language English
CreditAttribution: samuel.mortenson at Acquia commented
Status: Reviewed & tested by the community » Fixed

Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.