Flash when previewing images

[Taiko2k]

Issue description

When clicking to view the full size of an image in a toot, a bright checker box pattern is shown before the image fully loads.

This creates an issue where if mastodon is using a dark theme and the loaded image is of dark content, this can effectively create a flash effect. I'm not sure if there is design reasoning for this checker pattern being present, this but I find it to be an annoyance and I imagine could pose an issue for people with sensitivity to flashes of light.

Interestingly this issue still occurs even if the image is already cached locally.

Suggested alternate behaviour

Any of the following could effectively solve the issue:

• Remove the checker pattern asset, leaving just the semi-transparent background of the preview overlay while the image loads.
• Show the low-resolution thumbnail in place and instantly switch to the full-resolution version once loaded.

Specifications

Mastodon 3.3.0 and earlier. Reproducible on both Firefox and Chrome.

---

Edit:

I found I can work around this issue by applying the custom CSS to my instance:

.image-loader__preview-canvas {
    visibility: hidden;
}

So this solves the issue for me individually.