One Year Later: Is HTML5 Ready for Prime Time vs. Native? No.

A year ago I published a series of posts about HTML5 mobile web frameworks: Sencha Touch, jQuery Mobile, jQTouch, and Titanium Mobile. Setting aside differences among frameworks, I tackled the question of native vs. web and gave a nuanced answer, even a hesitant yes. A year later I’ve abandoned HTML5 and begun rebuilding my app in Objective-C. And while the long answer is still nuanced, the short answer is easy: if you want to build a great mobile app, go native.

One caveat: I haven’t written native Android code, so this is based primarily on iPhone development. But I believe much of I have to say here will apply there as well.

Performance

Web technologies simply don’t perform as well as native. Animations stutter. Pages jump or blank out when they reload. And that’s on iPhone, which is the best case. Die-hard web developers will point out that these problems are solvable, and they may be. But solving them requires effort and potentially compromises (e.g., a Load More button instead of a continuously scrolling list). Which would you rather spend your time on: building great functionality or fighting a non-native platform so it feels native?

There’s no question that the speed of mobile browsers will continue to improve, and frameworks will evolve to take better and better advantage of them. At some point performance may cease to be such an issue. I wouldn’t expect that to happen in 2012.

Documentation

Efficient development requires great documentation. Apple’s is comprehensive. Several great books will get you up to speed. (I used iOS Programming: The Big Nerd Ranch Guide.) And Stack Overflow and other community sites have answers to nearly any question.

I can’t say the same for HTML5 frameworks. Sencha Touch has extensive documentation but I encountered holes, areas lacking detail or even high-level explanation. The community was similarly hit or miss. And my attempt to pay for support was, strangely, ignored. This is worse for a large framework like Sencha’s than for something smaller like jQuery Mobile (whose documentation was also underwhelming) because you’re spending less time interacting with the browser and more working with the framework’s own middle layers.

Sencha Touch is open source. Given enough time, I might have solved my problems by digging into the code. But again, the goal in choosing HTML5 is to avoid learning new platforms. If I’m going to accept a learning curve why not learn a well-documented, widely-used platform instead of a specialized middle layer?

Tools

Apple’s Xcode is good. There’s a drag-and-drop tool for assembling user interfaces, a debugger for inspecting and stepping through your code, smart code completion, optimization tools, and integrated documentation. I understand you get similar functionality developing for Android in Eclipse.

There are integrated development environments (IDEs) designed for web developers: Aptana, NetBeans, Coda, and others. In my experience they’re not as polished as Xcode and lack tight integration with frameworks. Debugging in a desktop browser has improved tremendously in recent years but you’re debugging the JavaScript, not the HTML5 framework. Your bugs may trigger errors deep in the framework code, which you then have to decipher.

And web debugging in the iPhone Simulator or on the device itself is another story. You can print messages to the console but you can’t set breakpoints or step through your code. And just because your app works in desktop Safari doesn’t mean it’ll work on device. So there’s a lot of poking around in the dark that simply doesn’t happen with native development.

Conclusion: Yeah, It’s Still Nuanced

I’ve been hard on HTML5 frameworks here. We need them. They’ve taken on the important, challenging task of making it easy for web developers to create interactive mobile experiences. They’re developing for moving targets that differ in their capabilities and limitations. They’re constantly at a disadvantage because there’s an additional layer between them and the OS. The work they’re doing is incredible. As the frameworks mature they’re turning their attention to documentation. In the meantime, Microsoft and Adobe seem to be shifting focus away from their proprietary frameworks onto HTML5, so better developer tools may be around the corner.

If you’re building a mobile web experience, an HTML5 framework may be just the ticket. If you’re building an app whose requirements are modest or it needn’t feel native, ditto. Sencha Touch is heavy but gets the job done. Once jQuery Mobile irons out a few more bugs it’ll probably be my favorite because it’s “webbier” and lighter-weight than Sencha.

