Gecko

Definition

A gecko is a small to large lizard that is found in warm climates. However, in the Mozilla context Gecko refers to the browser layout engine.

What exactly is a layout engine?

In essence a layout engine is responsible for the following:

• Formatting content such as images, text, HTML, and CSS and displaying them on the screen. In other words, it is responsible for defining the placement rules for documents by parsing

them and formatting it accordingly in order to render it on the browser screen. It's functionality is so rich that it is even being used to layout the "Chrome" (i.e. menu bars, scroll bars etc.)

What Gecko is:

• open source free software (It was initially created by Netscape Corporation but now its development is stewarded by the Mozilla Foundation.)
• cross-platform (Windows, BSD, Linux and Mac OS X)
• Written in C++
• Gecko is used in almost all Mozilla based software.
• The 2nd most popular layout engine after Trident (IE's layout engine).

What Gecko supports

Gecko supports the following open internet standards:

• Hyptertext Markup Language (HTML) v4.0
• JavaScript 1.6
• eXtensible Markup Language (XML) v1.0
• Cascading Style Sheets (CSS)
• Document Object Model (DOM) Level 1 & 2
• eXtensible Hyptertext Markup Language (XHTML) v 1.1
• Mathematical Markup Language (MathML)
• Scalable Vector Graphics (SVG)
• Resource Description Framework (RDF)

When would one want to use Gecko?

Gecko solves a problem faced by developers looking to render html, css and most other web content in within their applications. Gecko provides a rich standards compliant interface, which relieves the developer of the heavy lifting with respect to page rendering. Developers simply need to embed Gecko within their apps to harness its power.

Detailed information, tutorials, examples and frequently asked questions relating to getting started with Gecko and embedding it within applications can be found within the Embedding Mozilla section of the Mozilla Development Center

How does it work?

Gecko uses the Document Object Model (DOM) which provides a set of interfaces (available for both C/C++ and JavaScript) implemented by the NGLayout content model allowing for the insertion, deletion and modification of HTML content. These interfaces can be accessed by programmers via the Cross Platform Component Object Model (XPCOM). XPCOM allows for the modularization of large projects into into smaller manageable pieces called components as well as for the creation of interfaces (IDL's via XPIDL).

Gecko uses the following subsystems to accomplish its objectives:

Parsing

The Gecko parser provides the first steps required for the browser to display web pages. Despite being optimized to parse HTML the parser use is not limited to this type of data. The parsing engine transforms a source document from one form into another. In the case of HTML, it transforms the hierarchy of HTML tags (the source form) into a form that the underlying layout and display engine requires (the target form).

Rendering

This portion is responsible for displaying "bits" on output devices. These include the standard graphical primitives such as lines, rects, bitmaps, text, etc.

Layout

The layout portion is comprised of a set of classes that implement the HTML layout semantics. In other words it translates what the tags mean so that the required actions can be performed to render them properly.

Style

The style portion is responsible for the mapping and management of style data (i.e. CSS) onto document content in a given presentation.

An overview of these and the various other components can be found in the Gecko(NGLayout) Project Overviewor in the Layout Engine Technical Documentation

Contributors

Richard Chu & Sherman Fernandes

References

• Wikipedia - Gecko_(layout_engine)
• Gecko Home Page
• Mozilla Layout Engine
• Layout Engine Technical Documentation