Phone Gap is a mobile applicationdevelopment frame work based upon the open source apache cordova project.

Developed by Nitobi software Bought by Adobe.

It allows the users to develop mobile application using HTML,CSS,J.S without losing the naive features

Ex: GeolocationCameraAccelerometers

Cordova CLI

Phone Gap CLI – Supports cloud building. This is the additional feature supported in Phone Gap .

Build Apps with web standard on HTML5, CSS, javascript

Deploy to multiple platforms

Cloud Building

Hybrid application Native application

Cross platform support

YES NO

Distribution YES(Possibility for app store’s rejection even in google play store)

YES

Performance for normal apps

Fast Faster

Hardware intensive apps

Performance is not so good Good performance

Cost Lower budget cost (With good web developer, Web based code can support multiple mobile platforms)

Higher

Common debugging tools which is used in the web development can be used.

For platform specific debugging, corresponding SDK debugging tools can be used (xcode, Eclipse etc)

Performance: Single Page is faster than Multi Page

App Assets Load: In  Single Page, Most of the needed files

are loaded at once or at least after the first page is loaded, whereas multi-page requires loading content each time user navigates to a new page

Page Transition:

In Single Page Application page navigation can be added like native application.

In Multi Page Application there is no animation supported in page navigation.

Offline Support:

Single page should point to the cache manifest. When navigation to new HTML page with manifest attribute, the page itself is assumed to be part of application.

In multipage application all HTML pages should be list out in the manifest file.

Memory Management

More Complex

Modularity

To use the Native features of the mobile, we need to make use of the Plug in

For example to make use of the below features we need to make use of the plug in.

-Compass, Contacts, Notification,Media, Storage

HTML templates decouples the UI definition (HTML markup) from your code.

Examples of Templates EnginesMustache.jsHandlebars.jsUnderscore.js

In index.html:

<h1>Handlebars JS Example</h1><script id="some-template" type="text/x-handlebars-template"> <table>    <thead>        <th>Name</th> <th>Job Title</th> <th>Twitter</th>    </thead>    <tbody>        {{#users}}

<tr> <td>{{fullName person}}</td> <td>{{jobTitle}}</td>

<td><a href="https://twitter.com/{{twitter}}">@{{twitter}}</a></td>        

</tr>        {{/users}}    </tbody> </table> </script>

How to use templates?How to use templates?

In .js file:

var source = $("#some-template").html(); var template = Handlebars.compile(source); var data = { users:

[ {person: {firstName: "Garry", lastName: "Finch”},  jobTitle: "Front End Technical Lead",         twitter: "gazraa” }, {person: { firstName: "Garry", lastName: "Finch”},      jobTitle: "Photographer”,       twitter: "photobasics”}] }; Handlebars.registerHelper('fullName', function(person) {  return person.firstName + " " + person.lastName;}); $('body').append(template(data));

How to use templates?How to use templates?

No need of SDK and IDE

Free for open source

QR quote for app installation

No need to generate UI on the server

No need to wait for data to display UI

Cache Everything

Use Hardware acceleration

Avoid Click events

 Poor performance, especially if your app is graphically intense, i.e. a game.

 Lack of pre-built UI widgets, transitions, standard controls, etc. Your development time can take longer, especially if you want a polished-looking app with a native look and feel.

New features of mobile platforms are not integrated immediately in the phoneGap.

http://phonegap.com/ https://build.phonegap.com/