Sticking with our recent theme in talking about mobile here on brosteins.com I’d like to compare several mobile UI frameworks. If you find that building a Hybrid App (outlined by Justin Tindle in our previous post about Building Mobile Apps Native vs Hybrid) is the right direction, you will likely use one of many Javascript frameworks. With Javascript frameworks being created and changed every 5 minutes, it can be hard to find the right framework for your hybrid mobile app, but read on and we will compare 3 popular frameworks: jQuery Mobile, Angular, and Kendo Mobile.
Let’s Get Started
Before we dig into our mobile UI framework comparison let’s define some common terms that you may hear when discussing mobile applications.
SPA
SPA stands for Single-Page Application. A SPA is a design pattern used in a web application where the entire application and user interaction lives on a single HTML page.
MVVM/MVC/MV*
These stand for “Model View ViewModel,” “Model View Controller,” and Model View everything. I know some developers are cringing at this moment because I have lumped these altogether but that isn’t what this post is about! In a nutshell, these are all architectural/design patterns that assist a developer in the development of the application and UI.
Framework Comparison
| Framework | SPA | MV* | Data Binding | Styling | Other |
| jQuery Mobile | Yes | No | No | Yes | Widgets, Plugins |
| AngularJS | Yes | MVC | 2-Way | No | HTML God Mode! |
| Kendo Mobile | Yes | MVVM | 2-Way | Yes | KendoUI |
jQuery Mobile
As you can see in our mobile UI framework comparison all three frameworks are very similar. At first glance it may appear that jQuery Mobile is the “worst” of the three; however, I do not think we can categorize it that was built for a different purpose than the other two. jQuery Mobile provides a solid SPA framework an styling support. It also provides an extensive library of built in widgets such as a dialog control, navigation bar, and listview control. In the areas where jQuery mobile falls short, other 3rd party libraries can be integrated and used to build upon to achieve all the features of the other two frameworks.
AngularJS
I may be doing AngularJS a bit of a disservice here by distilling it down into some basics, however, it does provide all the basics I have listed above and then some. AngularJS, unlike the other frameworks here was not specifically built for mobile, however it is a very popular framework that can and is used in the mobile space. AngularJS aims to extend the basic functionality of HTML via custom attributes and elements to help ease the creation of a dynamic and rich web application for developers. AngularJS provides a lot more feature such as dependency injection, validation, and more. If you are interested in more details check it out!
Kendo Mobile
Kendo Mobile is the only mobile UI framework on our list that is not free, however, as you can see above Kendo Mobile has positioned itself to fill all your needs when creating a mobile web application. Kendo Mobile benefits from being integrated into Telerik Platform and having access to Kendo UI Mobile components for use in the mobile app. While not free creating an app with Kendo Mobile and the Telerik Platform offers the full path from mobile app idea to app store.
Final Thoughts
As you can see there really is no winner in our mobile UI framework comparison (and rightfully so). Each framework we have looked at was built with a different purpose in mind and does a good job providing the developer with the correct tools for that purpose. Developers like choices (well at least I do) and I encourage you to try all of the frameworks listed here to see which one fits your mobile app’s needs the best!
