This blog post is contributed by Leopoldo Miranda Martinez, a mobile technology evangelist and an experienced Software Developer with IBM Mexico.
How many times have you asked what is the best mobile user interface (UI) framework for your mobile hybrid and web apps? There is no easy answer or equation that can tell you exactly how to do that. However, there are some key features that you should consider to evaluate a mobile UI framework. In this blog post, I’m going to list some of these features and give you a brief summary of each. The order in which I list them has no relevance; the importance and priority of the features are only determined by your business needs or driven by your app requirements.
Free versus licensed
Some UI frameworks are free, and you can use them at your own risk, having as support a public community. With regard to communities, it is very important to evaluate how reliable and responsive the community is. The bigger and more active the community is, the more likely that you can get an answer for any given problem. If you decide to use a licensed UI framework, make sure you fully understand the service agreement that you're paying for and, most important, make sure that it can adapt to your business needs in terms of response time.
Documentation
Even for experienced mobile UI developers, looking into the documentation is time consuming, specifically if your mobile UI framework does not have content assist support or WYSIWYG (What you see is what you get) functionality in your integrated development environment (IDE). For example, IBM Worklight supports Dojo Mobile and JQuery Mobile, making it easy for the developer to generate code. On the other hand, developers should look at online documentation or even look into the JS library files. Make sure your framework provides easy and sampled documentation that is properly classified by the application programming interface (API) version.
Backward compatibility
Mobile UI framework updates might be a nightmare, especially when you require an upgrade to get new functionality or fixes. For new releases, it is no surprise (most of the time) when something suddenly stops working or some functionality does not work like it did before. Make sure you research the new release in terms of its support of specific mobile browsers, platforms and even devices.
Stability
In production environments, it is not common or recommended to adopt the latest version of your mobile UI frameworks. If possible, keep your version n – 1, where n is the latest version available. If you want to try in advance, consider exploring and testing the beta version and run a smoke test or test regression of your app. I highly recommend that you enable your debug or browser console so that you can see the errors.
Mobile browsers, platforms and devices supported
Looking for supported browsers, operating systems and so on is always a necessary review step. Take a look into this section of the documentation and ensure that you're well supported with regard to your target platform and browser versions.
Extensibility
For those requirements that do not necessarily fit into any given framework functionalities, making them extensible is a good option thru a third party or even for your own legacy needs to satisfy your app requirements. Make sure your mobile UI framework offers a good structure and documented capability to do so.
Performance
Generally speaking, mobile UI frameworks used to have a tremendous performance gap in comparison to native based apps. However, mobile UI frameworks have increased their performance considerably even though there is no formula to let you know what’s better than another. It will depend what functionality performs better. Sometimes prototyping is the only way to get such an answer for a very specific mobile UI framework capability in your app.
Library options
Mobile UI frameworks used to have two versions: source and compressed versions. Source versions are used widely during development, which is “human readable” JavaScript (JS). Compressed versions are typically used in production environments, and that's the smaller size of the JS libraries, which requires less time and resources to be processed by browsers. There is one more option, in which users might want to build a custom package for a very specific layer of the library, for example mobile charts.
Please watch for part 2 of “Selecting a mobile UI framework,” in which I'll continue with the remaining features: caching, globalization, accessibility, navigation, back-end integration (model view controller, MVC), charting, themes support and auto-detection, IDE tooling support, and testing and debugging.
Share your comments below and please follow me on Twitter @polomm_mx.
Leopoldo Miranda Martinez is a mobile technology evangelist and an experienced Software Developer with IBM Mexico. He specializes in different technologies, including mainframes, systems management, Java EE, Rich Internet Applications and mobile hybrid apps. Polo has comprehensive experience of customer support and is currently an IBM Technical Advisor. Follow Leopoldo on Twitter at @polomm_mx.
