Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Reinventing the Browser

DZone's Guide to

Reinventing the Browser

· Web Dev Zone
Free Resource

Learn how to build modern digital experience apps with Crafter CMS. Download this eBook now. Brought to you in partnership with Crafter Software

In the last decade, people have thrown away the notion of web browsers being just a web page renderer.  Organizations such as Mozilla, Apple, Opera, Google, and Microsoft have turned the browser into a full-fledged application runtime platform.  At a the Ajax Experience conference, Ben Galbraith, the co-director of developer tools at Mozilla, says that on the surface browsers are getting simpler, but the code is getting more sophisticated and powerful.  More emphasis is being put on JavaScript performance and on the web as an open development platform.  Galbraith explains some of the new browser technologies that will fundamentally change the way that web applications are built.

Canvas
HTML5 is becoming a major part of the web landscape by enabling browser-native video, audio, and offline data storage.  The Canvas specification could possibly be the most influential technology in HTML5.  It's history began with Apple's Dashboard for Mac OS X.  The company wanted to make it simpler to create applications on the dashboard.  They decided that the browser would be the best tool to accomplish this, so they gave Safari arbitrary graphics rendering.  Traditionally, web developers have only had standards for using text, boxes, and images to build applications in a browser.  Canvas gives web designers greater freedom in building user interfaces.  Canvas is very simple to use and it doesn't need a scene graph.  If you want to create a scene graph, the SVG standard is another great tool that can make vector graphics.  The advantages of Canvas over a plugin include immediate mobile availability, no startup delay, and full rendering fidelity with the browser.  

JavaScript Engines
Besides design flexibility, speed is one of the most important factors in a browser.  Google Chrome's increased adoption is largely because it markets itself as fast and lightweight.  Google helped start this speedy internet movement with Chrome's V8 JavaScript engine.  Now all of the major browser vendors are investing heavily in better JavaScript engine performance.  These browser advancements open up a new realm of possibilities for client-side applications.  The SPDY protocol is another Google project to make the internet faster.  It is designed to minimize latency through multiplexed streams, request prioritization, and HTTP header compression.

Garbage Collection
Browser memory management is also changing the way that web applications collect garbage.  Google has created a solution to the slowdowns associated with garbage collection.  The method is called generational garbage collection and it splits the heap into two parts: a young generation and an old generation.  The browser first analyzes the younger generation and then moves the still-active parts into the old generation.  This dramatically reduces the amount of heap that the garbage collector has to analyze on a regular basis.

Web Workers
Jakob Nielson, an expert on web usability, says that people notice the tiniest delays in a user interface.  Nielson says that a 1/10th of a second delay is all it takes for a person to feel like the program can't keep up with them.  UI threads tend to be the bottleneck when it comes to interface responsiveness.  The general solution to this problem is background threads, but browsers don't have them.  This is why Google introduced the notion of "workers" in Google Gears.  Workers allow you to do things in the background without shared state, which is the danger of threading.  Workers provide a sandbox where you can execute code separately but in parallel with the UI thread.  Java and Flash plugins can provide full threading and achieve the same effect, but the HTML5 spec for web workers has built this function into the browser.  

Desktop-Native Web Apps
Desktop integration is another direction that the browser is going towards.  There are a few technologies that are making great strides in this area.  Mozilla Prism and Fluid are two examples that let you run web applications from your desktop.  Adobe AIR takes this concept even further by giving users the ability to take AJAX applications and run them on the desktop with native services.  Appcelerator Titanium is an open source version of the same concept.  PhoneGap is another web app integration tool for mobile operating systems that can package up a web application and run it like a native mobile application. 



The Web as a Platform
Perhaps most significant change in web browser landscape will be the movement towards the web as an open platform for native application development.  Palm's WebOS and Google's Chrome OS are early adopters of this model.  As this trend continues, we could see lighter-weight desktops and more freedom from proprietary platforms.  More portals like the iPhone App store could emerge for developers to monetize these web-built applications.

A video of Galbraith's talk can be found here

Crafter is a modern CMS platform for building modern websites and content-rich digital experiences. Download this eBook now. Brought to you in partnership with Crafter Software.

Topics:

Opinions expressed by DZone contributors are their own.

THE DZONE NEWSLETTER

Dev Resources & Solutions Straight to Your Inbox

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

X

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}