YOGA Image Optimizer v1.1 : Plein de nouveautés pour la rentrée !

La première version publique de YOGA Image Optimizer était sortie mi-juin dernier. Elle contenait ce que je considérais être le « minimum vital » pour pouvoir enfin la partager au monde, mais j'avais encore plein d'idées de fonctionnalités en tête... C'est pourquoi j'ai continué de travailler sur le projet tout l'été, et je peux aujourd'hui vous annoncer la sortie de YOGA Image Optimizer v1.1.0 qui apporte plein de nouveautés et d'améliorations.

Et en parallèle de cette nouvelle version de l'interface graphique j'ai également énormément travaillé sur YOGA, la bibliothèque qui fait tout le boulot d'optimisation dans les coulisses.

Comme vous l'aurez deviné, on va aujourd'hui faire le tour des nouveautés, aussi bien celles de YOGA que celles de YOGA Image Optimizer... C'est parti ! 😁️

Capture d'écran de YOGA Image Optimizer v1.1

Rappel : Qu'est-ce que YOGA et YOGA Image Optimizer ?

Avant de parler des nouveautés, commençons par présenter rapidement le projet pour ceux qui le découvrent avec cet article.

YOGA est une bibliothèque Python et un outil en ligne de commande permettant de convertir et d'optimiser à la fois des images et des modèles 3D. Je le développe dans le cadre de mon travail chez Wanadev.

YOGA Image Optimizer est une interface graphique dédiée à la partie image de YOGA sur laquelle je travaille sur mon temps libre. Je l'ai essentiellement développé pour mes propres besoins mais j'ai essayé de la rendre la plus simple à utiliser pour tout le monde. 😄️

Je ne vous en dis pas plus, vous retrouverez une description plus détaillée et un benchmark complet dans mon précédent article.

Les nouveautés de YOGA v1.1

Pour commencer ce tour d'horizon, on va regarder les nouveautés de YOGA, la bibliothèque qui effectue les optimisations d'image.

Améliorations de l'optimisation des JPEGs

Dans la version 1.0 de YOGA, seule la bibliothèque Guetzli était utilisée pour encoder et optimiser les JPEGs. Dans cette nouvelle version, Guetzli est à présent secondée par MozJPEG pour améliorer encore le taux de compression.

Dans YOGA 1.1, Guetzli s'occupe donc toujours d'encoder et d'optimiser les images JPEGs, et une fois son travail terminé, on applique certaines des optimisations de MozJPEG sur le résultat, ce qui permet de réduire le poids des fichiers de 2,4 % à 7,3 % supplémentaires sur mon échantillon d'image. Il est important de noter que les optimisations de MozJPEG utilisée ici n'entrainent aucune perte de qualité.

Comparaison du poids des JPEGs en sortie de YOGA v1.0 vs YOGA v1.1

Pour les plus curieux d'entre vous, et sans trop rentrer dans les détails, les optimisations de MozJPEG qui sont utilisées sont les suivantes :

  • Passage des images en encodage progressif avec l'optimisation « jpegrescan » de MozJPEG (l'encodage progressif permet des optimisations supplémentaires par rapport à un encodage séquentiel),
  • et optimisation de la table de Huffman.

Pour ajouter ces optimisations à YOGA, une petite bibliothèque Python a été créée pour l'occasion : mozjpeg-lossless-optimization. Si vous avez besoin d'optimiser (sans perte) des JPEGs depuis un programme Python, elle pourrait bien vous être utile. ☺️

Et tant qu'on parle des JPEGs, l'autre amélioration apportée à YOGA pour ce format est la prise en charge de l'orientation. Dans YOGA 1.0, les métadonnées d'orientation de l'image étaient ignorées, ce qui fait que certaines images pouvaient se retrouver couchées en sortie. À présent elles ressortiront dans le bon sens ! 🙃️

Orientation des images JPEG

Améliorations liées au format PNG

Dans la précédente version de YOGA, il se pouvait, dans de rares cas, que l'image de sortie soit légèrement plus grande que celle d'entrées lors d'une optimisation PNG vers PNG. Ceci ne peut à présent plus se produire : les images d'entrée et de sortie feront dans le pire des cas le même poids, et généralement l'image générée par YOGA sera plus petite de quelques octets.

Pour ceux qui voudraient plus de détails techniques, YOGA analyse le résultat obtenu, et s'il est moins optimal que ce qu'il y avait en entrée, il va aller récupérer les chunks essentiels de l'image d'origine (IHDR, PLTE, tRNS, IDAT et IEND) et effectuer quelques traitements sur certains d'entre eux. Les chunks IDAT seront notamment concaténés afin de grappiller les quelques octets de leurs entêtes, puis le tout sera recompressé à l'aide de Zopfli.

