If you have images in menus or carousels or some other interface that is technically above the fold, but not visible, all you need to do is add loading="lazy" and the browser will defer downloading the image. You no longer need a JavaScript solution for those use cases.

When you combine CSS Functions, the nesting of these functions matters. In this post, we'll look at the difference between :has(:not) and :not(:has), and how to approach decoding CSS selectors that use these nested CSS functions.

The View Transitions API is more a set of features than it is about any one particular thing. And it gets complex fast. But in this post, we’ll cover a couple ways to dip your toes into the waters without having to dive in head-first.

Discover how to enhance accessibility and improve find-in-page search functionality using hidden="until-found" for icon-only buttons and hidden text labels.

When I need to load fonts from one of these third party services, this approach allows me to load the relevant files asynchronously while the page renders, while still hiding text for up to a few seconds to give the font a chance to load first.