CODEWITHSUNDEEP
browser
Matt Elson
Matt Elson

Reputation: 4355

How does layout engine work?

I am REALLY curious how a web page is parsed into a DOM tree, then how the tree is rendered in a web browser. Namely,how does layout engine work?

I guess whether reading source code of a simple web browser (Webkit is too hard for me now. ) is a feasible choice? Thanks

Upvotes: 10

Views: 6231

Answers (3)

Andrew Farrell
Andrew Farrell

Reputation: 2458

The page linked to by @binariedMe is good for understanding the narrative of when a browser parses html and then applies layout rules. If you want to get a more solid mental model of those rules, you should read http://book.mixu.net/css/

Upvotes: -1

binariedMe
binariedMe

Reputation: 4329

You can also go to this link which has a great explanation and review of the concerned question. http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/

Upvotes: 1

PPC-Coder
PPC-Coder

Reputation: 3632

Parsing a web page into a DOM tree isn't terribly difficult to understand since (well-formed) HTML is already in a tree structure. So I don't think there's much to it except when you want to also annotate things like CSS, conditional code, and scripts into your tree.

Layout and rendering is a much more challenging problem to work out. If you're not ready to dive directly in the code, you can read their docs:

WebKit Layout and Rendering

Upvotes: 4

Related Questions