Moving pages through the browser stack

It’s useful to think of a web browser’s functionality as a stack of layers, all of
which build upon each other and interact with each other. The web page you
see onscreen passes through each of these layers on its way to your monitor
and your eyeballs.
At the bottom layer is the engine, which handles low-level chores that are
pretty similar from browser to browser. At the top level of the stack are more
sophisticated tasks and features specific to particular browsers — for example,
the way Google Chrome lets you search Google by entering keywords
into the address bar.
Figure 1-1 shows what the browser stack looks like for Google’s Chrome web
browser. Web pages in this model are processed from the bottom up. You
can read more about each of the different components in this stack at


http://dev.chromium.org/developers/design-documents/
displaying-a-web-page-in-chrome

Figure 1-1:        

               

Browser window

                                           

Tab contents

                                             

 Renderer host

(RenderViewHost, RenderWidgetHost)

src/chrome/browser

src/chrome/browser/tab_contents

src/chrome/browser/renderer_host

(process boundary)

src/chrome/renderer

src/webkit/glue

third_party/Webkit

Renderer

(RenderView, RenderWidget)

WebKit glue

(WebView, WebWidget, WebFrame, etc.)

WebKit glue

WebKit

Web pages are processed through a number of layers before being displayed to you.