Question

What does the browser do after receiving files from the server?

Answer 1

Short answer: it parses and executes the resources, builds the page’s internal representation, computes layout and paints pixels to the screen (and caches files for later).

More detail (typical sequence):

1. Parse HTML into a DOM (Document Object Model).
2. Discover referenced resources (CSS, JS, images, fonts) and request them as needed.
3. Parse CSS into a CSSOM (CSS Object Model).
4. Execute JavaScript. (Note: external scripts can block HTML parsing unless marked async/defer; scripts can read/modify the DOM and CSSOM.)
5. Combine DOM + CSSOM to create the render tree.
6. Layout (reflow): compute sizes and positions for every render-tree node.
7. Paint: rasterize the render tree into pixels (often into multiple layers).
8. Compositing: GPU compositing of layers to produce the final rendered page shown on screen.
9. Continue to respond to events and run JS; subsequent DOM/CSS changes can trigger additional reflows/repaints.
10. Cache received files (according to cache headers) and reuse connections (keep‑alive) as appropriate.

That sequence is the browser’s rendering pipeline; details can vary between engines but the high-level steps are the same.