Altabel Group's Blog

Posts Tagged ‘jQuery Mobile

Not so long ago you could only develop on Objective-C (for iOS) or Java (for Android). Still recently a lot of new mobile app development frameworks have appeared and found their own niche on the market. I think, you have heard about such frameworks as PhoneGap, Sencha, jQTouch, jQuery Mobile, Kendo UI, Corona, Titanium Appcelerator, RubyMotion and many others that allow to create apps using Javascript, Java, Lua and Ruby.

So how do you define what framework to use? Below you could find a few tips that could help you to make a choice.

1) If you know programming
Of course most of the frameworks expect you to know programming. Still even if you don’t know programming there are a number of app builders that allow you to create complex apps in the “drag and drop” environment. In case you are dreaming about developing a game, so GameSalad will help you: it has an intuitive Drag and Drop UI which gives you the possibility to build apps without coding. If your intention is to develop a business app, so BiznessApps will let you build the app for many scenarios.

2) Create apps in a language you know
I suppose you all know that the “native” languages for iOS and Android are Objective-C and Java respectively. Even if you don’t know these languages, please don’t give up as you can create apps in a language that you know. In case you know Javascript, you can use Sencha Touch to build a HTML5 app and then compile it for iOS or Android native app using Phonegap J In case you know Lua, you can easily build a cross platform native game using Corona. In case you know Ruby, RubyMotion will help you to build an iOS app. In case you are master of Java but would like to make smth for iPhone, you can use trick with GWT-touch to create HTML5 app and then compile it using PhoneGap J.

3) How native or cross-platform do you want it?
Do you know that there is a kind of tradeoff that some of the frameworks make? For example, a HTML5 app build with the help of Sencha, jQtouch and GWT-touch could have almost native look and feel, but not 100% native of course. But if you use Titanium and Corona with native UI components, the apps will have 100% native look. The advantage of HTML5 apps is that they could be further compiled for more platforms. Plus they can also be deployed on the web without making any code changes.

4) If you are a web developer and want to continue using your old tools
Firstly, hello to web developers who are reading this article 🙂
Another advantage of these HTML5 apps is that a web developer already knows most of the technologies and has most of the tools available. For instance, if a web developer has to create an app using jQuery Mobile or Phonegap, he can use IDE which he has always been using, for debugging you are welcome to use Chrome Inspector or Firebug. If you still insist on using your trusty tools, go on with Sencha or jQuery Mobile.

5) If you select a frame by taking into consideration their “pros” or “cons”
In case you choose a framework based on “+” and “–“, so hope the following short list will be of use to you.

· jQuery Mobile

+ Great tools like Theme Roller and Codiqa UI builder;
+ View only framework (you can use whatever to handle the MC parts)
+ Based on jQuery;
+ Lots of plugins;
+ Most popular.

– Could be too heavy for some smartphones;
– No official paid support.

· Sencha Touch

+ Based on ExtJS;
+ Complete MVC framework;
+ Official paid support;
+ Sencha Architect is great.

– Some controls look off;
– No native controls;
– Performance;
– Few customization options;
– Client side DOM generation.

· Titanium

+ Rapid prototyping;
+ Web-oriented;
+ Well-known JavaScript for many developers;
+ It’s sross-platforming;
+ Native UI.

– Increasing complexity (and costs);
– No freemium;
– Flexibility limitations;
– Native UI*.
*The native UI is both an advantage and disadvantage. If your UI is simple enough, you may be able to use a single code base. But more than likely, you will need to tweak the UI for each platform to take full advantage of each platform.

· PhoneGap

+ Single code base for all platforms;
+ Rapid testing and deployment;
+ Multiply Platforms;
+ Access basic native functionality;
+ Offline usage.

– Poor performance;
– Lack pre-built UI widgets, transitions, standard controls;
– Access advanced native functionality;
– Complex Business Logic etc.

Make your right choice my dear readers 🙂

Hope this article was interesting and helpful to you. Should any questions or comments arise, you are welcome with them.

Elvira Golyak

Elvira Golyak
Elvira.Golyak@altabel.com
Skype ID: elviragolyak
Business Development Manager (LI page)
Altabel Group – Professional Software Development

