Pratiques recommandées – Conseils pour la création de contenu pour appareils mobiles

Pour créer un contenu Animate pour des appareils mobiles, suivez certains principes de base. Par exemple, les développeurs Animate évitent souvent les illustrations très complexes et les transparences ou les interpolations inutiles.

Les développeurs Flash Lite doivent faire face à des défis supplémentaires, les performances variant considérablement suivant les périphériques mobiles. Si le contenu doit être publié pour de nombreux périphériques différents, les développeurs doivent parfois baser la création sur le plus petit dénominateur commun.

L’optimisation d’un contenu mobile nécessite de faire des compromis. Par exemple, une technique donnée peut améliorer l’apparence du contenu, alors qu’une autre technique offrira de meilleures performances. Lors de l’évaluation de ces compromis, vous devrez continuellement comparer le test dans l’émulateur et le test sur le périphérique cible. Vous devez voir votre contenu sur le périphérique afin d’en évaluer la précision des couleurs, la lisibilité du texte, les interactions physiques, la réactivité de l’interface utilisateur et tous les autres aspects relatifs à l’utilisation du périphérique mobile.

 Le contenu sur Flash Lite ne s’applique pas à Flash CC et versions ultérieures.

Conseils Flash Lite pour l’animation sur des périphériques mobiles

Lors de la création d’un contenu animé pour un périphérique mobile, gardez en mémoire les limites de la mémoire du périphérique. En respectant les instructions suivantes, vous éviterez peut-être que le contenu Flash Lite ne s’exécute lentement :

• Lors de la création d’un fichier Flash Lite, vérifiez que le document est correctement défini. L’adaptation des fichiers Animate se fait de manière lisse, mais si le fichier ne s’exécute pas dans son format de scène d’origine et doit s’adapter au lecteur, les performances peuvent en souffrir. Essayez de définir la taille de scène du document afin qu’elle corresponde à la résolution du périphérique cible. Définissez également Flash Player sur la version correcte de Flash Lite.

• Flash Lite peut afficher trois niveaux de qualité de rendu pour les graphiques vectoriels : faible, moyenne et haute. Plus la qualité du rendu est élevée, plus le rendu des graphiques vectoriels dans Flash Lite est lisse et précis, et plus le processeur du périphérique est sollicité pour le traitement. Si vous devez afficher une animation complexe, essayez de modifier le paramètre de qualité de rendu du contenu sur le lecteur, puis testez le fichier SWF de manière exhaustive. La propriété _quality ou la commande SetQuality permettent de contrôler la qualité de rendu d’un fichier SWF. Pour la propriété _quality, les valeurs sont LOW, MEDIUM et HIGH.

• Limitez le nombre d’interpolations simultanées. Réduisez le nombre d’interpolations ou découpez l’animation en séquences de sorte qu’elles s’enchaînent.

• Utilisez des effets de transparence (alpha) sur les symboles avec parcimonie, ces derniers étant particulièrement gourmands en ressources. En particulier, il est préférable d’éviter l’interpolation de symboles possédant des niveaux alpha qui ne sont pas totalement opaques (inférieurs à 100 %).

• Évitez les effets visuels sollicitant fortement le processeur, tels que de grands masques, de trop nombreux mouvements, le fondu alpha, de trop nombreux dégradés ou des vecteurs complexes.

• Essayez différentes combinaisons d’interpolations, d’animations d’image-clé et de mouvements ActionScript pour obtenir les résultats les plus efficaces.

• Le rendu des ovales et des cercles demande beaucoup plus de mémoire que le rendu des quadrilatères. En outre, l’application de traits ronds ou ovales accroît considérablement l’utilisation du processeur.

• Testez les animations régulièrement sur les périphériques cibles réels.

• Lorsque vous définissez une région animée dans Animate, un cadre de sélection est défini autour de la zone. Optimisez le dessin afin que le rectangle soit le plus petit possible. Évitez le chevauchement des interpolations, car Animate interprète la zone fusionnée comme un simple rectangle, ce qui entraîne une région totale plus grande. Utilisez la fonction d’affichage de la zone de retraçage d’Animate pour optimiser l’animation.

