Apache Cordova (or PhoneGap) still presents difficult choices at start. Which web framework to use? How much time to spend learning it? Will it cause performance issues? What if there was a right way of creating Cordova apps, one that would allow you to pick a safe architecture, implement it quickly and maintain with minimal effort? I’ll suggest you one in this post.

Stay lean

You’ve chosen Cordova, a platform valued for its speed of development. And you’re about to pick a framework that will go well with that workflow. Do you see where it goes? If you want to retain the development speed, you should pick a framework that is already familiar to you, or one that’s easy to learn. Don’t enter too many new areas at once, especially if these are your first weeks with Cordova or if you’re working on the first version of your app. Some options you might consider:

No framework, a.k.a. vanilla-js

Not using anything is a viable alternative if you don’t need complex UI and your business logic is simple.

Bootstrap (website)

Starting from version 3.0 this is a mobile-first framework and works well on smaller screens too. Focused on delivering quick prototypes, very popular and highly valued.

Ratchet (website)

Made by the same people who created Bootstrap, follows similar principles, but is aimed at mobile devices. Includes ‘iOS’, ‘Android’ and ‘neutral’ themes.

Framework7 (website)

A fresh tool that attempts to recreate native iOS 7 user experience, including platform-specific gestures: swipe back, swipe to delete, pull to refresh and similar.

Ionic (website)

A library that’s optimised for usage with Angular.js. If you’re a fan of the latter, Ionic might be a good pick for you.

This list is just a starter, feel free to choose something from or outside of it. In any case though, make sure not to get distracted and only pick tools that provide immediate value. Move in small iterations, deliver a prototype and improve it later, when you have a working version and know the business domain better.

Make it relevant to your domain

Since you want to stay efficient, take your app’s area into consideration. If you’re making a game, browse through a list of existing HTML5 game engines; many of them already target mobile devices. Take a look at the Cordova Plugin Registry too. Since you’re no longer coding for the web, you can reuse existing native implementation for some features. E.g. geolocation, social media, audio, dialogs. And remember, whatever tool you pick, check the costs (efforts) involved.

Constraints

There are other factors apart from development time that you should consider when picking a framework for a new app. Obviously your UI should be mobile-friendly. Users don’t like applications that resemble a scaled-down website and e.g. Apple is known to reject such apps. Remember to ensure that your page elements are tappable.

Performance is crucial too. To avoid problems, run your app on physical devices and make sure that its speed is comparable to a native app. Moreover, remember to focus on Single Page Application architecture. In Cordova visiting new pages of your app involves waiting for deviceready event multiple times, which would just make things slower.

Deliver fast and iterate

Summarizing, the recipe for a successful Cordova app is to pick the smallest useful set of tools, deliver a working prototype and iterate. It is almost a truism, but one that’s easy to forget. Don’t distract yourself with too many new technologies at once. Stay in touch with your domain and physical devices. Create an application that works. And iterate, iterate, iterate!