Web Graphics and the Browser

As an example of how a web browser processes and organizes images internally, let’s look at the model used by the Mozilla web browser, which is the “open source” release of the Netscape browser. This is a good object of study because the browser’s code is freely available under the Netscape Public License, and the code is amply documented at Mozilla headquarters (http://www.mozilla.org).

Mozilla is written in C++. It is designed as a modular system with well-defined tasks handled by different modules. The layout of a page is handled by a layout engine called NGLayout (for Next Generation Layout). NGLayout is built on the open standards for Internet content (HTML, Cascading Style Sheets, and the Document Object Model) and it handles all the tasks associated with creating the layout of a page and rendering all of the page’s components. The layout engine draws all of the geometric primitives (such as rules and table borders), places text, and renders images by interacting with a lower-level Image Library. This Image Library is what actually manages the flow, the decoding, and the eventual display of images. When the layout engine calls for an image to be rendered, the Image Library takes the following steps:

  1. A URL is requested by the code that handles the layout of the page. This request could be initiated by the parsing of an <IMG> element or by one of the user interface options, such as the “Show Images” button on the navigation bar. This request is ...

Get Programming Web Graphics with Perl and GNU Softwar now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.