• Évitez d’utiliser _alpha = 0 et _visible = false pour masquer les clips à l’écran. Si vous désactivez simplement la visibilité d’un clip ou modifiez l’alpha en zéro, il fait toujours partie des calculs d’affichage de ligne, ce qui peut affecter les performances.

• De même, n’essayez pas de masquer un clip en le cachant derrière un autre élément. Il fera toujours partie des calculs du lecteur. Au contraire, retirez entièrement les clips de la scène ou supprimez-les en appelant la fonction removeMovieClip.

Graphiques bitmap et vectoriels Flash Lite sur des périphériques mobiles

Flash Lite permet d’afficher des graphiques vectoriels et des images bitmap. Chaque type de graphique présente ses propres avantages et inconvénients. Le choix du type de graphique n’est pas toujours évident et dépend souvent de plusieurs facteurs.

Les graphiques vectoriels sont représentés de façon compacte dans les fichiers SWF sous forme d’équations mathématiques, puis affichés à l’aide du lecteur Flash Lite. Par opposition, les graphiques bitmap sont représentés sous forme de tableaux d’éléments d’image (pixels), ce qui nécessite davantage d’octets pour décrire les données. Par conséquent, l’utilisation de graphiques vectoriels dans un fichier permet de minimiser la taille du fichier et la mémoire sollicitée.

Les graphiques vectoriels conservent également leurs formes intactes lorsqu’ils sont redimensionnés, contrairement aux images bitmap qui peuvent prendre un aspect pointilliste ou pixélisé.

Comparés aux bitmaps, cependant, les graphiques vectoriels nécessitent davantage de puissance de traitement, notamment les graphiques recourant à des formes ou des trames complexes. Par conséquent, l’utilisation généralisée de formes vectorielles risque de réduire les performances globales du fichier. Dans la mesure où les images bitmap nécessitent moins de puissance de traitement que les vecteurs, elles peuvent représenter un meilleur choix pour certains fichiers, comme une carte routière complexe devant être animée et utilisée sur un téléphone portable.

Gardez ces différents points en mémoire :

• Évitez d’utiliser des contours dans vos formes vectorielles. Les contours ont des bords internes et externes (les motifs de remplissage n’ont qu’un bord) et leur affichage représente deux fois plus de travail.

• Les angles sont plus simples à afficher que les courbes. Dans la mesure du possible, utilisez des bords plats, surtout avec les très petites formes vectorielles.

• L’optimisation est très utile sur les petites formes vectorielles, comme les icônes. Les détails des icônes complexes peuvent être perdus lors de l’affichage et le travail d’affichage de ces détails est donc du gaspillage.

• En règle générale, utilisez des bitmaps pour les images petites et complexes (telles que les icônes) et les images vectorielles pour les images plus grandes et simples.

• Importez des images bitmap à la taille appropriée ; n’essayez pas d’importer de grands graphiques et de les réduire avec Animate, dans la mesure où cela augmente la taille du fichier et utilise de la mémoire inutilement.

• Le lecteur Flash Lite ne prend pas en charge le lissage de bitmaps. Si une image bitmap est mise à l’échelle ou pivotée, elle peut sembler arrondie. Si vous devez mettre à l’échelle ou faire pivoter un graphique, utilisez plutôt un graphique vectoriel.

• Le texte est avant tout une forme vectorielle très complexe. Le texte est très souvent critique et il peut rarement être entièrement évité. Lorsque du texte est nécessaire, évitez de l’animer ou de le positionner sur une animation. Utilisez le texte comme une forme bitmap. Pour un texte multi-ligne dynamique et de saisie, le saut de ligne de la chaîne n’est pas mis en mémoire. Animate effectue les sauts de ligne au moment de l’exécution et recalcule le saut de ligne à chaque fois que le champ texte doit être redessiné. Les champs texte statique ne posent aucun problème, le saut de ligne étant calculé au moment de la compilation. Pour les contenus dynamiques, vous devez utiliser des champs texte dynamique, mais, dans la mesure du possible, essayez plutôt d’utiliser des champs texte statique.

