# The Anatomy of a Frame

DevFeed: [The Anatomy of a Frame](<https://devfeed.tech/articles/the-anatomy-of-a-frame-39440.md>)

Original publisher: [Read original article](<https://aerotwist.com/blog/the-anatomy-of-a-frame>)

Author: Paul Lewis

Published: 2016-02-15T00:00:00Z

Content type: tutorial

Language: en

Sources: [Paul Lewis](<https://devfeed.tech/sources/paul-lewis.md>)

Topics: [Chrome](<https://devfeed.tech/topics/chrome.md>), [browser](<https://devfeed.tech/topics/browser.md>), [Processes](<https://devfeed.tech/topics/processes.md>), [GPU](<https://devfeed.tech/topics/gpu.md>), [JavaScript](<https://devfeed.tech/topics/javascript.md>), [layout](<https://devfeed.tech/topics/layout.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [browser](<https://devfeed.tech/tags/browser.md>), [chrome](<https://devfeed.tech/tags/chrome.md>), [code](<https://devfeed.tech/tags/code.md>), [gpu](<https://devfeed.tech/tags/gpu.md>), [jank](<https://devfeed.tech/tags/jank.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [layout](<https://devfeed.tech/tags/layout.md>), [pixels](<https://devfeed.tech/tags/pixels.md>), [process](<https://devfeed.tech/tags/process.md>)

## AI overview

This reference explains how Chrome and Blink move content from browser processes and renderer threads to the screen. It describes the GPU process, compositor thread, main thread, tile workers, input handling, JavaScript, style, layout, paint, and frame delivery, while noting that the architecture may differ across browser vendors.

## Source excerpt

I'm often asked by other developers about parts of the pixel workflow, and what fires when and why, so I figured it might be worth putting up a little reference for what's involved in shipping pixels to screen.