Show Menu
SUJETS×

Meilleures pratiques

Adobe recommande d’utiliser l’éditeur d’application d’une seule page (SPA) pour les projets nécessitant un rendu côté client basé sur la structure SPA (par exemple, React). En savoir plus .
La création d'une application AEM Mobile On-Demand Services est différente de la création d'une application qui s'exécute directement dans le shell Cordova (ou PhoneGap). Les développeurs doivent connaître les points suivants :
  • Plug-ins pris en charge de manière standard, ainsi que les plug-ins spécifiques à AEM Mobile.
Pour en savoir plus sur les modules externes, consultez les ressources suivantes :
  • Les modèles qui utilisent la fonctionnalité de module externe doivent être écrits de manière à ce qu’ils soient toujours autorisés dans le navigateur, sans que le pont de module externe soit présent.
    • Par exemple, veillez à attendre la fonction deviceready avant de tenter d’accéder à l’API d’un module externe.

Instructions destinées aux développeurs AEM

Les recommandations suivantes aideront les développeurs AEM chevronnés pour les sites qui souhaitent créer des modèles et des composants d’applications mobiles :
Structure des modèles de sites AEM pour encourager la réutilisation et l’extensibilité
  • Préférer plusieurs fichiers de script de composant sur un seul fichier monolithique
    • Un certain nombre de points d’extension vides sont fournis, tels que customheaderlibs.html et customfooterlibs.html , qui permettent au développeur de modifier le modèle de page tout en dupliquant le moins de code de base possible.
    • Les modèles peuvent ensuite être étendus et personnalisés via le mécanisme sling:resourceSuperType de Sling
  • Préférer Sightly/HTL sur JSP comme langage de modèle
    • L’utilisation de cette méthode favorise une séparation du code et du balisage, offre une protection XSS intégrée et une syntaxe plus familière.
Optimiser les performances sur le périphérique
  • Le script spécifique à l’article et les feuilles de style doivent être inclus dans la charge utile de l’article, à l’aide du modèle dps-article contentsync.
  • Les feuilles de style et de script partagées par plusieurs articles doivent être incluses dans les ressources partagées, via le modèle contentsync dps-HTMLResources
  • Ne référencez aucun script externe qui bloque le rendu
Vous pouvez en savoir plus sur les scripts externes de blocage du rendu ici .
Préférer les bibliothèques JS et CSS côté client spécifiques à l’application à des bibliothèques Web spécifiques
  • Pour éviter les frais généraux dans des bibliothèques comme jQuery Mobile afin de gérer une vaste gamme de périphériques et de navigateurs
  • Lorsqu’un modèle s’exécute dans la vue Web d’une application, vous contrôlez les plateformes et les versions que l’application va prendre en charge, ainsi que la présence de la prise en charge JavaScript. Par exemple, préférez Ionic (peut-être simplement CSS) à jQuery Mobile et Onsen UI plutôt qu’à Bootstrap.
Pour en savoir plus sur jQuery Mobile, cliquez ici .
Préférer les micro-bibliothèques à la pile complète
  • Le temps nécessaire pour que votre contenu soit placé sur le verre de l'appareil sera ralenti par chaque bibliothèque dont dépendent vos articles. Ce ralentissement est aggravé lorsqu’une nouvelle vue Web est utilisée pour générer chaque article. Par conséquent, chaque bibliothèque doit être initialisée à nouveau de zéro.
  • Si vos articles ne sont pas créés en tant qu’applications monopages (applications d’une seule page), vous n’avez probablement pas besoin d’inclure une bibliothèque de pile complète comme Angular.
  • Préférez des bibliothèques à usage unique plus petites pour vous aider à ajouter l’interactivité dont votre page a besoin, telle que Fastclick ou Velocity.js
Réduire la taille de la charge utile d’un article
  • Utilisez les ressources les plus petites qui peuvent couvrir efficacement la plus grande fenêtre d’affichage que vous allez prendre en charge, à une résolution raisonnable
  • Utilisez un outil tel que ImageOptim sur vos images pour supprimer les métadonnées en excès

En route

Pour en savoir plus sur les deux autres rôles et responsabilités, consultez les ressources ci-dessous :