• Réduisez l’utilisation de transparents dans les fichiers PNG, car Animate doit toujours calculer le dessin, même dans les parties transparentes de l’image bitmap. Par exemple, dans un fichier PNG transparent qui représente un élément d’arrière-plan, n’exportez pas le PNG transparent à la taille réelle de l’écran. Exportez-le plutôt à la taille réelle de l’élément d’arrière-plan.

• Essayez de regrouper les calques bitmap ensemble et les calques vectoriels ensemble. Animate doit mettre en place différents affichages pour les contenus bitmap et vectoriels, et passer d’un affichage à l’autre prend beaucoup de temps.

Définition des options de compression des images bitmap Flash Lite pour les périphérique mobiles

Si vous utilisez des bitmaps, vous pouvez définir des options de compression d’image (au niveau de chaque image ou globalement pour toutes les images bitmap) qui réduiront la taille de votre fichier SWF.

Définition d’options de compression pour un fichier bitmap unique

Définition de la compression de l’ensemble des images bitmap

Optimisation des images Flash Lite pour les périphériques mobiles

• La plupart des périphériques prenant en charge Flash Lite lisent le contenu à une vitesse d’environ 15 à 20 images par seconde (ips). La cadence d’images peut se réduire à 6 ips. Pendant la phase de développement, définissez la cadence du document de manière à obtenir une correspondance optimale avec la vitesse de lecture du périphérique cible. Vous pourrez ainsi visualiser la manière dont votre contenu s’exécutera sur un périphérique aux performances limitées. Avant de publier votre fichier SWF final, définissez la cadence du document sur 20 ips minimum pour éviter les limitations de performances, si le périphérique peut prendre en charge une cadence plus élevée.

• Lorsque vous utilisez la commande gotoAndPlay, souvenez-vous que chaque image entre l’image en cours et l’image demandée doit être initialisée avant la lecture de cette dernière. Si les images comportent des contenus différents, il peut être plus efficace d’utiliser différents clips plutôt que le scénario.

• Le préchargement de tous les contenus pour les positionner en début de fichier semble logique, mais ce préchargement sur un périphérique mobile peut retarder le démarrage du fichier. Espacez les contenus dans le fichier, de manière à ce que les clips soient initialisés au moment de leur utilisation.

Optimisation des performances du code ActionScript pour le contenu Flash Lite sur des périphériques mobiles

En raison des restrictions applicables en termes de puissance de traitement et de mémoire à la plupart des périphériques mobiles, respectez les directives suivantes lorsque vous développez du contenu ActionScript for Flash Lite à destination des périphériques mobiles :

• Simplifiez autant que possible le fichier et son code. Supprimez les clips non utilisés, supprimez les images et les boucles non nécessaires et évitez la lecture de trop d’images ou d’images parasites.

• L’utilisation de boucles FOR peut être gourmande en ressources en raison du temps système nécessaire pour la vérification de la condition à chaque itération. Lorsque les ressources requises pour l’itération et le temps système pour la boucle sont identiques, exécutez plusieurs opérations plutôt qu’une boucle. Le code peut être plus long, mais les performances seront meilleures.

• Arrêtez la lecture en boucle d’images dès qu’elle n’est plus requise.

• Si possible, évitez le traitement de tableaux et de chaînes, car cette opération peut s’avérer particulièrement gourmande en ressources.

• Essayez toujours d’accéder directement aux propriétés, au lieu d’utiliser les méthodes de lecture/définition d’ActionScript, qui consomment davantage de ressources que les autres méthodes d’appel.

• Gérez les événements de façon mesurée. Conservez des tableaux d’événements compacts en utilisant des conditions pour détecter la présence d’un écouteur (différent de null) avant d’appeler ce dernier. Supprimez les intervalles actifs en appelant la fonction clearInterval et supprimez tous les tableaux actifs en appelant la fonction removeListener avant de supprimer le contenu à l’aide de la fonction unloadapplication ou removeapplicationClip. Animate ne récupère pas la mémoire des données SWF (par exemple, des intervalles et des tableaux) si des fonctions ActionScript font référence aux données SWF lorsqu’un clip est déchargé.

