Application hybride - Ionic vs NativeScript
Je suis dans l’espace mobile depuis un certain temps et nous avons déjà une application native Android et iOS. Notre société envisage maintenant d'améliorer notre site mobile et notre équipe a choisi Angular 2 + TypeScript + Ionic 2. Nous avons développé avec beaucoup de difficulté le formulaire d'inscription en Ionic + Angulaire. Maintenant, je connais maintenant NativeScript pour développer des applications hybrides sans visualisation Web et, puisqu'il utilise le composant d'interface utilisateur natif, les utilisateurs affirment que l'apparence et les performances de l'application seront bonnes.
Je suis un peu confus de choisir un 1. Angular + TypeScript + Ionic (HTML, JS, CSS) ou 2. Angular + TypeScript + NativeScript (xml , js, css)
Le plan à long terme de notre société est également de maintenir une source unique pour iOS, Android et le site mobile.
Aidez-moi, s'il vous plaît.
Merci
C'est vraiment une question/réponse subjective, car cela dépend de la quantité de travail que vous voulez faire. :-)
Tout d'abord, dans une application Ionic/Angular, vous créez la même version Web au même moment (c'est-à-dire qu'il s'agit d'une application hybride). Les performances peuvent être un problème grave selon ce que vous faites. Écrans simples pas tellement; de nombreuses données introduiront des problèmes de performances beaucoup plus importants. De plus, la disposition de l’écran vous causera probablement le plus de problèmes car vous codez dans un petit navigateur Web qui a des résolutions d’écran totalement différentes en fonction de chaque appareil et du système d’exploitation sur lequel il tourne. Si vous avez besoin de plus près des performances natives; il y a des choses que vous pouvez faire pour accélérer Ionic (c'est-à-dire comme avec CrossWalk) et, globalement, vous pouvez générer une application Web/hybride décente dans Ionic.
Toutefois, les chances sont très probables que les systèmes hybrides ne se rapprochent jamais des performances natives et ne se comportent pas réellement comme une application native, car il s’agit toujours d’une application Web exécutée dans un navigateur essayant de se comporter comme une application native.
Désormais, si vous recherchez des performances natives et/ou la possibilité d'effectuer des tâches natives sur le périphérique, utiliser NativeScript peut constituer le meilleur choix. Vous bénéficiez des performances et de l’accès natifs à tous les contrôles natifs (par exemple, des choses telles que ListViews pouvant gérer des milliers d’éléments complexes sans ralentissement), mais le coût est que vous devez créer deux écrans et des CSS séparés pour votre ordinateur. app.
Si vous utilisez Angular ou VueJS; La logique réelle peut être partagée entre NativeScript et votre application Web. Et il existe maintenant plusieurs excellentes façons de procéder, comme xPlat (plateforme de partage de code angulaire). Mais dans chacun d'entre eux, la génération d'écran est encore différente. Donc, pour votre composant/écran Web, vous pourriez avoir un Web mycomponent.html -> <div>{{somevalue}}</div> Et en NativeScript Angular mycomponent.html -> <Label text="{{somevalue}}"></Label> . Vous vous retrouvez donc avec un travail plus direct dans NativeScript, car vous devez créer deux fichiers de disposition d'écran distincts. Cela peut sembler être un problème. mais en réalité, cela vous permet de disposer de la version mobile native mieux conçue pour les écrans de téléphone et/ou de tablette. Cela ouvre également des options supplémentaires, comme peut-être un accès en temps réel à la caméra dans la présentation NativeScript et un bouton de téléchargement de fichier image dans la version html.
En tant que personne qui a utilisé les deux technologies, je suis fermement dans le camp NativeScript pour tous mes nouveaux projets. mais pour certaines personnes, il existe encore des cas d'utilisation valables pour utiliser Ionic/Phonegap/Cordova. Si l'application est déjà basée sur le Web et/ou rien qui nécessite vraiment des vues complexes et/ou beaucoup de données affichées. En fait, la plate-forme open source xPlat proposée par nStudio prend en charge les cibles Ionic et NativeScript. Vous pouvez ainsi partager le code entre toutes les plates-formes prises en charge et faire le meilleur choix pour votre entreprise à tout moment.
Par exemple; Peut-être que vous commencez par la construction Ionic/Web, car dans l’ensemble, c’est fondamentalement la même chose. Sur la route avec le partage de code xPlat, vous pouvez facilement harmoniser votre partie mobile de l’application avec Nativescript lorsque vous avez enfin suffisamment de temps et d’énergie et/ou si vous avez besoin de meilleures performances.
Veuillez noter que NativeScript avec/Angular permet le partage de code; En outre, si vous êtes un grand fan de VueJS, NativeScript avec VueJS permet également le partage de code. Il existe donc deux excellents moyens de partager du code entre votre site Web et votre application NativeScript, en fonction de ce que votre entreprise utilise déjà tout en conservant les performances natives de votre application mobile.
Réponse courte
Avec ionique vous construisez des applications hybrides ou Applications Web progressives. La structure de l'application est écrite en HTML et l'application construite utilise WebViews (un site Web similaire à celui de votre application) .
Avec NativeScript , vous construisez vraiment des applications natives qui do n'utilisez pas le DOM HTML et vous devrez apprendre les composants d'interface utilisateur de la plate-forme que vous ciblez (par exemple iOS / Android ). Cependant, les applications natives sont généralement plus rapides que les applications hybrides et vous pouvez accéder aux fonctionnalités matérielles telles que l'appareil photo, le toucher, l'agenda, les appels téléphoniques, etc., le tout avec TypeScript./Code JavaScript.
Longue réponse
Voici un extrait d'un article de blog de Danyal Zia. Je vous suggère de lire le complet.
Ionique (2)
Ionic 2 est un cadre de développement mobile hybride … d'accord, que veut-il dire par développement hybride? Les applications hybrides sont comme toutes les autres applications que vous pouvez trouver sur les magasins d'applications, elles fonctionnent de la même manière (en les téléchargeant et en les installant), et l'interaction utilisateur est similaire. applications.
La chose intéressante à propos des applications hybrides est qu’elles sont hébergées dans une application native qui utilise la WebView WebView , qui est en quelque sorte un chargeur de pages Web sans navigateur. vous avez accès aux fonctionnalités mobiles, telles que l'appareil photo, les contacts, le gyroscope, etc. via les langages de sites Web, tels que HTML, XML, CSS, etc.
Ionic 2 utilise toujours WebView (tout comme la version précédente Ionic version), de sorte que vous écrivez le code HTML dans votre = Android activités , de sorte qu'il peut être plus lent que ReactNative et NativeScript (nous en reparlerons plus tard). Vous pouvez créer des widgets d’apparence native dans Ionic = 2, mais ils restituent toujours dans WebView à l'intérieur d'un conteneur natif et ne sont donc pas techniquement natifs.
Avantages :
- Assistance au développement Web hybride. Le même code peut être utilisé pour développer des applications pour Android, iOS, Windows Phone et Web.
- Cycle de développement-test TRÈS rapide. Vous écrivez le code et le testez sur le navigateur, vous n'avez pas besoin de charger beaucoup d'émulateur.
- Vous permet d'écrire du code dans TypeScript, rendant la transition de Angular 2 très facile.
- Le même langage (TypeScript) peut être utilisé pour développer des applications pour chaque plate-forme.
- Son système de plug-in vous permet d'utiliser tout type de fonctionnalités natives des périphériques.
Inconvénients :
- Des problèmes de performances peuvent survenir si vous devez utiliser beaucoup de rappels au code natif.
- La même interface utilisateur dans tous les appareils peut constituer un facteur décisif pour ceux qui préfèrent une interface utilisateur native.
- Le développement de graphiques très avancés ou de transitions hautement interactives peut être un travail complexe.
NativeScript
Développé par Telerik , NativeScript vous permet d’utiliser soit JavaScript, soit TypeScript pour le développement, donc si vous avez utilisé Angular 2 plus tôt, la transition sera facile. Telerik a déjà développé une interface de Kendo avec une intégration étroite Angular pour l'hybride applications, mais ils se sont ensuite rendus compte, pourquoi ne pas fournir la véritable expérience native multiplateforme?
Avec TypeScript et Angular 2, vous pouvez très facilement créer des composants pour des applications mobiles en utilisant un style déclaratif. Affirmant qu'il prend en charge “écrivez-le une fois, exécutez-le partout”, le même Angular 2 peut être utilisé pour l'interface utilisateur pour toutes les plates-formes qu'elle cible. NativeScript est une véritable multiplate-forme, ce qui signifie un accès 100% à l'API native et sa mission est de permettre aux utilisateurs d'utiliser la même base de code toutes les plateformes.
Contrairement à ReactNative, NativeScript utilise le code de l'interface utilisateur native (pour les téléphones respectifs Android et iOS)) même si vous écrivez le code en TypeScript/JavaScript! Si nous considérons le côté performances, alors NativeScript a vraiment le Edge over ReactNative, car il utilise la structure AngularJS 2 pour créer des composants.
La meilleure chose à propos de NativeScript est qu’il est développé par Telerik , ce qui vous assure qu’il continuera à recevoir de nouvelles mises à jour à l’avenir, car il est soutenu par des professionnels. développeurs du monde entier. Ainsi, si vous utilisez des applications commerciales, vous pouvez vous fier davantage à NativeScript qu'à ReactNative, car ReactNative est plus convivial pour les sources ouvertes et repose sur de nombreuses contributions des utilisateurs. Mais NativeScript est également open-source.
NativeScript est également assez mature par rapport à ReactNative. Il est déjà en version 2.0, ce n’est pas le cas avec ReactNative qui reçoit moins de mises à jour. NativeScript peut partager beaucoup plus de code que ReactNative, ce qui signifie que vous gagnerez du temps.
Avantages :
- Véritable support multi-plateformes. Base de code unique pour le développement d'applications pour toutes les plates-formes prises en charge.
- Accès 100% à l'API native. Vous pouvez accéder aux fonctionnalités matérielles telles que l'appareil photo, les écrans tactiles, l'agenda, les appels téléphoniques, etc., le tout avec du code TypeScript/JavaScript.
- Utilise le Angular 2 pour vous permettre de transférer facilement vos composants Web précédents dans vos applications.
- Très bon support de Telerik.
Inconvénients:
- De nombreux plugins doivent être téléchargés séparément pour les composants. Tous les plugins ne sont pas disponibles ou vérifiés (c'est-à-dire minutieusement testés).
- La taille de l'application est beaucoup plus grande que ReactNative et Ionic 2.). Si vos utilisateurs disposent d'une connexion Internet lente, cela peut poser un problème.
- NativeScript ne prenant pas en charge HTML et DOM, vous devez donc apprendre différents composants d’interface utilisateur pour créer l’UI des applications.
Ne mélangez pas Nativescript avec des applications hybrides car les applications hybrides sont des applications qui utilisent WebView (comme Ionic), Nativescript est une application native. Lequel de la différence entre les deux types.
Avec Ionic, vous pouvez avoir une source unique puisque vous avez la même vue des trois cibles.
Avec Nativescript utilise l’élément natif. Vous devrez donc effectuer deux affichages différents pour les navigateurs et les mobiles, ainsi que quelques modifications entre le code javascript car certaines choses ne figurent pas dans l’API du navigateur mais se trouvent du côté natif ou inversement. .
Dépend de l'application quelle est la cible d'utilisation.
Pour ajouter tardivement aux excellentes réponses ci-dessus, comme vous l'avez mentionné, l'entreprise doit également contribuer au processus de décision. Voici quelques questions subjectives auxquelles l’entreprise doit pouvoir répondre:
Quel impact le financement/l'identification des ressources de développeur aura-t-il sur le projet? I.e .: devons-nous faire avec ce que nous avons? Obtenir de nouvelles personnes? Recycler? Les solutions hybrides par rapport aux solutions natives et si l'utilisation du code existant est requise ont un impact non négligeable. Imaginez une solution dans laquelle les développeurs natifs ou frontaux deviennent plus ou moins redondants ...
Quel est l’impact sur l’entreprise si l’UI/UX est ou non similaire entre mobile/Web/responsive/hybride/PWA? Qu'en est-il de l'impact de fonctionnalités quelque peu différentes, accédant à des fonctionnalités natives telles que appareil photo, GPS, notifications, etc. entre les fonctionnalités natives et Web/responsive/hybride/PWA?
- Quel est l'impact de la performance éventuellement différente des applications sur les plates-formes? (ie. natif est plus rapide)
- L'entreprise a-t-elle évalué les coûts de vie et de maintenance de chacune de ces solutions?
Les réponses sont des facteurs importants pour aller réactif (disons grid/flexbox/bootstrap), hybride (disons ionique) ou natif (disons de Nativescript, React Native, ou pur os native).
À la fin, la décision finale est une combinaison de facteurs opérationnels et techniques.