Industry news

Mobile Application vs. Mobile web and Where Mobile is Headed

By December 6, 2010 9 Comments

If you don’t live in a cave you’ve probably noticed that there is presently a really a big mobile boom. So it should also be no surprise that a lot of frameworks are popping up to fill this field and make mobile coding less painful.

When you think that there are hundreds of types of devices all running different operating systems, you’re in for a big headache to make your website compatible with most of them – and I’m not even talking about the logistics of acquiring the most popular phones to test with. In fact, even targeting a single device like the iPhone can be a challenge, as people using the iPhone do not always upgrade their phone, and with older operating systems come older browsers.

Between web solutions like jQuery mobile, jQtouch, Sencha Touch and and native solutions like Titanium appcelerator, PhoneGap (ouuuffff) it’s pretty difficult to know where this all leads to. I thought it would be helpful to provide a little run down of all these frameworks to show how they compare and also to look deeper into the mobile web.

The mobile web and its Frameworks

People are really getting exited about the mobile web, primarily because of the mobile WebKit browser. WebKit is the first truly modern mobile browser. Before it, browsing on a mobile device was a pain, and not a lot of people were even going to the trouble of doing it. WebKit introduced a desktop browser to the mobile world, and added goodies like CSS 3D animation on top of that. Finally you could, in fact, build a web application that would look like a real, native, application experience like those applications coming from the Apple Appstore.

But here lies the problem: creating mobile web applications for the iPhone 4 is easy, but creating it for all the rest of the devices is so lot harder. Let’s go through a run down of the frameworks that can help you along the way.

Jqtouch

This is one of the first frameworks that popped up back in the days of the iPhone 2g. It currently supports the iPhone and somewhat supports Android. What you get is a basic framework for making lists and text based applications. That being said, I turned my own blog into a mobile website with jQtouch in one night – blazing fast development and easy to understand.

Meet jQTouch from David Kaneda on Vimeo.

Sencha Touch

HTML5Sencha actually bought jQtouch (and hired the guy that was making it) some time ago. jQtouch is still a free release, but if you want all the big guns, you need to go have a look at Sencha Touch. With this framework they really, really tried to emulate the native application environment. From what I’ve tested, they pretty much succeeded, with support for the iPhone, Android and the iPad. However, from my tests, the examples are a bit clunky and buggy on Android.

Also worth mentioning is that the framework is not free for commercial use, but the fees are pretty low at $299 per developer, for unlimited websites/year.

jQuery Mobile

The jQuery team recently added a late entry to the mobile framework game. jQuery mobile aims to support virtually all modern mobile devices, including Nokia, and BlackBerry devices. If you are not familiar with mobile browsers, let’s just say that most browsers beside WebKit (currently used by both the iPhone and Android devices) are a bit like dinosaurs. And getting your mobile website or application working on them is going to be pretty hard.

jQuery Mobile is an odd beast, as developing with it is pretty focused on only HTML and CSS. The framework relies on custom html tags that it will interpret if the browser is supported, if it’s not supported, your users can still browse your text (something they can’t do with Sencha Touch). This is the goal jQuery Touch is trying to achieve; any device can view your site even if it is not perfect.

jQuery Mobile is currently still in beta, so I cannot really be “hard” on it. But for a framework that aims to support a lot of browser is seems to have some big difficulties supporting android devices. Recently I created a mobile application using jQuery Mobile and I saw a lot of weird problems on Android, only using examples from their official documentation. But if they figure it out the issues, it could really become a strong contender as a fast and easy solution for mobile web development.

Zepto.js, the minimal framework

Zepto‘s philosophy is the smaller the better. With Sencha, jQtouch, and jQuery Mobile you have an enormous memory footprint, and unfortunately mobile devices are not really that good at handling big files. Zepto is only a 2k library that handles the most basic drudge work with a nice API. In fact, it’s very similar to jQuery, and you will feel right at home if you are a jQuery developer.

It’s also in beta, but worth a look if you’re still unsure about what framework you will use in the future.

The Native Way

A big problem with mobile web applications, even if you are only targeting the iPhone, is that you can’t use all the nice API’s you normally could if you were developing a native app, for example, the notification system. To be fair, WebKit recently added the acceleromater API, but we’re still a long way from competing with native on that point, in addition to the added bonus of free promotion on the appstore for native apps.

Being a native app also has some big disavantages. Goodbye cross compatibility with iPhone and Android! And don’t forget having to learn Java and Objective-C – being a web developer that is probably not what you want to do with your free time.

Along the way, some entrepreneurs saw the potential of web developers on the native space and created some frameworks that make developing natively a much more compelling experience. That’s how we got Appcelerator Titanium and Phonegap, 2 native frameworks aimed at web developers.