• Supprimez les variables obsolètes ou définissez-les sur null, ce qui permet de marquer les données à supprimer. La suppression des variables permet d’optimiser l’utilisation de la mémoire lors de l’exécution, dans la mesure où les actifs superflus sont supprimés du fichier SWF. Il est préférable de supprimer les variables que de les définir sur null.

• Supprimez de façon explicite les tableaux des objets en appelant la fonction removeListener avant la suppression des données inutiles.

• Si vous appelez une fonction de façon dynamique et transmettez un ensemble fixe de paramètres, utilisez la fonction call et non pas la fonction apply.

• Réduisez les espaces de nom (tels que les chemins) pour accélérer le démarrage. Tous les niveaux du package sont compilés à l’aide d’une instruction IF, ce qui entraîne un nouvel appel à Object. Par conséquent, la réduction du nombre de niveaux dans le chemin permet de gagner du temps. Par exemple, un chemin comportant les niveaux com.xxx.yyy.aaa.bbb.ccc.funtionName entraîne la création d’une occurrence d’objet pour com.xxx.yyy.aaa.bbb.ccc. Certains développeurs Flash ont recours à un logiciel de prétraitement pour réduire le chemin à un identificateur unique, tel que 58923409876.functionName, avant de compiler le fichier SWF.

• Si votre fichier comprend plusieurs fichiers SWF qui utilisent les mêmes classes ActionScript, vous pouvez exclure ces classes de certains fichiers SWF lors de la compilation. Cela permet de réduire le temps de chargement du fichier et la mémoire nécessaire pendant l’exécution.

• Évitez d’utiliser Object.watch et Object.unwatch, dans la mesure où tout changement de propriété des objets implique que le lecteur détermine si une notification de changement doit être envoyée.

• Si le code ActionScript qui s’exécute sur une image clé dans le scénario prend plus d’une seconde à s’exécuter, envisagez de fractionner ce code, de façon à répartir son exécution sur plusieurs images clés.

• Supprimez les instructions trace de votre code lorsque vous publiez le fichier SWF. Pour ce faire, cochez la case Omettre les actions Trace dans l’onglet Flash de la boîte de dialogue Paramètres de publication.

• La fonctionnalité d’héritage accroît le nombre d’appels de méthode et utilise davantage de mémoire : une classe incluant l’ensemble des fonctionnalités nécessaires est plus efficace lors de l’exécution qu’une classe qui hérite une partie de ses fonctionnalités à partir d’une superclasse. Par conséquent, il faut établir un compromis entre l’extensibilité des classes et l’efficacité de votre code.

• Lorsqu’un fichier SWF charge un autre fichier SWF contenant une classe ActionScript personnalisée (par exemple, foo.bar.CustomClass), puis décharge le fichier SWF, la définition de classe reste en mémoire. Pour économiser la mémoire, supprimez de façon explicite les classes personnalisées des fichiers SWF déchargés. Utilisez l’instruction delete et spécifiez le nom de classe avec tous ses attributs, comme dans l’exemple suivant : delete foo.bar.CustomClass.

• Limitez l’utilisation des variables globales, dans la mesure où elles ne sont pas supprimées automatiquement si le clip qui a servi à les définir a été supprimé.

• Évitez d’exploiter les composants d’interface standard (disponibles dans le panneau Composants de Flash). Ces composants sont conçus pour s’exécuter sur les ordinateurs de bureau et ne sont pas optimisés pour les périphériques mobiles.

• Dans la mesure du possible, évitez d’utiliser les fonctions à imbrication complexe.

• Évitez de référencer des variables, des fonctions ou des objets non existants. Contrairement à la version de bureau de Flash Player, Flash Lite 2 analyse lentement les références aux variables non existantes, ce qui risque d’affecter considérablement les performances.

• Évitez de définir des fonctions à l’aide d’une syntaxe anonyme. Par exemple, myObj.eventName = function{ ...}. Les fonctions explicitement définies sont plus efficaces, comme la fonction function myFunc { ...}; my Obj.eventName = myFunc;.

