Monday, April 30, 2012

What Does a Browser Actually Do?

I do a lot of my development using web technologies. Much of my code winds up running in a browser (or driving something that runs in a browser). Most of the time, the browser is just a convenient delivery mechanism. I write a few lines of code, and the web browser interprets them and does all sorts of great layout and rendering stuff.

And anyone who has watched me try to work with PhotoShop knows that it's a really good thing that the browser is handling the rendering instead of me!

But to get back to the point, I can write perfectly find HTML, CSS, and JavaScript and the browser will handle it just fine most of the time. Sometimes, though, mysterious things happen. Sometimes a page will simply not finish rendering. Sometimes parts of it will be really slow. Sometimes layouts won't do what I meant for them to do. And then I have to start debugging. We can start with the simple things: looking for JavaScript errors, checking load order, etc. Once it gets more complicated, though, we have to start understanding what's going on. What is the browser actually doing with our code?

I found this fascinating - and long - article describing how modern web browsers actually work. An Israeli researcher spent a whole lot of time looking at browser source code and reading published works on browser internals, and wrote up a summary. It's a must-read for any web developers out there.

For web developers, the browser is a tool. A hugely powerful and important tool. And the way to get the absolute best out of that tool is to really understand it. Knowing how your tool works will make debugging easier and great new features possible.

No comments:

Post a Comment