Custom App Development, Mobile,

3 Essential Lessons For Developing Great PhoneGap Apps

3 m read
QArea Expert
QArea Expert Marketing Manager
February 17, 2015
Share on
Reading Time: 3 minutes

What’s the Challenge?

We all know very well why we’re into PhoneGap app development: PhoneGap is just the best option we see to help us take an app and transfer it to a number of native App Stores avoiding the necessity to learn some new languages. While PhoneGap APIs are certainly simpler and easier to navigate than HTML5 functions, and app development with PhoneGap becomes a much easier task, with this great power also comes great responsibility.

Thus, simple apps built with PhoneGap that require no data connection and just serve static information work just OK. However, once you’ve decided to add some complex CSS3 elements, multiple devices support or heavy transitions, you start realizing there must be some steps you need to iron out first.

Generally speaking, there are 3 lessons you need to learn.

Lesson 1: Understand Native Patterns

The most powerful thing that immediately jumps out at developers from PhoneGap website is that this framework publishes one codebase into up to seven various app stores. OK, it really does it, but that doesn’t mean your app looks great on each platform. Thus, it’s essential to understand the key development and design principles of those devices you want your app to support.

First, your app should act and feel like native. A good trick to do it is to avoid making users “wait” for some app actions and exclude the “loading symbol” at all. As for the design side, you need to follow some important layout patterns across different platforms, too. Thus, the iOS and Android interfaces of one app look similar in content, but their navigation bars are different.

Conforming to the principles of different systems requires creating more code bases, but the inner content will be the same, so you’ll have to change only your header and footer.

Lesson 2: Live by DOM

Document Object Model (DOM) certainly isn’t your best friend while building PhoneGap apps. A downside of making rich and feature-heavy effects and transitions is the frequency of the DOM changes you must make. Thus, while a desktop browser has extensive resources it works with and its engine rendering Javascript is better, it’s not the case with mobile browsers which generally lack such resources. Of course, this problem among some other may cause some issues in displaying content and general app performance as well as affect the user experience as a whole.

Luckily, there are some solutions you can use to increase performance in such cases: hardware acceleration for browser, excluding box shadows and gradients, using pre-compiled templates, and minimizing the DOM structure.

Lesson 3: Test and Debug

Debugging and testing are among the most difficult tasks in the process of your PhoneGap app building. As your web app is intended for mobile, you are able to push fixes to the users quickly, but you are also subject to the process of approval for updates while submitting the app to different stores, too, and this can take certain time. Thus, it’s simply imperative that your app is extensively tested before launch.

On the web, you should be using tools like Firebug and Web Inspector that let you inspect DOM elements and see XHR requests. Testing on the mobile phone is more challenging, but Weinre, a great PhoneGap’s tool, will help you remotely debug the nagging issues.

Where Are We Heading?

You may see PhoneGap app development as a daunting business after the challenges we’ve discussed here. But all the lecturing was aimed only at sparing you most difficulties. In reality, after following these tips you’ll get an app many people aren’t even going to notice it’s PhoneGap-based and won’t be able to differentiate it from a native app – and this is actually your goal. Similarly, don’t get too overwhelmed with building a perfect Android or iOS app – focus on creating a great app as such instead.


Contact us for further guidance and support!

Categories

Recent Posts

  • Best Frontend Programming Languages to Create Beautiful and Fast Interfaces

    Read more
  • Capability Maturity Model Integration – QArea's big journey

    Read more
  • QArea is a Unique Services Provider in 2019 CEE Awards

    Read more
  • Ultimate Development Trends in 2018 to Reward Your Business in 2019

    Read more
  • Why You Should Write Your Next Microservice Using Golang

    Read more
  • The Most In-Demand Backend Programming Languages of 2019

    Read more
Yes
Share on
Privacy Preference Center
Your Privacy

When you visit any web site, it may store or retrieve information on your browser, mostly in the form of cookies. This information might be about you, your preferences or your device and is mostly used to make the site work as you expect it to. The information does not usually directly identify you, but it can give you a more personalized web experience. Because we respect your right to privacy, you can choose not to allow some types of cookies. Click on the different category headings to find out more and change our default settings. However, blocking some types of cookies may impact your experience of the site and the services we are able to offer.

Strictly Necessary Cookies Always Active

These cookies are necessary for the website to function and cannot be switched off in our systems. They are usually only set in response to actions made by you which amount to a request for services, such as setting your privacy preferences, logging in or filling in forms.

You can set your browser to block or alert you about these cookies, but some parts of the site will not then work. These cookies do not store any personally identifiable information.

Performance Cookies

These cookies allow us to count visits and traffic sources so we can measure and improve the performance of our site. They help us to know which pages are the most and least popular and see how visitors move around the site.

All information these cookies collect is aggregated and therefore anonymous. If you do not allow these cookies we will not know when you have visited our site, and will not be able to monitor its performance.

Cookies used

Google Analytics
Functional Cookies

When you visit any web site, it may store or retrieve information on your browser, mostly in the form of cookies. This information might be about you, your preferences or your device and is mostly used to make the site work as you expect it to. The information does not usually directly identify you, but it can give you a more personalized web experience. Because we respect your right to privacy, you can choose not to allow some types of cookies. Click on the different category headings to find out more and change our default settings. However, blocking some types of cookies may impact your experience of the site and the services we are able to offer.

Cookies used

Test Second Test
Targeting Cookies

When you visit any web site, it may store or retrieve information on your browser, mostly in the form of cookies. This information might be about you, your preferences or your device and is mostly used to make the site work as you expect it to. The information does not usually directly identify you, but it can give you a more personalized web experience. Because we respect your right to privacy, you can choose not to allow some types of cookies. Click on the different category headings to find out more and change our default settings. However, blocking some types of cookies may impact your experience of the site and the services we are able to offer.

More Information

When you visit any web site, it may store or retrieve information on your browser, mostly in the form of cookies. This information might be about you, your preferences or your device and is mostly used to make the site work as you expect it to. The information does not usually directly identify you, but it can give you a more personalized web experience. Because we respect your right to privacy, you can choose not to allow some types of cookies. Click on the different category headings to find out more and change our default settings. However, blocking some types of cookies may impact your experience of the site and the services we are able to offer.