web dev//rendering//DOM

The DOM is the in-memory representation of the document that the browser builds and that JavaScript can modify. The HTML that arrived is the initial blueprint; the DOM is the building the browser has assembled right now.

The DOM is the in-memory representation of the document that the browser builds and that JavaScript can modify. The HTML that arrived is the initial blueprint; the DOM is the building the browser has assembled right now.

HTML is what the server delivers initially: raw material. HTML and DOM can start similar and end up very different once JavaScript modifies the page, adds elements, fetches data, removes nodes.

A non-rendering crawler only ever sees the HTML; a rendering crawler and any browser automation see the DOM. Under CSR the difference is the whole page; under SSR it is mostly the interactive parts added by hydration. That distance is the crawler's blind spot: it reads the blueprint while the user lives in the building, and every SEO fix for JavaScript sites is a way of shrinking it.

In React, JSX only describes elements; React's renderer computes the changes and applies them to the real DOM.

Parsing HTML produces a tree of the same shape; the DOM is that tree kept alive and mutable inside a running browser.