But if your goal is to produce a polished, native-feeling app then I recommend going native (or native with embedded HTML content as appropriate). That’s partly the designer’s desire to create something pixel-perfect. But it’s also about efficiency: better to tackle the one-time learning curve than to wage an ongoing battle against limited documentation, performance issues, and underwhelming tools.

15 comments
carlsdesigns
carlsdesigns

hey.  I'm glad you made this follow up post.  You're previous post about HTML5 vs Native helped me makes some important decisions on a project I'm currently working on.  I'm in the middle of a android / iphone app project that I couldn't take on unless I went with HTML5 approach.  I wanted to point you to a cool jquery replacement library that has been serving me really well.  Its called Zepto zeptojs.com  

Its super lightweight and has the same syntax as jquery.  What makes it amazing is that you create your animations like you would in jquery but zepto translates the javascript into webkit's CSS3. Its only webkit because its geared for android / iphone webkit browsers.  There are a few other frameworks that are using the same concept.  Naturally anyone would agree that CSS3 animations are clean, fast, and where its at.  I'd love to here you're opinion on this.  Thanks!  I'm a fan of your musings on this topic.

 

Martin Aldrich
Martin Aldrich

I do not see DHTMLX mentioned in this post and my experience with this framework has been extremely positive - from a proof-of-concept and escalating into pre-production test trials for a EAM (Enterprise Asset Management) Inspection processing application in a couple of months. The development framework is stable, the application works offline with a locally defined SQLite database in the google chrome or apple safari browser.

Martin Aldrich
Martin Aldrich

I do not see DHTMLX mentioned in this post and my experience with this framework has been extremely positive - from a proof-of-concept and escalating into pre-production test trials for a EAM (Enterprise Asset Management) Inspection processing application in a couple of months. The development framework is stable, the application works offline with a locally defined SQLite database in the google chrome or apple safari browser.

stationstops
stationstops

I actually recommend developing in HTML5 now. It keeps the overhead of iOS off the table so you can focus on the actual value of the application. If when you're done you want to do it in native, you really haven't wasted much time and you can deploy, beta, A/B test your product on multiple platforms easily while you work on your iOS version - which will be better for you having done the exercise. You look at Zite, which is HTML5, how fast they went from zero to $10M CNN buyout by focusing on value, aggregation algorithms, and simple interface - vs Flipboard, which is basically a poor RSS reader wrapped in cool Ken Burns effects. Another example is Path - very sexy, but they were too busy making it sexy to think about why anyone would use it for more than a month before realizing its basically a Facebook also-ran that substitutes photo filters for friends.

stationstops
stationstops

I actually recommend developing in HTML5 now. It keeps the overhead of iOS off the table so you can focus on the actual value of the application. If when you're done you want to do it in native, you really haven't wasted much time and you can deploy, beta, A/B test your product on multiple platforms easily while you work on your iOS version - which will be better for you having done the exercise. You look at Zite, which is HTML5, how fast they went from zero to $10M CNN buyout by focusing on value, aggregation algorithms, and simple interface - vs Flipboard, which is basically a poor RSS reader wrapped in cool Ken Burns effects. Another example is Path - very sexy, but they were too busy making it sexy to think about why anyone would use it for more than a month before realizing its basically a Facebook also-ran that substitutes photo filters for friends.

andybriggs
andybriggs

I'm planning a slightly more complex app than Pints, and was leaning strongly towards PhoneGap with one of these frameworks. Thankfully I decided to research them a bit more thoroughly before committing, as it sounds like I would have ended up having to abandon my efforts and switch to native to get the necessary performance. Thanks for taking the time to share your experiences, and best of luck for your new venture! Andy

andybriggs
andybriggs

