the inner workings of a browser

Usually you hear people talking about browsers when there are rendering inconsistencies, javascript incompatibilities or features lacking. We love to complain about the tools that output our work, but we do so on a very basic level. We throw input at our browsers, we look at the output and start to grumble when something is not coming out well. That's alright I guess, but if we just keep it at that we'll never really learn to use the browser to our advantage.

In most other professions people are taught about the tools they work with. You can't fly a plane unless you know a couple of things about physics, math and electronics. The more complex the tool, the more important it is to understand it at a core level. That's not to say a front-end developer should understand the finer delicacies of rendering an entire page in every single browser out there, but some general knowledge will definitely come in handy. This broader understanding would form a perfect base for tackling problems, making connections and becoming generally better at what it is we do.

Currently most people know bits and pieces, based on information they just happened to encounter when they felt adventurous enough to actually sit down and read up. Or when they met a particular problem that needed fixing, forcing them to dig deeper into the inner workings of the browser. This is all fine of course, but hardly conform with the future-proof spirit I like to apply in my work. I prefer to prepare for problems when they arise, or try anticipating them so they won't even occur in the first place.

knocking on some doors

If you start looking around for information on browser activities when rendering/redrawing/leaving a page you'll come up with very little. Most of the information is related to specific problems, more often than not we get little more than tepid conclusions based on black box tests. So I took the time to do some extra research on how a browser performs his primary job, starting at the source. I opened up my IRC client and entered the Opera, FF and webkit chats for a little talk with the people who actually work on these browsers. The results were pretty interesting.

The bottom line though is pretty simple: the documentation I was after simply doesn't exist, at least not in any structured form. I asked for books, schemes, online or offline documents, but got nothing substantial from any of the channels. The webkit guys remained awfully quiet (though they seemed pretty busy discussing some bugs), the Opera guys told me they'd rather not reveal too much about their engine, the FF crew informed me that the browser core changes too much to maintain any kind of up to date document. They did say they were available for more direct and concrete questions, which was rather nice of them.

So even if you go through all the trouble to get some idea of how the browser handles our web pages, there isn't much info out there that will help you. Either browser developers don't like to share the exact details, or they simply don't have the resources to keep updated information. That in itself is an interesting find, one which is once again telling for the state of our profession.

meager findings

Along the way I did find an odd resource here and there, so I'm just going to share what I've got so far. It's pretty random and not very focused, but at least it's something:

• FF engine scheme (1999)
• Steve Sounders on script execution (black box testing)
• Google guy digs into webkit
• webpagetest.org: live results of page loads and timing

conclusion

Knowing what exactly happens when you leave or enter a page is crucial if you want to spent time on optimizing web pages or when you happen to encounter timing issues. Sadly this information is not readily available today, nor did I find a source that gathers all the bits and pieces and puts it in one single location.

Finally I'd like to thank the people I bothered with my annoying questions for their time and help, they must've picked up my disbelieve/surprise but they were still nice enough to explain their situation. If I missed some vital resources or you guys have any more links to share, please do so in the comments. The more information I can get my hands on, the better.