Blink Rendering Pipeline — Style, Layout, Paint
How Chromium's Blink engine resolves CSS, lays out elements, and paints
Upstream research and deep dives (e.g. browser engine internals) informing design decisions.
모든 태그 보기How Chromium's Blink engine resolves CSS, lays out elements, and paints
Key terms and concepts from the Chromium compositor (cc/) and display
The Chromium compositor (cc/) is responsible for taking painted content
Research findings from reading the Chromium source code (chromium/cc/,
The scheduler orchestrates the frame production pipeline. It receives
The damage tracking system computes the region of each render surface that
Research document describing the mechanisms Chromium/Blink uses to mark
How Chromium optimizes visual effects (blur, shadow, opacity, blend modes,
How Chromium fetches, caches, and integrates external resources (images, stylesheets, fonts) into the rendering pipeline.
How Chromium maintains smooth interaction (scroll, pinch-zoom) even when
Memory Budget
How Chromium stores and accesses per-node data across its rendering
How Chromium records, stores, and replays paint operations. The recording
Complete mechanism for how Chromium handles pinch-to-zoom: the immediate
The compositor stores layer properties (transform, effect, clip, scroll) in
A render surface is an offscreen GPU texture that a subtree is composited
Source-level analysis of how Chromium handles rendering resolution during
Two mechanisms that create cross-tree references in SVG:
How SVG elements appear in Blink's accessibility (AX) tree. SVG is a
Every animatable SVG attribute is exposed to JavaScript as an
How Blink animates SVG. Two engines coexist: SMIL (`, `,
Three deployment modes for SVG content, with differing pipelines:
How Blink tracks transforms and coordinate spaces from the outer `` down
How Blink resolves a point in SVG space to an element. Different from HTML
A snapshot of which Blink rendering systems SVG participates in fully, which
How fill="url(#id)" and stroke="url(#id)" resolve into Skia shaders. Paint
How ` data becomes an SkPath`, and how SVG stroke properties
How Chromium handles the SVG `` element. The pattern element is a
The end-to-end pipeline for rendering SVG inside Blink. Emphasis on where the
How Blink (Chromium's rendering engine) renders SVG. These documents describe
`, , , ` — the four non-paint-server
SVG text is the most intricate part of SVG rendering because it combines:
Tiling Model
Deep dive into Chromium's tiling implementation from source (cc/).
A cross-engine comparison of how SVG rendering is factored across three