Autres changements

Voici, en vrac, quelques autres changements apportés à YOGA :

  • Python 2.7 n'est plus supporté, YOGA v1.1 ne fonctionnera donc plus sur cette version (les nombreux hacks permettant la compatibilité ont été supprimés). Il vous faudra à présent Python 3.7 minimum pour faire fonctionner YOGA.
  • Lorsqu'on lançait une optimisation via la ligne de commande de YOGA v1.0, il n'était pas possible d'annuler le travail en cours via la combinaison de touche Ctrl+C. Une modification a été apportée à la CLI pour permettre à cette combinaison de touche de couper les traitements en cours. Il est toutefois à noter que cela ne semble pas fonctionner dans tous les cas de figure sous Windows.
  • Enfin, le message d'aide que l'on obtient via la commande yoga --help a été améliorer pour faciliter la prise en main de YOGA.

Les nouveautés de YOGA Image Optimizer v1.1

Passons à présent aux améliorations de YOGA Image Optimizer, l'interface graphique dédiée à la partie « image » de YOGA.

Configuration

YOGA Image Optimizer est maintenant configurable, et une interface de configuration a donc logiquement fait son apparition. Elle est accessible via « Préférences ».

Capture d'écran de la fenêtre des préférences

Dans la première version du logiciel, deux images étaient optimisées en parallèle, quel que soit le nombre de processeurs disponibles. Ceci est à présent configurable au travers de l'option « Nombre de threads ». Il est toutefois important de noter qu'il est préférable d'éviter de définir un nombre de threads supérieur au nombre de processeurs ou de cœurs disponibles, vous surchargeriez votre machine et ça serait donc contre-productif. 😉️

La seconde série d'options concerne l'interface du logiciel. Il est possible d'y choisir l'apparence (le thème), et d'indiquer à YOGA Image Optimizer d'utiliser de préférence la variante sombre du thème, lorsqu'elle est disponible.

Exemple de thèmes GTK

Enfin, il est possible de choisir quel sera le nom par défaut des images en sortie de YOGA Image Optimizer.

  • La première option correspond au fonctionnement de la v1.0 : le fichier est placé à côté de l'original et est suffixé avec « .opti » (exemple : « image.png » → « image.opti.png »).

  • La seconde option permet d'enregistrer le fichier de sortie sous le même nom que le fichier d'entrée, mais dans un dossier nommé « optimized/ » (exemple : « image.png » → « optimized/image.png »).

  • Et la dernière option permet de choisir un motif personnalisé. Ce motif accepte deux variables :

    • {FILENAME} : le nom du fichier d'entrée sans son extension (exemple : « image » si le fichier d'entrée se nommait « image.png »),
    • {EXT} : l'extension du fichier de sortie (dépends du format sélectionné).

    Je vous donne un petit exemple pour que ça soit plus clair. Si le motif personnalisé est défini à « optimized/{EXT}/example_{FILENAME}.{EXT} », alors une image d'entrée nommée « image.png » sera enregistrée sous le nom « optimized/png/example_image.png » une fois optimisée.

Ces options de nommage sont également accessibles depuis l'interface principale pour renommer une ou plusieurs images directement.

Capture d'écran du menu de renommage

Quand on dit stop, c'est stop !

Dans la première version de YOGA Image Optimizer, le bouton « Arrêter », qui apparait en haut de la fenêtre lorsqu'une optimisation est en cours, ne pouvait qu'annuler les optimisations en attente mais n'était pas en mesure de réellement stopper celles en cours, qui continuaient alors en arrière-plan (donc le processeur continuait à tourner à 100 % et il n'était pas possible de quitter l'application).

Ce problème était dû a une limitation de l'API concurrent.future de Python, qui ne fournit aucun moyen de réellement couper un thread ou un processus. J'ai donc travaillé à contourner cette limitation en implémentant une version personnalisée du ProcessPoolExecutor par-dessus celle d'origine.

À présent, lorsque l'on clique sur le bouton « Arrêter », les processus d'optimisation qui sont lancés en arrière-plan sont bel et bien stoppés, ce qui correspond au comportement désiré. 😁️

Bouton permettant d'arrêter les optimisations en cours

