Turning web pages into standalone desktop applications for better performance

It’s ironic. The promise of running full browser-based desktop-like applications has nearly been fulfilled using web technologies like AJAX, CSS, .NET, etc. However, it has led to some unintended consequences. Browsers were just not really designed to display and run all of the dynamic pages that are so common today. I would argue that  much of the real-time dynamic web apps are based on hacks. The language and tools are just not very standard, robust, or well thought out. Web developers live in a world of incompatible browsers, unknown application environment, vague standards, poor memory management, extensions, etc.

Running a web app as a standalone desktop application doesn’t magically solve all of these issues, but it can help to provide a much nicer user experience. I find the apps are snappier and much  more responsive. I’m experiencing that right now as I type this into my WordPress blog posting app. There is probably a lot less battling over application resources, including demands from extensions and I have tons of those. Hell, even tabs have added to the chaos. Running web applications, like gMail, Google Reader, or Facebook like they were standalone applications has some very compelling benefits and is drop-dead simple to do as you will soon see.

Tearing an application away from the browser UI lets it run as its own system process and moves much of the full browser’s overhead crap out of the way. I find that the single processes seem to manage memory better too. I often had Firefox bulging at its seams after keeping it running just overnight. Browser memory management is abysmal and I’m sure sloppy page coding doesn’t help (I’m as guilty as anyone. object=null anyone? ;-). Plus, running a lot of extensions can exacerbate the problem. I suppose it’s not too surprising if you think about all of the junk that goes into a browser; the rendering of the page is almost secondary.

Besides the memory issues, I also found that the typing buffer would ebb and flow causing irritating pausing when I typed even just a few words. I found that this basically disappears when running the pages as desktop apps.

Both Firefox and Chrome have the ability to turn a web page into a standalone application. For Firefox, you need to add the Prism extension. After installing, navigate to the web page. From the Tools menu, choose Convert Website to Application.

A dialog will appear where you can set a few options. The Show navigation bar option will display a toolbar with the basic navigation buttons, plus display the URL. The Show status messages and progress option puts a progress bar at the bottom. The Enable navigation keys option allows keyboard shortcuts for page navigation. The Display in the notification area option just puts an icon in the system tray.

For the most part, I only find the Enable navigation keys option mandatory; the other options just add clutter. When navigation keys are enabled, you can use Alt+Left/Right arrow to navigate backward/forward. Most browsers have a ton of keyboard shortcuts (e.g., Firefox and Chrome). F5 to reload is a good shortcut to remember.

I like to save the shortcut to the Quick Launch Bar, but you can also save to your Desktop and/or Start Menu.

For Chrome, first navigate to the desired page. To the right of the address box there is an icon that looks like a page with a down arrow next to it. Click it and choose Create Application Shortcuts. A dialog will appear where you can set where you want the shortcut placed.

That’s it! As simple as it can get. Of course, you will end up with a lot more items on your taskbar, but you’ll have fewer browser tabs. You also get much more screen real estate since the UI window is barebones and doesn’t have all the clutter of the standard browser. You might miss some of your extensions though, like Flashblock and Adblock. Oh well, ya can’t have everything!

Note that links that open in new windows will open normally in the matching browser (i.e., Firefox or Chrome).

No sign of anything similar for IE, Safari, or Opera, but Mac users should be able to find Prism for Mac.

NOTE: What’s kinda interesting is that you can figure out which pages are the true memory hogs since each runs as a single process. Let the apps run overnight and open up Windows Task Manager to see the real pigs. You’ll need to kill the process and see which window goes away, cuz the process (image) names will all be the same for the same browser engine.

The worst offender? gMail. Note that the increase was pretty small, less than 10MB. A relatively distant second was Facebook. Google Reader was actually pretty good, surprisingly. Full Firefox running without any pages open had the biggest increase. No doubt owing to it’s infamous memory leaks and one or more of my extensions. I’ve heard that Forecastfox is notorious, but hell, that’s why I’ve got 4GB in this baby, right?

“Turning Web Apps into Desktop Programs”, MaximumPC, September 2009
“Prism or Chrome?”, http://www.xul.fr/mozilla/prism-or-chrome.html

Leave a Reply