Javascript Madness: Layout Engines

Jan Wolter
May 6, 2008

In other pages in this series, I refer to most browser by their browser name ("Internet Explorer", "Opera", "Safari", "Konqueror") but instead of talking about "Firefox" I talk about "Gecko". This page is mainly here to explain that choice.

Layout Engines

From the Javascript programmers point of view, what tends to be most important is not which browser version is being used, but which layout engine version is being used. The layout engine is the part of the browser that actually interprets the the HTML and draws stuff on the screen. It handles the execution of Javascript code and provides the document object model and event models that the Javascript code interacts with. There are several different layout engines around, and most of them are used in many different browsers. Here's a few of the most widely used ones:

Layout Engine	Browser
Trident	Internet Explorer for Windows Netscape 8.1
Tasman	Internet Explorer 5 for Macintosh
Gecko	Firefox Netscape 6 and later Mozilla Camino K-Meleon SeaMonkey Epiphany 2.20 and before Galeon
KHTML	Konqueror
WebKit	Safari iCab 4 and later Epiphany 2.26 and later OmniWeb Shiira Midori
Presto	Opera
iCab	iCab 3 and before
Tkhtml	Html Viewer

Notes:

This list is very far from complete. All of these layout engines are used in other browsers not listed here, and there are a few other layout engines.
Apple's WebKit is derived from KHTML, but there are enough differences that programmers should probably think of them as separate.
Netscape 8.1 has a menu option from which you can choose to render either with the Trident layout engine or the Gecko layout engine. Netscape 9 was Gecko-only.

In writing articles about the behavior of different versions of different browsers, it's generally clearest to refer to the browser instead of the layout engine, as layout engines are much less well known. However, since there are several fairly common Mozilla browsers with different version numbering schemes, this gets a bit awkward. I could say that there are certain annoying layout bugs in Firefox 1.0, Mozilla 1.7, Netscape 7.2 and 8.1, Camino 0.8 and Epiphany 1.4 and 1.8. But I'd much rather say that there are certain annoying layout bugs in Gecko 1.7, which underlies all those browsers.

This goes beyond ease of expression. In many cases, the only way to write "portable" Javascript code is to sense the browser type by looking at the navigator.user_agent string, and running different code for different versions of different browsers. If you do this, what you want to look for with the Mozilla browsers is not the browser version number, but the Gecko version number. For example, the following user agent string is for "Firefox 1.5" but the Gecko version is 1.8.

   Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8) Gecko/20051111 Firefox/1.5

If you write your code to pay attention to the Gecko version number, then you can handle all Gecko-based browsers as one case, instead of having separate cases for each different browser. So from a programmer's point of view, what matters is Gecko, not Firefox. Admittedly this is true for other browers too - for Safari, you want to parse out the AppleWebKit version number, not the Safari version number - so perhaps I should go entirely to refering to rendering engines instead of browsers, but I'd prefer not to because WebKit version numbers are ugly.

Gecko Versions

For readers interested in mapping Gecko version numbers refered to in these articles to actual browser versions, here is a rough guide:

Gecko version	Mozilla Suite	Firefox	Netscape	Camino	K-Meleon	Galeon	Epiphany
Gecko 1.9	SeaMonkey 2.0	Firefox 3.0	-	Camino 2.0	K-Meleon 1.5	-	-
Gecko 1.8	SeaMonkey 1.1 SeaMonkey 1.0	Firefox 2.0 Firefox 1.5	Netscape 9.0	Camino 1.x	K-Meleon 1.1 K-Meleon 1.0	Galeon 2.0	Epiphany 2.x
Gecko 1.7	Mozilla 1.7	Firefox 1.0	Netscape 8.1 Netscape 8.0 Netscape 7.2	Camino 0.8	K-Meleon 0.9	Galeon 1.3.16 Galeon 1.2.14	Epiphany 1.8 Epiphany 1.4
Gecko 1.6	Mozilla 1.6	Firefox 0.8	-	Camino 0.7+	-	Galeon 1.3.12	Epiphany 1.2 Epiphany 1.0
Gecko 1.5	Mozilla 1.5	Firebird 0.6.1	-	-	K-Meleon 0.8	Galeon 1.3.10	-
Gecko 1.4	Mozilla 1.4	Firebird 0.6	Netscape 7.1	-	-	Galeon 1.3.6	Epiphany 0.9
Gecko 1.2	Mozilla 1.2	Firebird 0.1	-	-	K-Meleon 0.7	Galeon 1.2.7	-
Gecko 1.0	Mozilla 1.0	-	Netscape 7.0	Camino 0.7 Chimera 0.6 Chimera 0.4	-	Galeon 1.2.5	-
Gecko 0.9	Mozilla 0.9	-	Netscape 6.2 Netscape 6.1	-	K-Meleon 0.6 K-Meleon 0.4	Galeon 1.1 Galeon 1.0	-
Gecko 0.6	Mozilla 0.6	-	Netscape 6.0	-	K-Meleon 0.2	-	-

Notes:

While the Mozilla browser still existed under that name, it's version numbers always matched the version numbers of the rendering engine. That association obviously no longer holds.
Development of the Netscape and Galeon browsers has been discontinued. The Epiphany browser has dropped Gecko and is using WebKit instead.
Gecko 1.8 was the first not to piss me off. Browsers based on older versions should be avoided.
Gecko 1.5 and 1.2 pretty much never saw the light of day. They were never in wide usage.
Netscape 8.1 can be set to use either Gecko or Trident, the Windows layout engine. It does send different user agent strings depending on which layout engine is selected. Netscape 8.1 says it uses Gecko 1.7, but it behaves in many ways more like Gecko 1.8. I think they must have applied many Gecko 1.8 patches to it.
The mapping from Gecko versions to Epiphany and Galeon version numbers is approximate. The same browser version may be built with any of several different Gecko versions in different Linux distributions. The Galeon version numbers are the earliest releases compatible with the final Gecko release.

It should be noted that some of the Mozilla people deny that Gecko is named "Gecko". They say that that is term invented by Netscape's marketing department for the combination of the Mozilla "NGLayout" project (which was previously called "Raptor") and the Mozilla "XPFE" project. Which doesn't explain why the user agent strings in all Mozilla browsers say "Gecko". So to heck with them. It's "Gecko" whether they like it or not. Much better name anyway.

WebKit Versions

The WebKit rendering engine seems to be growing rapidly in popularity. It's possible that someday I'll have to revise these pages to refer to "WebKit" instead of "Safari", but that would mean I'd have to refer to things by WebKit version numbers, which are hideous. Still, since your programs really should be testing based on WebKit version numbers, not Safari version numbers, here is the mapping:

WebKit Version	Safari
525.19	3.1.2
525.18	3.1.1
525.7	3.1
523	3.0.4
418.8	2.0.4
417.9	2.0.3
416	2.0.2
412.7	2.0.1
412	2.0
312.8	1.3.2
312.5	1.3.1
312.1	1.3
125.5.5	1.2.4
125.4	1.2.3
125.2	1.2.2
100	1.1.1 1.1
85.8.2	1.0.3
85.7	1.0.2 1.0

I think most other WebKit-based Macintosh browsers (like iCab 4 and Shiira) will use whichever WebKit is installed with the Safari that is currently on your computer. Because of this, there is no consistant mapping between their versions and WebKit version numbers.