I'm planning a slightly more complex app than Pints, and was leaning strongly towards PhoneGap with one of these frameworks. Thankfully I decided to research them a bit more thoroughly before committing, as it sounds like I would have ended up having to abandon my efforts and switch to native to get the necessary performance. Thanks for taking the time to share your experiences, and best of luck for your new venture! Andy

andybriggs
andybriggs

I'm planning a slightly more complex app than Pints, and was leaning strongly towards PhoneGap with one of these frameworks. Thankfully I decided to research them a bit more thoroughly before committing, as it sounds like I would have ended up having to abandon ! Thanks for taking the time to share your experiences, and best of luck for your new venture! Andy

andybriggs
andybriggs

I'm planning a slightly more complex app than Pints, and was leaning strongly towards PhoneGap with one of these frameworks. Thankfully I decided to research them a bit more thoroughly before committing, as it sounds like I would have ended up having to abandon ! Thanks for taking the time to share your experiences, and best of luck for your new venture! Andy

Ben Wilson
Ben Wilson

You make some excellent points, but I disagree with the "one time" learning curve conclusion. It comes down to slick/specialized ui vs multiplatform for most projects, with a few exceptions like hardware use. Learning multiple, completely different, nonstandard SDKs vs HTML5 standards with [single nonstandard framework] makes it a [popular mobile OS count] learning curve. If you're only targeting a single OS and don't mind being subject to that company's whims (only slightly OT), then it makes sense, but targeting multiple OSs creates a whole slew of additional "curves". Native will "look and feel" better for many years IMO. If that's the primary concern, then there's not anything you can do.

Ben Wilson
Ben Wilson

You make some excellent points, but I disagree with the "one time" learning curve conclusion. It comes down to slick/specialized ui vs multiplatform for most projects, with a few exceptions like hardware use. Learning multiple, completely different, nonstandard SDKs vs HTML5 standards with [single nonstandard framework] makes it a [popular mobile OS count] learning curve. If you're only targeting a single OS and don't mind being subject to that company's whims (only slightly OT), then it makes sense, but targeting multiple OSs creates a whole slew of additional "curves". Native will "look and feel" better for many years IMO. If that's the primary concern, then there's not anything you can do.

dfeldman
dfeldman

@Adrian_D_Jones Thanks for the comments and link. I agree it's not black and white, and yet...Pints is not a complicated app at all. It's basically just a set of hierarchical list views. And even so, I found myself struggling to debug it and to create a polished, native-like experience in HTML5. And the debug/tool issue is an important (and non-obvious) one given that part of my reason for trying HTML5 in the first place was speed to market. SproutCore does look pretty cool. I worry about betting on it a bit, though, given that the team that created it was acquired by Facebook.

Adrian_D_Jones
Adrian_D_Jones

Great post. At the end of your article you admit that it's still nuanced, but your stance is still pretty weighted towards native. I'm not sure it's that black and white, and HTML5 is getting more compelling every day. I think it depends more on what you want your app to do. If you are building a fancy graphics intensive game, then yes, you should go native. But a simpler app? Maybe web technologies will do you fine, and you can still wrap it in PhoneGap if you want to get it in an app store. Here's an article that breaks down the pros and cons for native, web and hybrid apps: http://appnovation.com/natives-are-restless. There's also mention of an HTML5 framework called SproutCore which is an alternative to Sencha and JQuery Mobile.

Adrian_D_Jones
Adrian_D_Jones

Great post. At the end of your article you admit that it's still nuanced, but your stance is still pretty weighted towards native. I'm not sure it's that black and white, and HTML5 is getting more compelling every day. I think it depends more on what you want your app to do. If you are building a fancy graphics intensive game, then yes, you should go native. But a simpler app? Maybe web technologies will do you fine, and you can still wrap it in PhoneGap if you want to get it in an app store. Here's an article that breaks down the pros and cons for native, web and hybrid apps: http://appnovation.com/natives-are-restless. There's also mention of an HTML5 framework called SproutCore which is an alternative to Sencha and JQuery Mobile.