Nowadays, more and more people use their mobile devices for the majority of their computer needs. That’s why mobile web application frameworks are in high demand for developers. There are several great mobile web frameworks that allow you to create an application with a native “look and feel” interface. Among them are jQuery Mobile, Sencha Touch, iWebKit, DHTMLX Touch, etc. If you have decided to develop a web application for mobile devices and you want to use a client-side framework to achieve this, Sencha Touch (ST) and JQueryMobile (JQM) seem to be the most serious options. What are their strong and weak points? Let’s see.

Sencha Touch

ST is a mobile web app development framework, which is compatible with HTML5, CSS3, and JavaScript. It is really a sensational framework widely used by mobile web developers. With it building web apps for mobile platforms which feel more like native apps is not a problem for a developer.

ST comes with a MVC framework which leads to a well structured code base. It is really a big plus, especially for large projects. Using ST you will likely not have to write a lot of HTML as the DOM (Document Object Model )is generated out of the objects models / widgets that you use. Besides, a wide range of UI widgets to choose from, as well as robust data, layout and component models are at your disposal.

Speaking of device support, ST website actually supports iPhone, Android and BlackBerry. It works really good on iOS. As for Android, it can be slow on large lists. Some problems may occur with Blackberry, so it may be better to choose another framework for this device.

ST also has enhanced support for touch events such as double tap, swipe, hold, pinch and rotate.

Developing on your desktop you should keep in mind that ST does not support all browser engines. You are required to use a browser based on Webkit (like Google Chrome or Safari). You are not able to view Sencha Touch apps in Firefox, Internet Explorer, or any other browser not using the Webkit engine.

ST provides great API documentation and sample demos. But the ST API uses a fairly large (120kb) JavaScript library that is much larger than the jQuery Mobile library.

ST is not easy to get running on the fly. It is almost a purely programmatic model, as you don’t design pages in HTML, but programmatically add elements to a page. So sometimes it’s difficult to make web design separately in HTML.

As for converting sites to work with the framework, it may involve a full front-end rewrite and it is very hard to debug and fix errors in ST.

Pros: MVC codebase; good support of iOS; enhanced support for touch events; great API documentation and sample demos

Cons: is not easy to get running on the fly; a large JavaScript library; problems with converting sites to work with the framework; very hard to debug and fix errors; may be slow on Android; not working properly on Blackberry

jQuery Mobile

JQM is Touch-Optimized Web Framework for Smartphones & Tablets. It is a unified user interface system across all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation.

JQM is really quick to develop with. You can just start with clean HTML markup and then apply “progressive enhancement techniques” or extra HTML element attributes to integrate mobile features into an existing semantic structure.

As for MVC, JQM doesn’t have it. So lot of care has to be taken while organizing the code.

The framework claims to offer a broad level of support across a wide range of platforms, and progressive enhancement for older devices and operating systems. Instead of writing unique apps for each mobile device or OS, the jQuery mobile framework will allow you to design a single highly branded and customized web application that will work on all popular smartphone and tablet platforms.

JQM includes a great AJAX-powered navigation system which enables animated page transitions while maintaining back button, bookmarking and clean URLs.

The framework comes with a CSS theme styling system that enables a simple project to get off the ground very quickly. Then this can be easily extended with your own custom styles. But the CSS theme styling system has limited options so sites built can look similar.

The bad thing is that page transitions and animations don’t feel ‘native’ enough and can be sluggish sometimes.

Pros: JQM is quick to develop with; supports all major browsers and platforms; has a great AJAX-powered navigation system; CSS theme styling system enables a simple project start very quickly

Cons: no given code structure (MVC); CSS theme styling system has limited options (sites may look similar); page transitions and animations don’t feel ‘native’ enough

So after comparing these two frameworks on some points, we see that ST has a given code structure and feels more like coding in Java/C# while jQuery Mobile is more like web with the HTML you write. So it’s better to use ST if you are used to Java/C# and only want to support such devices as iPhone and Android. And if you are a webdeveloper, used to jQuery and HTML and want to support the majority of devices and browsers, using jQuery Mobile seems to be more sound.

And what are your thoughts? I’m eager to know which mobile web application framework will you define as the best solution for developing a web app for a mobile device? Will it be Sencha Touch or jQuery mobile or some other great framework? Thanks and looking forward to your comments!

Yuliya Tolkach

Yuliya Tolkach
Yulia.Tolkach@altabel.com
Skype ID: yuliya_tolkach
Business Development Manager (LI page)
Altabel Group – Professional Software Development


%d bloggers like this: