Utilisation de Phonegap pour le développement d'applications natives [fermé]

Je suis récemment tombé sur Phonegap . Quelqu'un d'entre vous a-t-il essayé. C'est un outil incroyable qui prétend que les développeurs peuvent utiliser un cadre basé sur HTML 5 comme Sencha touch et Jquery en même temps en ayant accès aux fonctionnalités natives sur le téléphone. De plus, le code est portable d'Android vers Iphone avec un certain effort. Avant de m'y plonger, je veux savoir quelle est l'expérience du forum avec Phonegap. Quels sont les points faibles et est-il vraiment évolutif pour le développement d'applications au niveau de l'entreprise?

J'ai créé quelques applications à l'aide de PhoneGap, et pour ce qu'il fournit, c'est génial. J'aimerais souligner quelques brèves notes qui pourraient vous aider.

Disable device-based features you're not using L'accéléromètre et les fonctionnalités de géolocalisation sont activés par défaut. Si vous ne les utilisez pas, je les désactiverais, car votre application se chargera plus rapidement (s'initialise) et fonctionnera plus facilement.

onDeviceReady- C'est la méthode qui est appelée une fois que phonegap est chargé et prêt. $ (document) .ready ou tout ce à quoi vous êtes habitué ne s'applique pas vraiment ici - à moins que vous ne fassiez que des trucs d'interface / HTML codés en dur. Si vous interagissez avec les fonctionnalités de l'iPhone, comme GeoLocation, vous devrez tout faire après l' appel de onDeviceReady.

Pick a UI/library Il existe une tonne d'options pour l'interface / bibliothèques, jquery-mobile, sencha touch, jqtouch, etc. Celles-ci offrent chacune une approche et un ensemble de fonctionnalités uniques. Faites des recherches et utilisez-en un, mais évitez de combiner. Vous pouvez en savoir plus sur d'autres options et outils ici: http://www.phonegap.com/tool (lien mis à jour)

Also, more on just mobile development in general, with PhoneGapSi vous cherchez à créer des applications, qui sont distribuées via le marché Android et l'iPhone App Store, je lirais leurs listes exhaustives pour obtenir des instructions sur la façon de développer votre application. Par exemple, dans le lien des outils ci-dessus, il y a un "outil / plugin" appelé Easy APNS - bien que cela soit utile pour Android - et techniquement faisable sur l'iPhone, il viole l'accord de développement, car il indique que vous devez utiliser la notification Apple réseau, etc. Ceci n'est qu'un exemple, mais lire sur ce sujet vous évitera beaucoup de maux de tête, si c'est votre objectif final.

Dans l'ensemble, c'est idéal pour les applications légères, surtout si vous venez d'un contexte de développement Web. LocalStorage, GeoLocation, etc. fonctionne vraiment bien. J'espère que cela aide un peu ... et se sentir à poser des questions.

Modification supplémentaire:

Je pense vraiment que cela dépend de ce que vous voulez faire et de ce que vous savez faire. Matt a souligné que développer des applications natives, pour iOS, c'est mieux, etc. Mais PhoneGap est fait pour les développeurs Web qui peuvent utiliser leurs compétences existantes et créer des applications. En outre, PhoneGap vous permet de créer des applications rapidement, pour iOS, Android, Symbian, Palm, Blackberry. Avec des ajustements mineurs à votre base de code pour chacun.

Voici tous les meilleurs guides de performances que j'ai lus pour PhoneGap ... il y a beaucoup de raisons de se méfier pour vous assurer d'avoir des performances solides et stables ... mais vous pouvez tout ramasser en une seule soirée de lecture.

Voici les meilleures pépites:

PhoneGap / Conseils sur les performances du Web mobile

• Comment Diary.com a augmenté les performances de son application PhoneGap exécutant Sencha: http://www.phonegap.com/2011/06/21/building-the-diary-com-ios-app-using-pg-sencha-touch/
• http://floatlearning.com/2011/03/developing-better-phonegap-apps/
• http://jslint.com/ - pour déboguer votre javascript
• http://zeptojs.com/ et http://xuijs.com/ - frameworks alternatifs minimaux à jquery et jqtouch
• Désactivez l'accéléromètre et l'emplacement http://blogs.nitobi.com/jesse/2009/10/28/running-jqtouch-in-phonegap/
  • définissez «EnableAcceleration» sur false dans PhoneGap.plist
  • définissez "AutoRotate" sur false dans PhoneGap.plist
• http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/
• http://cubiq.org/remove-onclick-delay-on-webkit-for-iphone
• Démo: http://cubiq.org/dropbox/clickdelay.html
• FastClick v TouchStart: http://groups.google.com/group/phonegap/browse_thread/thread/f5f5c78e26513821?pli=1

• http://forum.jquery.com/topic/ontouch-instead-of-onclick-event

• http://wiki.phonegap.com/w/page/16494809/Performance-tips-for-device/

• http://www.developer.nokia.com/Community/Wiki/JavaScript_Performance_Best_Practices
• http://evolvingwe.com/building-an-iphone-app-part-3-7-dev-tips/
• http://evolvingwe.com/upgrading-to-phonegap1-0/

• Conseils de performance vidéo pour Sencha Touch: http://vimeo.com/17882927

  • Il couvre les fonctionnalités de performance de Sencha, qui sont d'excellents principes que nous pouvons réappliquer. Nous pouvons même être en mesure de couper le code de certains morceaux de Sencha pour faire une nouvelle demande pour Skej.
  • Il déclare que nous DEVONS détruire tout ce qui n'est pas visible sur le DOM. Et que le DOM doit être maintenu aussi petit que possible à tout moment, avec le moins d'auditeurs possible. (C'est-à-dire attacher un écouteur à l'élément parent d'une liste, plutôt qu'à chaque élément de la liste.)
  • Il a également des conseils pratiques CSS3 à appliquer ... Fondamentalement, n'utilisez pas la plupart des nouvelles transitions et ombres / coins arrondis car le processeur utilise actuellement le processeur, et pas encore le GPU.

• Délégation d'événement dans Sencha Touch: comment concevoir des listes avec un seul auditeur, et non une sur chaque ligne. http://www.sencha.com/blog/event-delegation-in-sencha-touch/

• Optimisation de l'utilisation de la mémoire DOM dans Sencha Touch: glissement d'une liste vers un panneau Détails et suppression de la liste, puis glissement de Détails vers une liste et suppression du panneau Détails. Minimiser les éléments sur votre écran, votre DOM. http://www.sencha.com/blog/sencha-touch-optimizing-memory-usage/
• DÉTRUISEZ TOUT CE QUI N'EST PAS VISIBLE SUR VOTRE DOM!
• Utilisez des animations CSS au lieu de jQuery
• http://nyroo.com/l/B7UN5c
• http://www.ferretarmy.com/css-animation-examples/
  • Soyez prudent ... ceux-ci sont délicats lorsqu'ils n'utilisent pas le GPU et embourbent le CPU.

Activation de nouvelles fonctions

• Activer l'affichage Retina: http://evolvingwe.com/create-retina-display-images-in-mobile-web-themes-and-phonegap-apps/
• Faites glisser pour supprimer: http://www.codesta.com/blog/2011/5/23/sencha-touchphonegap-tips-and-tricks.html
• Désactivez l'accéléromètre et l'emplacement: http://iamcam.wordpress.com/2009/10/29/phonegap-up-to-speed/
• Couper jQuery et Hand-code: http://cubiq.org/do-you-really-need-jquery-for-mobile-dev
• Afficher la liste des contacts dans Mobile Safari: http://cubiq.org/contact-list-on-webkit-for-iphone
• iScroll4: Créez un en-tête, faites défiler dans un div de taille fixe, pincez et zoomez, tirez vers le haut / bas pour actualiser. http://cubiq.org/iscroll-4 (Comprend des conseils sur l'effet élastique.)
• Repo GitHub de PhoneGap: Comprend des exemples intéressants tels que DatePicker, SMSComposer, ApplicationPreferences, Splashscreen, NetworkActivityIndicator ... https://github.com/phonegap/phonegap-plugins

Architecture

Architecture de votre application dans Ext JS 4: http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-2

Avant d'exprimer mon opinion sur Phonegap, je dois émettre un petit avertissement disant que je ne suis en aucun cas un développeur Web. Pour moi, écrire du JavaScript et du CSS, c'est comme s'arracher les dents. Cela dit, je n'aime pas Phonegap.

Il y a quelques aspects très attrayants du cadre, principalement l'appel "Ecrire une fois-Exécuter-Anywere" et le "Je-n'ai-pas-à-apprendre-Objectif-C?" charme. Le framework peut même vous donner accès à certaines des fonctionnalités matérielles telles que l'accéléromètre. Tous ces éléments sont valables, dans une certaine mesure.

Cela dit, aucune des grandes applications iOS n'est construite à l'aide de tout type de cadre multiplateforme. Il y a tellement d'interactions subtiles et élégantes de l'interface utilisateur qui sont gérées pour vous par les contrôles UIKit natifs que de nombreux utilisateurs et développeurs tiennent pour acquis jusqu'à ce qu'elles soient manquantes, comme la multitude de courbes d'animation de vues incroyablement détaillées et de rebonds de défilement qui ne sont pas là dans l'interface utilisateur basée sur la vue Web. Vous pourriez vous efforcer de les reproduire parfaitement, mais pour cet investissement en temps, pourquoi ne pas simplement devenir natif?

Un deuxième point à noter est que la communauté de support pour les applications iOS construites par Phonegap est considérablement plus petite que les applications développées en natif. Si vous comptez sur la communauté pendant les projets, cela devrait également vous donner une pause.

En fin de compte, cela dépend de la qualité de l'expérience que vous souhaitez offrir. La limite supérieure est inférieure avec Phonegap. Si vous êtes prêt à accepter une expérience utilisateur moins qu'excellente en échange de temps de développement réduits et d'une portabilité accrue, alors c'est un cadre très viable.

Comme sous-texte pour tous ceux qui sont intéressés, Marco Arment et Dan Benjamin ont récemment discuté de ce sujet. Vous pouvez l'écouter ici .

La procédure d'installation implique un certain nombre de packages (Java, Apache Ant, Ruby, iOS SDK, Android SDK et PhoneGap lui-même), qui doivent tous être correctement installés et configurés. Cela peut être un effort majeur. Pour être honnête, ils ont quelque chose appelé PhoneGap Build en version bêta qui devrait rendre cela beaucoup plus facile.

Nous l'utilisons avec NS Basic / App Studio pour produire des applications éligibles aux magasins d'applications.

si vous ne créez pas de jeu ni de widget, mais simplement une belle application, phonegap est votre choix.

Mais vous devez faire attention avec votre JS, évitez de faire quoi que ce soit dans JS par exemple si vous voulez faire une animation évitez de définir un timer avec de petits intervalles (par exemple 100 ms), évitez jquery et les animations similaires. Par exemple, au lieu d'animer le fondu en définissant une minuterie de courte période diminuant l'opacité à chaque point étape par étape (c'est ainsi que fonctionne le fondu jquery), vous devez utiliser les transitions css3 de l'opacité 1 à l'opacité 0.

Mon conseil est d'aller avec quelque chose comme zeptojs.com, après tout phonegap ne fonctionnera pas ie6 :-)

Consultez un tutoriel sur la façon de rendre votre JS plus léger

http://bcksp.blogspot.com/

Si vous n'avez besoin d'aucune des fonctionnalités matérielles ou des performances au-delà de ce que fournissent HTML5 et Phonegap, une application Web encapsulée (plus un accès limité à d'autres fonctionnalités) est une excellente solution.

De nombreuses entreprises déploient des applications Web à grande échelle. Phonegap (ou simplement un simple contrôle d'affichage Web avec contenu intégré) vous permettra d'exécuter ces applications Web hors ligne (sauf, bien sûr, pour les données en ligne requises).

Une «douleur» non mentionnée lors du déploiement sur plusieurs appareils différents: plus il y a d'appareils, plus la courbe d'apprentissage est grande. Pour déployer sur des appareils iOS avec PhoneGap, vous devrez apprendre les bases de Xcode sur un Mac. Pour déployer sur Android, vous devrez installer et apprendre Eclipse, le SDK Android, etc. Les autres plates-formes exigent que leurs propres SDK soient utilisés. L'apprentissage de Xcode, Javascript et Java rudimentaires m'aide à comprendre les erreurs et la syntaxe générale.

"Créer une fois, déployer partout" laisse de côté BEAUCOUP d'étapes!