WebKit Rendering: Overview for HTML5 Developers
summary
WebKit has ~150,000 revisions and averages ~3,000 commits/month with about 10% tests; HTML5 parsing is ~10,000 lines and the tokenizer implements ~70 states, and recent builds add a threaded HTML parser to avoid UI blocking. Rendering constructs DOM → render tree → layout → paint, then a compositor uses per-element backing stores and layers; performance problems come from repeated texture upload count when changing colors or filters, while transforms and opacity animate smoothly because GPU already holds textures.
AI-written summary · about
chapters (42)
- 0:00Intro
- 2:03Heavy on TDD
- 2:36Involvement: Social Layers
- 3:43Big Players
- 4:19Browser at a High Level
- 5:00WebKit Components
- 5:34Platform Abstraction
- 7:43Loader Resource, Document, Frame, Page
- 8:51Browser Caches
- 9:09HTML Tokenizer
- 9:55HTML Parser
- 11:00Preloader Scanner
- 12:22DOM Tree vs Render Tree
- 14:45Style Recalc vs Layout
- 15:15Effects of Style Recalc and Layout
- 16:00Minimizing Layout
- 16:31Goals of Painting
- 17:04Graphics Abstraction
- 17:58CSS Painting: 10 Stages
- 18:21Painting Flow: Browser vs Webkit
- 19:21Stroke and Brush
- 20:01Painting Complexity
- 21:33Graphics Processing Unit
- 22:15Efficient Uses of GPU
- 23:04Responsive Interface
- 23:15Maps
- 23:36Rendering vs Interaction
- 24:04Checkerboard Pattern
- 24:34Pinch to Zoom
- 24:44Progressive Rendering
- 25:01Tile Transformation
- 25:49Tiling System
- 26:41Mechanics of Animation
- 27:44Element and Logical 3-D
- 29:22Compositing Indicators
- 29:51Frame Rate HUD
- 30:33Avoid Texture Reupload
- 34:42Photon CSS Lighting
- 36:17Timer Latency
- 36:31Prepare and Reuse
- 38:28Color Transition Trick
- 39:06Rendering Aspects
