targets. In the world of the Web, the main challenge is limiting your footprint as much as possible to produce a responsive user experience. That’s not to say that one user interface can suffice in all environments, rather that the majority of the application logic is in one code base and then specific device-specific UI idioms can be implemented with conditional code. You therefore might want to implement slightly different functionality and user experiences appropriate to the expectations of the users of a particular device. For example, Android and BlackBerry devices have physical back and menu buttons, whereas an iOS device does not.

Another key point to remember is that even though the mobile industry is quickly converging on WebKit as the de facto standard for HTML rendering engines, every device and operating system has a slightly different flavor of WebKit. This means you should expect development to be similar to cross-browser Web development today. Thankfully, there are many libraries such as jQuery Mobile, Sencha Touch, and SproutCore that seek to address this.

All of this discussion of latency and execution of code means taking a tough look at the business goals of your application development initiative. Favoring data over decor is the most pragmatic approach. Gradients, drop shadows, bevels, embossing, highlights, rounded corners, and Per-lin noise do not make an application useful or usable—they don’t fulfill a business requirement—but they do impact performance. CSS gradients, in particular, are real devils for performance in the mobile world. You need to decide what your objective is: looking neat or providing a useful interface for data publishing and acquisition. You win some of these capabilities on some platforms with optimized (often hardware-accelerated) pixel painting with native code. It’s not that these effects are impossible to achieve, but they should be used judiciously and only when they enhance and do not distract from the user experience. It is possible to deliver a great user experience that succeeds in the market; it just requires proper mobile Web development techniques and good user-ex-perience skills that take into account the constraints of the environment.

Lovely Bounces and
Beautiful Design

Of course, beautiful design matters. From aesthetics to intangibles such as the structure of a good program, software designers must commit to great design and to building on solid practices already in place. Scrolling via kinetic physics, lovely bounces, easing, and so forth create reactive interfaces that feel real and are a delight to use. This is an area where native controls are particularly good.

We have yet to solve the problem of native scrolling satisfactorily with Web technology. 1 There have been many attempts: iScroll (http://cubiq. org/iscroll), TouchScroll (http://uxebu. com/blog/2010/04/27/touchscroll-a- scrolling-layer-for-webkit-mobile/), GloveBox ( https://github.com/purple-cabbage/GloveBox), Sencha (http:// www.sencha.com/), and jQuery Mobile ( http://jquerymobile.com/). All of these address the scrolling issue but do not solve it as well as a native device. Even the Google mobile team is working on releasing a solution for this problem. 3 Without a doubt, this is the most common complaint the PhoneGap team hears, but we’re one bug fix in WebKit away from it being a nonissue. The Google Mobile team has recently released its solution and code for Web-Kit-based browsers and platforms. 2

Here’s the rundown. The Web technology stack has not achieved the level of performance we can attain with native code, but it’s getting close. We’re confident that Web technologies will become indistinguishable from native experiences. In the meantime, Web developers must focus on delivering data while working diligently on improving the decor.

Looking to the future

As much as native and Web are pitted against one another in this debate, the likely outcome is a hybrid solution. Perhaps we’ll see computing as inherently networked and (this is my sincere hope) free for anyone to access. We already see signs of a native Web: WebGL recently proved that in-browser 3D gaming is possible, even running Quake III ( http://media.tojicode.com/ q3bsp/)!

In the meantime, software makers
must balance the Web-vs.-native de-
bate based on an application’s primary
objectives, development and business
realities, and the opportunities the
Web will provide in the not-so-distant
future. The good news is that until all
of this technology makes it into the
browser, hacks such as PhoneGap can
help bridge the divide. I encourage de-
velopers not simply to identify software
development trends but to implement
them! If the Web doesn’t fulfill a capa-
bility your particular application re-
quires, you’re presented with an excit-
ing opportunity to contribute and close
the Web/native chasm in the process.

Related articles on queue.acm.org

Case Study: UX Design and Agile: A natural Fit?

http://queue.acm.org/detail.cfm?id=1891739

Enterprise-Grade Wireless

Bruce Zenel and Andrew Toy

http://queue.acm.org/detail.cfm?id=1066065

Energy Management on handheld Devices

Marc A Viredaz, Lawrence S. Brakmo, William R. Hamburgen

http://queue.acm.org/detail.cfm?id=957768

References

1. ecker, C. ars iPad application redux: where we’re going, 2010; http://arstechnica.com/apple/news/2010/11/ars- application-redux-where-were-going.ars.

2. Fioravanti, r. Implementing a fixed-position ioS Web application, 2010; http://code.google.com/mobile/ articles/ webapp_fixed_ui.html.

3. Google Mail Blog. Gmail in Mobile Safari; now even more like a native app, 2010; http://googlemobile. blogspot.com/2010/10/gmail-in-mobile-safari-now- even-more.html.

4. lee, W-M. Build Web apps for iPhone using Dashcode, 2009; http://mobiforge.com/developing/story/build-web-apps-iphone-using-dashcode.

5. MSDn, IeBlog. HTMl5, and real-world site performance: Seventh Ie9 platform preview available for developers, 2010; http://blogs.msdn.com/b/ie/ archive/2010/11/17/html5-and-real-world-site- performance-seventh-ie9-platform-preview-available- for-developers.aspx.

6. nuttall, C. app stores are not the future, says Google. FT Tech Hub, 2009; http://blogs.ft.com/ fttechhub/2009/07/app-stores-are-not-the-future- says-google.

 

Andre Charland is the co-founder and Ceo at nitobi Inc. He’s been at the forefront of Web 2.0 software development for almost a decade and is an expert on the next-generation Web. He is an advocate for usability and user experience and speaks regularly about how to keep users engaged and active on Web sites or Web-based application. He is the co-author of Enterprise Ajax (Prentice Hall) and lead blogger for o’reilly’s InsiderIa.com.

Brian LeRoux is the lead architect at nitobi Software with the prestigious title SPaCelorD. He also has the dubious distinction of being the creator of wtfjs.com and crockfordfacts.com. He is also responsible for leading the direction on the PhoneGap free software project that has the ambitious goal to provide a Web platform complete with Device aPIs for nearly all smartphone operating systems.