• Réduisez l’utilisation de fonctions mathématiques et de nombres à virgule flottante. Le calcul de ces valeurs ralentit les performances. Si vous devez utiliser des routines mathématiques, essayez de précalculer les valeurs et de les stocker dans des tableaux de variables. L’extraction de valeurs d’une table de données est beaucoup plus rapide que le calcul par Flash au moment de l’exécution.

Gestion de la mémoire du fichier Flash Lite pour les périphériques mobiles

Flash Lite efface régulièrement de la mémoire les objets et les variables qui ne sont plus référencés par le fichier. Ce processus est appelé suppression des données inutiles. Flash Lite exécute ce processus toutes les 60 secondes ou lorsque l’utilisation de la mémoire du fichier augmente brusquement de 20 % ou plus.

Bien que vous ne puissiez pas contrôler la façon dont Flash Lite exécute ce processus et sa fréquence, vous pouvez cependant libérer la mémoire non utilisée. Pour un scénario ou des variables globales, utilisez l’instruction delete pour libérer la mémoire utilisée par l’objet ActionScript. Pour les variables locales, par exemple une variable créée par une fonction, vous ne pouvez pas utiliser l’instruction delete pour libérer la mémoire d’un objet ; en revanche, vous pouvez définir sur null la variable qui référence l’objet. Cette opération libère la mémoire utilisée par l’objet, à condition que cet objet ne soit pas référencé ailleurs.

Les deux exemples de code suivants indiquent comment libérer la mémoire utilisée par les objets en supprimant la variable qui fait référence à ces objets. Les exemples sont presque identiques, le premier crée une variable de scénario, tandis que le second génère une variable globale.

Comme indiqué plus haut, vous ne pouvez pas utiliser l’instruction delete pour libérer la mémoire utilisée par une variable de fonction locale. En revanche, vous pouvez définir la référence de variable sur null, ce qui a le même effet que la commande delete.

Chargement de données pour des périphériques mobiles dans Flash Lite

Lorsque vous développez des fichiers pour des périphériques mobiles, il est préférable de réduire autant que possible la quantité de données à charger en une seule opération. Si vous chargez des données externes dans un fichier Flash Lite (par exemple, à l’aide de XML.load), le système d’exploitation du périphérique peut générer une erreur de type « échec mémoire » si la mémoire affectée est insuffisante pour les données entrantes. Cette situation peut se produire même si la quantité totale de mémoire disponible est suffisante.

Par exemple, supposons que votre fichier tente de charger un fichier XML de 100 Ko, alors que le système d’exploitation du périphérique n’a affecté que 30 Ko pour la gestion de ce flux de données. Dans ce cas, Flash Lite affiche un message d’erreur indiquant que la mémoire disponible est insuffisante.

Pour charger de grosses quantités de données, il est préférable de les fractionner, par exemple dans plusieurs fichiers XML, et d’exécuter plusieurs appels de chargement. La taille de ces portions de données, et par conséquent le nombre d’appels de chargement des données, peut varier en fonction du périphérique et du fichier. Pour établir un compromis entre le nombre de requêtes de données et les risques d’erreur d’affectation de la mémoire, testez vos fichiers sur différents périphériques cibles.

Pour obtenir des performances optimales, évitez si possible de charger et d’analyser des fichiers XML. Stockez plutôt les données dans de simples paires nom/valeur et chargez les données à partir d’un fichier texte à l’aide de loadVars ou à partir de fichiers SWF précompilés.

Exclusion de classes de la compilation pour Flash Lite

Pour réduire la taille d’un fichier SWF, il peut être nécessaire d’exclure des classes de la compilation, tout en ménageant un accès à ces dernières pour leur exploitation et la vérification du type. Par exemple, cette opération peut être nécessaire si vous développez un fichier qui a recours à plusieurs fichiers SWF ou bibliothèques partagées, notamment celles qui accèdent à de nombreuses classes identiques. L’exclusion de classes permet d’éviter la duplication de classes dans ces fichiers.