Et tant qu'on parle des optimisations, voici deux petites améliorations qui ont également été apportées à cette partie :

  • Lorsque l'on clique sur le bouton « Arrêter », les optimisations en cours et en attentes sont maintenant marquées comme ayant été annulées.

    Images dont l'optimisation a été annulée
  • Lorsque l'on clique sur le bouton « Optimiser », seules les images n'ayant pas déjà été optimisées seront traitées (pas la peine de refaire du travail déjà fait). Bien sûr, si jamais des paramètres sont modifiés sur une image (format de sortie, qualité, redimensionnement,...), celle-ci sera de nouveau optimisée puisque le résultat attendu change.

Redimensionnement des images

Bien que YOGA permettait déjà de réduire les dimensions d'une image, cette fonctionnalité n'était pas disponible dans la première version de l'interface graphique. Mais ça, c'était avant ! YOGA Image Optimizer v1.1 permet à présent de redimensionner les images, c'était une fonctionnalité très attendue !

Capture d'écran : option de redimentionnement des images

La fonctionnalité de redimensionnement de YOGA permet uniquement de réduire la taille d'une image (jamais de l'augmenter), et elle préserve dans tous les cas les proportions de l'image (pas de déformation).

Les dimensions renseignées dans l'interface graphique peuvent être vues comme « une boîte » dans laquelle on fera rentrer l'image. Ainsi, si vous rentrez « 256 × 256 px », la largeur de l'image fera 256 px au maximum, et il en va de même pour sa hauteur.

Schéma du fonctionnement du redimentionnement des images

Multisélection

La précédente version du logiciel ne permettait de sélectionner qu'une seule image à la fois, et il fallait donc modifier les paramètres des images une par une... ce qui n'est pas très pratique lorsque l'on a un lot d'image à traiter. 😅️

Cette nouvelle version ajoute donc la possibilité de sélectionner plusieurs images, et bien sûr d'éditer leurs paramètres en une seule fois (seuls les paramètres modifiés seront appliqués à l'ensemble des fichiers sélectionnés).

Pour utiliser la multisélection, vous pouvez soit maintenir la touche « Ctrl » en cliquant sur les images, soit utiliser « Shift » pour sélectionner un intervalle, soit faire glisser la souris (sélection par zone à l'aide d'un rectangle de sélection)... Bref ça se passe comme dans n'importe quel navigateur de fichier graphique digne de ce nom. 😉️

Démonstration de la multisélection

Traductions

Concernant les traductions, cette nouvelle version de YOGA Image Optimizer est bien sûr disponible en anglais, mais a également fait l'objet d'une traduction intégrale en français et en occitan. Des traductions partielles en italien et en turc sont aussi présentes.

Lors de la sortie de la v1.0, j'avais ajouté la possibilité de traduire l'application sur Launchpad mais j'ai finalement dû supprimer cette option, car Launchpad n'arrivait pas a synchroniser la branche Git du projet pour en récupérer les traductions... Il est actuellement possible de proposer des traductions sur Github via des pull requests, mais il faudra que je trouve une autre solution pour rendre tout ça plus accessible aux non-développeurs.

Le mot de la fin

Lorsque j'ai publié pour la première fois à propos de ce projet avant les vacances d'été, j'ai reçu énormément de retours, de remarques, d'astuces pour l'optimisation des images, de suggestions de bibliothèques ou d'outils à étudier, etc. Je souhaite donc profiter de cet article pour remercier toutes les personnes qui ont pris le temps de me laisser des commentaires sur LinuxFR, sur Reddit, ou sur Discord, ça m'a beaucoup aidé !

J'apprécie beaucoup travailler sur YOGA, et je ne vais donc pas m'arrêter là ! Pour ce qui est de l'interface graphique, elle dispose à présent de la plupart des fonctionnalités que je souhaitais, elle va donc assez peu évoluer dans les prochains mois. Pour ce qui est de YOGA (la bibliothèque) par contre, j'ai plein, PLEIN, de choses à faire dessus et plein d'idées d'améliorations.

Je pense notamment à améliorer encore la compression PNG en ajoutant des options de compressions à perte (à l'aide de pngquant notamment). Je souhaite aussi continuer a travailler sur le format WebP pour lequel YOGA n'offre pas d'optimisations aussi poussées que je le souhaiterais. Enfin, je voudrais ajouter le support de nouveaux formats d'images, tels que l'AVIF et le JPEG XL.

J'espère en tout cas ce YOGA Image Optimizer pourra vous être utile. Si vous souhaitez l'utiliser, vous trouverez toutes les informations sur son site web :

N'hésitez pas à me laisser un commentaire où à me contacter si vous avez des idées ou des suggestions pour améliorer le logiciel. À bientôt (j'espère) pour de nouveaux articles ! 😉️