Tag

will-change

1 views collected around this technical thread.

NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Dec 29, 2021 · Frontend Development

Understanding Browser Compositing Layers: A Guide to CSS Hardware Acceleration

The article explains how browsers build render trees and use GPU‑accelerated compositing layers—created by properties like transform, will‑change, or media elements—to improve performance, avoid repaint glitches such as iOS timer flicker, and offers best‑practice tips for using these layers efficiently without excess memory use.

Browser RenderingCSS OptimizationGPU rendering
0 likes · 10 min read
Understanding Browser Compositing Layers: A Guide to CSS Hardware Acceleration
Taobao Frontend Technology
Taobao Frontend Technology
Mar 23, 2021 · Frontend Development

How to Supercharge Web Rendering with CSS content-visibility, will-change & contain

This article explains how modern CSS features such as content-visibility, will-change, contain, font-display, scroll-behavior, @import avoidance, media‑query splitting, and CSS custom properties can be used together with practical code examples to dramatically reduce page‑render time, improve smooth scrolling, and avoid layout shifts for faster, smoother web experiences.

CSSPerformancecontain
0 likes · 27 min read
How to Supercharge Web Rendering with CSS content-visibility, will-change & contain
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Jul 18, 2017 · Frontend Development

Why My ::after Horizontal Line Won’t Scroll: Debugging Layer Bugs in Chrome

This article explores a scrolling issue caused by a CSS ::after‑generated line that creates an unexpected rendering layer, explains how will‑change and transform can influence layer creation, and documents the puzzling paint/composite behavior observed during debugging.

Browser RenderingCSSPerformance
0 likes · 5 min read
Why My ::after Horizontal Line Won’t Scroll: Debugging Layer Bugs in Chrome