A Bit of Controversy

There was a big surprise in the community when Apple changed their developer agreement terms earlier this year and added this paragraph:

“Applications that link to Documented APIs through an intermediary translation or compatibility layer or tool are prohibited.”

This is in fact what Appcelerator and Phonegap are doing. But it seems like this change was really targeted at Adobe, who was rumoured to be integrating a parser with the Adobe Creative Suite that would allow Flash developers to build iPhone application without using Xcode – something you can’t do with Appcelerator and Phonegap.

To this day, applications built with those two frameworks are still getting released in the Apple Appstore.

Appcelerator Titanium, web to native

Titanium is a cross platform technology that goes beyond the mobile and currently supports iPhone, Android devices, desktop applications, Windows and Mac, with plans to support the BlackBerry in the near future.

The idea behind the Titanium platform is that you write your applications with web technologies like javascript and html, and when you want to test your application, Titanium will compile your code in a native application. Which mean that you can in fact write one application for the iPhone and Android in titanium and the framework will compile it for those platform separately. Pretty cool.

With BlackBerry support coming soon, it will also become much more attractive since BlackBerry has really a big following in the business world and could potentially become a huge market for mobile applications.

PhoneGap, the web in a native environment

PhoneGap has a different philosophy than Titanium. This framework does not compile in native code, but instead it opens a webkit view in a native application. So your html and css is shown exactly how it will look in the real application.

Some people have used jQtouch in Phonegap to create applications delivered in the appstore. And of course, you can have access to most of the iPhone api using a custom javascript api inside the framework. PhoneGap supports a very broad range of devices, including Phone, Android, Blackberry, Symbian Palm and others. It is also open source and has a huge community.

The future

There is no question that mobile will be a huge market in the future, especially as devices and frameworks become more and more advanced. For now, mobile web applications are lagging a bit behind, but within a year, I’m pretty sure we’ll see some significant changes.

If you want more information about the state of the mobile web, I would advise you to follow Admobs mobile reports, it’s really full of very interesting information.

This piece was written by Cedric Dugas, CakeMail’s Interface Developer. You can follow Cedric on twitter @posabsolute.

Please wait...

Author Cedric Dugas

More posts by Cedric Dugas

Join the discussion 9 Comments

  • Great overview of the frameworks. It’s worth pointing out that all of these mobile web frameworks will run quite nicely in PhoneGap:)

    Please wait...
  • Great points in this article, particularly on making your existing HTML sites mobile. I’m actually about to release a very similar one of my own regarding native mobile development vs adobe air mobile development in terms of apps.

    Please wait...
  • Geoff says:

    Great roundup! Although you mentioned JQueryMobile is in Beta – its actually only in Alpha.

    Please wait...
  • cedric says:

    Oups! your right Geoff!

    Please wait...
  • Never heard of zepto.js – thanks for highlighting that.

    Couple of points to clarify though:

    ‘Webkit’ isn’t a browser but rather an open source engine for creating browsers. It is used in Chrome, Safari and the Android browser, but isn’t a browser in itself.

    Titanium doesn’t compile HTML and JavaScript into native applications but instead acts as a JS API that links to pre-compiled native objects. What’s the difference? Well a Titanium app will not have the performance of a fully native app nor does it give you full access to the all native API elements. The cross platform thing is a big draw though.

    Please wait...
  • lazukars says:

    There is still a fundamental problem that needs solved when it comes to mobile web development. That is, should developers make one site for both the desktop and mobile space. Or should they create two different sites. One for the mobile experience and one for desktop users. Both have there downfalls

    I personally lean towards the one site approach. However, media queries alone seem to be a bad solution, and UA sniffing is just outright evil.

    I think we are going to see more tools like, server side modernizr, being developed to fill this gap. It all seems to come down to being able to send the viewport size server side, and THEN rendering the page.

    Please wait...
  • Sencha Touch has a free commercial license now ( this happened in November )

    Please wait...
  • […] Blog » Mobile Application vs. Mobile web and Where Mobile is Headed | CakeMail If you don’t live in a cave you’ve probably noticed that there is presently a really a big mobile boom. So it should also be no surprise that a lot of frameworks are popping up to fill this field and make mobile coding less painful. […]

    Please wait...
  • S Woodside says:

    Cedric, we recently asked ourselves the same question — web or native? … our thoughts at http://monolithinteractive.com/2011/02/04/web-or-native/

    Basically it seems like for a polished native developer, there are now actual advantages to do some or all of certain apps using web tools instead. There’s not much discussion about this going on in the native community yet but it seems like a useful discussion to have.

    Please wait...