Image scroll test page

Attempting resolution of issue seen in recent photo blog posts: scrolling down, or even back up, results in Chrome re-decoding images in CPU raster jobs, which takes time and leaves the viewer with a white screen.

This does not happen for at least one photo-heavy website I have visited. I do not understand why.

When does it happen?

Permalink to “When does it happen?” #

• Happens if a bunch (~30) images are embedded normally
• Does not happen if the same image is repeated (~50x)
• Happens if images are all given fake widths + heights (e.g., 1000 x 1000).
• Happens at first if images are all given small fake widths + heights (e.g., 100 x 100), then after several rounds of scrolling up and down, everything stays loaded
• Happens if all widths and heights are provided, width capped and height used (imgs distorted)
• Happens if all widths and heights are provided, width capped and height set to auto (imgs now undistorted)
• Happens if images are all shrunk to 2/3 height (~50% size). It is alleviated, but I think the decoding simply finishes faster.
• Happens if all widths and heights are provided, images allowed to be full size (no W or H cap), and they’re 50% size.

# when testing, embed images here w/
python scripts/image_size_test.py | pbcopy