Optimisation de GLB animés : une étude de cas avec CesiumMan

Quel gain obtient-on en réduisant les échantillons d'animation ou les triangles après la compression ? Nous avons testé CesiumMan, un personnage public à déformation squelettique, pour évaluer ces choix séparément. Meshopt a permis d'économiser l'essentiel des octets ; réduire la fréquence d'échantillonnage de l'animation a apporté très peu de gain supplémentaire.

Le modèle et les conditions du test

Le GLB source pèse 438,044 octets et contient 4,672 triangles, une animation et un squelette de déformation de 19 articulations. Nous avons exécuté gltfpack 1.3 natif sous Windows le 2 octobre 2026. Chaque export est parti du même original. Les textures ont conservé leur format d'origine ; les nœuds nommés, les matériaux nommés et les données extras ont été préservés. L'échantillonnage de l'animation est resté à la valeur par défaut de 30 FPS, sauf pour l'essai à 15 FPS.

Source et licence du modèle · Télécharger les mesures et l'empreinte du fichier source

Comparez le fichier entier, pas seulement le nombre de clés

Ici, les clés d'animation désignent la somme des nombres d'éléments des accesseurs d'entrée de tous les échantillonneurs d'animation, et non des poses distinctes ou des images rendues. Tous les fichiers produits conservent une animation et 19 articulations du squelette de déformation. Ces nombres ne prouvent pas que les temps, les transformations ou la déformation sont inchangés.

Ce que chaque modification a apporté

Meshopt a réduit l'original de 52.6% sans demander de réduction des triangles. Même l'export conservateur a modifié les données d'animation : son nombre de clés est passé de 2,736 à 1,205. Conserver tous les triangles n'est pas un réglage sans perte.

À 15 FPS, le nombre de clés a encore presque été divisé par deux, mais le fichier ne pesait que 1,528 octets de moins que l'export Meshopt à 30 FPS : une économie de 0.74%. Pour ce modèle, nous conserverions 30 FPS, sauf si une vérification distincte du mouvement justifiait une fréquence inférieure. Moins de clés ne signifie pas une réduction du même pourcentage pour le fichier entier.

L'objectif de 50% des triangles a été atteint exactement : 2,336 triangles. Cela a permis d'économiser 13,972 octets, soit 6.72%, par rapport à Meshopt seul. Activer la simplification agressive avec ce même objectif a produit la même taille en octets et le même nombre de triangles dans ce test ; cela n'a donc apporté aucun gain de taille ici. Ce résultat n'est pas généralisable aux autres maillages.

Examinez la même pose, puis le mouvement

Ces rendus utilisent la première animation à 0.5 seconde, la même caméra et le même éclairage, ainsi que Three.js 0.180.0. Les textures restent visibles et le personnage conserve sa silhouette générale dans cette vue. Une image fixe ne peut pas établir la qualité du mouvement ni révéler toutes les erreurs de déformation ; examinez les coudes, les genoux et la transition de boucle dans votre propre visualiseur.

Il existe aussi une différence de durée : Three.js indique 2.0000 secondes pour le clip source, environ 2.0083 secondes pour les exports à 30 FPS et 2.0417 secondes pour l'export à 15 FPS. Si votre application synchronise des actions avec la durée du clip, testez cette intégration plutôt que de supposer que les temps d'origine ont été préservés.

Reproduire les exports

Utilisez le GLB source comme input.glb pour chacune des commandes ci-dessous. Ces commandes correspondent aux options du site. Les fichiers produits avec Meshopt nécessitent un décodeur compatible, et les fichiers optimisés nécessitent aussi la prise en charge de la quantification de la géométrie.

gltfpack -i input.glb -o conservative.glb -kn -km -ke
gltfpack -i input.glb -o meshopt.glb -cc -kn -km -ke
gltfpack -i input.glb -o fps15.glb -cc -af 15 -kn -km -ke
gltfpack -i input.glb -o half.glb -si 0.5 -cc -kn -km -ke

Notre choix de départ pour cette ressource serait Meshopt à 30 FPS en conservant tous les triangles. Envisagez la version avec moitié moins de triangles lorsque le coût de la géométrie compte et que les vérifications de déformation sont satisfaisantes. Ces mesures portent sur un seul petit personnage ; elles ne mesurent ni le temps GPU, ni la vitesse de chargement, ni la fidélité de l'animation sur différents appareils.

Modèle : CesiumMan, © 2017 Cesium, sous licence CC BY 4.0. Les rendus montrent nos versions dérivées optimisées à côté de l'original. Le logo Cesium fait toujours partie du modèle ; les droits sur les marques sont distincts. Cesium n'a approuvé ni ce site ni cette comparaison. CC BY 4.0 · Avis relatif aux marques

Charger des modèles gltfpack dans Three.js → · Réduire les polygones d'un GLB avec gltfpack →