Improving Website Performance with CSS Containment

Learn about CSS Containment, a new standard for improving website rendering performance through subtree isolation. Explore the different types of containment, their use cases, and the optimizations implemented in rendering engines. Discover how the "contain" property allows user agents to apply strong optimizations, significantly boosting web page performance. Examine examples, review the status of CSS containment across browsers, and gain insights into future plans for this feature. Dive into topics such as module containment, size containment, and content size, while understanding the effects on browser engines and stress testing. This talk from CSSconf EU 2019 provides a comprehensive introduction to CSS Containment and its potential impact on web development.

Introduction
About me
CSS Containment
Improving Website Performance
Candidate Recommendation
What is CSS Containment
Confusion about CSS Containment
Contained property
Container elements
Browser engines
Module containment
Effects
Cover Flow
Baseline
Pain Containment
Size Containment
Content Size
Stem Containment
Chromium
Counters
Close Quotes
Chrome
Firefox
Chromium Link
Bloomberg
Huge Table
Stress Test
Future
Optimization