Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm interested in how browser layout engines like gecko, webkit and trident are architected from a high level. what are the key abstractions? how are they layered? what are the inputs/outputs for the different abstractions? Is there a diagram or article that explains this particularly well?

I am sure the implementations vary, but I'm generally curious about how all the pieces fit together. I realize webkit is open source and I can just look at the code, but I wouldn't know where to start.

share|improve this question
up vote 17 down vote accepted

A few papers that will help you get a better understating of browser architecture:

Be warned, the links are to pdf files. The last one is not exactly what you are looking for, but it's a good read. As for specific layout engines:



You can find some basic architectural diagrams in this presentation on Developing hybrid Web GTK+ applications by Alp Toker.


share|improve this answer
fantastic Yannis, this is just what I was looking for. thanks – Paul Sanwald Nov 4 '11 at 18:49

The following links may also be useful:

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.