Optimising gatsby-image Even Further
Optimise gatsby‑image with sensible maxWidth and quality settings, GraphQL image data, and selective use of the native loading attribute in Gatsby.
Articles
Image Rendering
Image rendering sounds simple until a page is slow, blurry, unstable, or needlessly expensive to download. These articles focus on the browser and delivery decisions behind that result, with performance measured in the experience a person receives rather than the number of optimisation terms applied.
Optimising gatsby-image Even Further. Optimising
Reducing Image Brightness with CSS. Reducing Image Brightness with CSS
Reduce image brightness with CSS filters. This guide explains brightness() values, transitions and the trade‑offs when adjusting images for dark mode.
Setting CSS Blur Filter to Zero on a Retina Screen. Setting CSS Blur Filter to Zero on a Retina Screen
A bug in the WebKit engine that only affects website Retina screen devices means that setting a zero‑blur filter in CSS isn't as easy as it should be.