content-visibility

Rare Earth Juejin Tech Community

Mar 7, 2025 · Frontend Development

Optimizing Infinite‑Scroll Waterfall Layouts with CSS Grid, IntersectionObserver, and Modern Browser Features

This article explains how to build a high‑performance infinite‑scroll waterfall layout for e‑commerce using CSS Grid, IntersectionObserver, native lazy‑loading attributes, asynchronous decoding, React's useTransition, content‑visibility, and the AVIF image format to reduce load time and improve smoothness.

AVIFCSS GridIntersectionObserver

0 likes · 13 min read

Optimizing Infinite‑Scroll Waterfall Layouts with CSS Grid, IntersectionObserver, and Modern Browser Features

Sohu Tech Products

Aug 4, 2021 · Frontend Development

Optimizing Long List Rendering with CSS content-visibility

The article explains how the CSS content-visibility property can dramatically improve rendering performance of long lists by rendering only visible elements, demonstrates before‑and‑after benchmarks, discusses compatibility and edge‑case issues, and offers practical fixes such as contain‑intrinsic‑size.

Browser CompatibilityCSSWeb Optimization

0 likes · 8 min read

Optimizing Long List Rendering with CSS content-visibility