Как работает механизм компоновки?

Я ДЕЙСТВИТЕЛЬНО любопытно, как веб-страница анализируется в дереве DOM, а затем как дерево отображается в веб-браузере. А именно, как работает механизм компоновки?

Я думаю, есть ли исходный код для чтения простого веб-браузера (сейчас Webkit слишком тяжел для меня. ) является допустимым выбором? Благодаря

Ответ 1

Разбор веб-страницы в дереве DOM не так сложно понять, поскольку (правильно сформированный) HTML уже находится в древовидной структуре. Поэтому я не думаю, что это много, кроме случаев, когда вы хотите также комментировать вещи, такие как CSS, условный код и скрипты в свое дерево.

Макет и рендеринг - это гораздо более сложная задача для разработки. Если вы не готовы к прямому погружению в код, вы можете прочитать их документы:

WebKit Макет и рендеринг

Ответ 2

Вы также можете перейти по этой ссылке, которая имеет большое объяснение и обзор соответствующего вопроса. http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/

Ответ 3

Страница, связанная с @binariedMe, хороша для понимания повествования о том, когда браузер анализирует html, а затем применяет правила компоновки. Если вы хотите получить более прочную ментальную модель этих правил, вы должны прочитать http://book.mixu.net/css/