As the Internet becomes more and more engraved into our everyday lives, if you are going to do business over the Web, you should educate yourself on what goes into a browser and how those features can effect your overall business decisions. For the purpose of this article I shall cover the two features that are most influential to the development cycle for a Web site — the layout engine and the JavaScript engine.

The Layout Engine

The term layout engine (sometimes referred to as the rendering engine) is the part of the browser that formats what is placed on a Web page. In technical terms, it is the part of the browser that takes content that has been written in (X)HTML/XML and uses CSS to apply style (e.g. make header green or separate content into two or three columns) to said content. The purpose of separating content from presentation is that to reduce the size of Web pages (which will decrease the loading time of a page) and to decrease development/maintenance time.

Layout engines are not exclusive to Web browsers. Layout engines are commonly used by Internet-capable applications such as E-mail clients, Instant Messengers, and other applications that need to display Web content. While there are numerous Layout engines, the following are the most prevalent layout engines in use and a list of many key applications that use these engines.

The JavaScript Engine

The JavaScript engine portion of the Web browser is the portion that applies the behavior to a Web page. A behavior would be some action that occurs on a Web page as a result of an action by the user. For example, replacing the main image in a photo gallery when the user clicks on or moves their mouse over a thumb nail image, or when a WYSIWYG editor is applied to a form input box.

Because of the push of Web applications inside the browser, the JavaScript engine is primarily maintained by the core developers behind the Web browser. For example, you’ll notice that both Safari and Google Chrome use WebKit as their layout engine, but Safari uses the SquirelFish JavaScript engine, while Google Chrome uses the V8 JavaScript engine. For completeness, here is a list of JavaScript engines and their primary Web browsers.

JavaScript Engine

Used by

Note

JScript

Microsoft Internet Explorer

SpiderMonkey

Mozilla Firefox

pre-version 3.5

TraceMonkey

Mozilla Firefox

version 3.5+

Rhino

Java

Java version of SpiderMonkey

SquirrelFish

Safari

V8

Google Chrome

Linear B

Opera

versions 7 – 9.5

Futhark

Opera

versions 9.5 – 10

Carakan

Opera

versions 10+

Market Share

As you can see from the above, there are a lot of different possibilities that can affect development. Because of this developers tend to create a support graph indicating what browsers are actively tested. This support graph is typically based off of market share — the percentage of use a product has in the market. Some developers go the extra mile to forcibly block browsers that do not meet said criteria. This is typically a short sighted process because you are artificially reducing your potential client base. For example, developers that allowed Safari were actively blocking Google Chrome for a time being, despite both browsers using the same layout engine.

When developing your personal support chart you need to take in to account what market you want to push your product currently, and where you want to be in the future. For example, Opera has less than 1% market share in North America, but makes up 36.14% market share in Russia.