L'optimisation des performances CPU est essentielle pour garantir une expérience fluide dans les applications CocosCreator. Cette approche technique se concentre sur l'identification des goulots d'étranglement et l'implémentation de solutions ciblées.

Identification des Problèmes avec l'Outil Performance

Pour diagnostiquer les pics d'utilisation CPU, l'outil Performance de Google Chrome est recommandé. Il permet d'enregistrer le comportement du programme sur une période donnée et d'analyser les images rouges (hot frames) qui indiquent des problèmes de performance. En examinant la pile d'appels de ces frames, il est possible de localiser les fonctions consommatrices de ressources et d'appliquer des optimisations spécifiques.

Amélioration de la Qualité du Code avec ESLint

Les erreurs de syntaxe et les pratiques de codage inefficaces peuvent entraîner une surcharge CPU. L'utilisation d'outils comme ESLint permet de maintenir un code propre et optimisé. Après installation via npm avec la commande npm install eslint --save-dev, initialisez la configuration avec npx eslint --init pour personnaliser les règles selon les besoins du projet.

Contrôle du Taux de Rafraîchissement du Jeu

Séparation des Frames Logiques et de Rendu

Par défaut, les frames logiques et de rendu fonctionnent à 60 FPS. Pour des jeux moins sensibles au temps réel, comme les jeux de cartes, il est avantageux de séparer ces taux. En modifiant la boucle principale du moteur pour utiliser une mise à jour fixe (fixUpdate), on peut réduire les frames logiques à 30 FPS tout en maintenant le rendu à 60 FPS. Cela permet une gestion dynamique, par exemple en augmentant temporairement les frames logiques pour la création d'objets ou en utilisant des algorithmes d'interpolation pour lisser les synchronisations réseau.

Ajustement des Systèmes Physique et de Collision

Les systèmes physique et de collision ont par défaut un taux identique à celui du jeu. Pour réduire la charge CPU, ce taux peut être ajusté via les paramètres du moteur, comme la taille du pas physique. Cependant, une diminution excessive peut entraîner des erreurs de détection, notamment avec des objets rapides. Il est crucial de déterminer la vitesse maximale et la taille minimale des objets pour trouver un équilibre optimal.

Optimisation au Niveau du Code JavaScript

Manipulation des Tableaux

Pour ajouter des éléments à un tableau, l'accès direct à l'index peut être plus efficace que l'utilisation de méthodes comme push(). Par exemple :

let donnees = [];
donnees[donnees.length] = valeur;

Bien que l'amélioration soit modeste, elle est bénéfique dans les fonctions exécutées fréquemment.

Boucles d'Itération

Évitez d'utiliser for-in pour les boucles, car elle est inefficace et non optimisée par les moteurs JavaScript. Préférez des alternatives comme for-of ou forEach :

for (const element of tableau) {
    // traitement
}

Éviter l'Utilisation d'Arguments

La gession des arguments pour simuler le polymorphisme peut être coûteuse en performance. Il est préférable de définir des fonctions distinctes pour différents cas d'utilisation plutôt que de vérifier le nombre d'arguments.

Restriction sur try-catch et eval

Les blocs try-catch et l'utilisation de eval génèrent une surcharge importante. Évitez-les dans les sections critiques du code pour prévenir les baisses de performance.

Gestion des Variables Globales

Pour réduire l'accès aux variables globales, copiez-les dans des variables locales avant utilisation dans des boucles :

let compteurLocal = compteurGlobal;
for (let i = 0; i < n; i++) {
    compteurLocal += i;
}

Cette approche améliore l'efficacité en limitant les recherches de portée.