Какие элементы содержатся в DOM, и не находятся в Render Tree?

В DOM, но не в Render Tree, находятся: невидимые элементы (`display: none`), метаданные (`<head>`, `<meta>`, `<script>`, `<title>`), а также сгенерированный `::before/::after` наоборот в render tree, но не в DOM.

Render Tree vs DOM

• DOM — полное дерево всех узлов документа.
• Render Tree — только видимые узлы для отрисовки (объединение DOM и CSSOM).

Элементы в DOM, но НЕ в Render Tree

display: none

Элемент есть в DOM, но не рендерится (не занимает места):

.hidden { display: none; } /* в DOM, но не в render tree */

Метаданные и не-визуальные теги

Не отображаются, поэтому не в render tree:

• <head> и его содержимое (<meta>, <title>, <link>, <style>).
• <script>.

Различие с visibility

• display: none → не в render tree (не занимает места).
• visibility: hidden → в render tree (занимает место, но невидим).
• opacity: 0 → в render tree (виден для layout, прозрачен).

Наоборот — в Render Tree, но НЕ в DOM

Псевдоэлементы ::before/::after с content — рендерятся (в render tree), но их нет в DOM:

.el::before { content: '★'; } /* в render tree, не в DOM */

Коротко для собеседования

В DOM, но не в Render Tree: элементы с display: none (не рендерятся, не занимают места) и не-визуальные теги (<head>, <meta>, <title>, <script>, <link>). visibility: hidden и opacity: 0 — остаются в render tree (занимают место). Наоборот, псевдоэлементы ::before/::after — в render tree, но не в DOM.