Vue lecture

Il y a de nouveaux articles disponibles, cliquez pour rafraîchir la page.

Caesium - Un outil multi-facettes pour compresser vos images

Entre screenshots de bugs, memes de geeks et photos de vacances, on échange des tonnes d’images chaque jour, et à cause de nous, les data centers chauffent comme des radiateurs. Alors à chaque fois que vous compressez une image avant de l’envoyer, on peut se dire qu’on participe “un petit peu” à sauver la planète, non ?

C’est pour ça qu’aujourd’hui, je vous présente Caesium, un petit logiciel open source développé par @Lymphatus qui transforme vos images obèses en versions ultra légères, sans que personne ne remarque la différence. L’outil nous promet dans certains cas, des compressions allant jusqu’à 90% avec une qualité visuelle quasiment identique. Et le plus beau dans tout ça, c’est qu’on n’a même pas besoin d’envoyer nos photos à un GAFAM qui fera le boulot.

Tout d’abord, le développeur Caesium est en train de réécrire toute la partie compression (libcaesium) en Rust au lieu du C++ traditionnel et c’est intéressant, parce que Rust fait partie du trio de tête avec C et C++ en termes de performance énergétique, tout en apportant une sécurité mémoire supérieure. Et quand on sait que Caesium traite potentiellement des millions d’images par jour, l’amélioration de la sécurité et de la maintenance est cruciale.

De plus, une image compressée à 90% ne réduit pas seulement sa taille de stockage. D’après les analyses de compression WebP , elle peut diviser jusqu’à 6 fois la consommation énergétique nécessaire à son transfert sur le réseau, avec une réduction moyenne par 2 ou 3 pour les compressions qui conservent le même niveau de qualité. Multipliez ça par les milliards d’images échangées chaque jour, et vous comprenez pourquoi chaque compression compte.

Le truc génial avec Caesium, c’est qu’il existe sous trois formes. La version desktop classique pour Windows/Mac/Linux qui vous permet de traiter vos images en masse, prévisualisation en temps réel comprise.

La version ligne de commande CaesiumCLT pour les barbus qui veulent automatiser leurs compressions dans leurs scripts.

Et la petite dernière, la version web caesium.app qui tourne directement dans votre navigateur. Attention quand même, cette dernière limite à 10 images avec une taille maximale par fichier de 20 MB, mais pour un usage ponctuel, c’est parfait.

En plus, comme je vous le disais, Caesium fait tout en local. Vos photos restent chez vous, y’a pas de compte à créer, pas de limite mensuelle, pas de tracking. C’est efficace et moins cher que gratuit ^^.

Pour l’installer, c’est simple comme bonjour. Sur Mac ou Linux, un petit brew install caesiumclt pour la version ligne de commande, ou téléchargez directement l’installeur sur le site officiel pour la version graphique toute moche. Windows a droit à une version portable, pratique pour l’avoir sur une clé USB. Et si vous voulez juste tester, direction caesium.app dans votre navigateur.

L’utilisation reste ultra intuitive. Vous glissez vos images, vous réglez la qualité (80% par défaut, largement suffisant pour 99% des cas), et hop, Caesium optimise !

Et pour l’outil en ligne de commande, vous pouvez faire de la compression sans perte comme ceci :

# Compresser avec préservation des métadonnées
caesiumclt --lossless -e --keep-dates -o output/ image.jpg

Avec perte comme ceci :

# Compresser plusieurs images avec une qualité spécifique
caesiumclt -q 75 -o output/ image1.jpg image2.png image3.webp

# Compresser avec un suffixe pour éviter d'écraser les originaux
caesiumclt -q 85 --suffix _compressed --same-folder-as-input image.jpg

# Compresser avec un réglage de qualité
caesiumclt -q 80 -o output/ image.jpg

En convertissant les formats comme ceci :

# Convertir les images au format WebP avec réglage de qualité
caesiumclt -q 85 --format webp -o output/ Pictures/*.jpg

Ou en redimensionnant les images :

# Redimensionner à une largeur spécifique (en conservant le ratio d'aspect)
caesiumclt --lossless --width 1920 -o output/ image.jpg

# Redimensionner à une hauteur spécifique (en conservant le ratio d'aspect)
caesiumclt -q 90 --height 1080 -o output/ image.jpg

Le logiciel supporte les formats JPG, PNG et WebP et d’ailleurs en passant, petit conseil… convertissez systématiquement vos PNG en WebP car le WebP offre 30 à 50% de compression supplémentaire par rapport au PNG tout en gardant la transparence. Et comme 95% des navigateurs le supportent maintenant, vous n’avez plus d’excuse !

Bref, Caesium c’est un super outil que vous devez absolument tester. Comme ça, la prochaine fois que vous voudrez envoyer une capture d’écran de 5 MB par mail, pensez à Caesium et votre connexion Internet vous remerciera, ainsi que la planète un petit peu.

Et merci à Ghost5477 qui m’a fait découvrir cette pépite !

Jampack – Boostez votre site statique en deux temps trois mouvements !

Aujourd’hui, je vous parle d’un truc vraiment cool nommé Jampack. En gros, c’est un outil qui prend votre site statique généré par votre générateur préféré (Hugo, Jekyll, Eleventy… y’en a pour tous les goûts !) et qui le transforme en une bête de course optimisée pour une expérience utilisateur de folie et des scores Core Web Vitals à faire pâlir les GAFAM.

Comment ça marche ce truc ? Eh bien, Jampack va scanner votre site et appliquer tout un tas d’optimisations automatiquement. Par exemple, il va :

  • Rendre vos images responsive avec des dimensions et des formats modernes comme le WebP ou l’AVIF. Fini les images qui mettent trois plombes à charger !
  • Mettre la priorité sur les assets importants au-dessus de la ligne de flottaison et lazy-loader le reste. Comme ça, votre site s’affiche direct pendant que le reste charge tranquillou en arrière-plan.
  • Inliner le CSS critique et virer le Flash of Unstyled Content (FOUC). Votre site aura la classe dès les premières millisecondes.
  • Prefetcher les liens pour accélérer la navigation. Vos visiteurs surferont à la vitesse de la lumière sur votre site !
  • Minifier et compresser tout ce qui traîne : HTML, CSS, JS, SVG… Que du bonheur pour votre bande passante.

Et tout ça sans que vous ayez à lever le petit doigt ! Juste un petit

npm install -D @divriots/jampack

et hop, magie, votre site est optimisé de fou.

Bon, vous vous dites peut-être : « Ouais, ok, mais mon site il est déjà pas mal optimisé, hein« . Eh bah, sachez que même les experts de Keycloak.ch, BayJS.org ou CloudCannon.com utilisent Jampack pour squeeze encore plus de perf. Vous pensez vraiment faire mieux ? ^^

Et bien sûr, tout le code est open-source sur GitHub, sous licence MIT. Allez, sur ce, je vous laisse, j’ai un site à optimiser moi. See ya !

A découvrir ici.

Jpegli – La lib JPEG nouvelle génération de Google

Google vient de publier en open source une nouvelle bibliothèque de codage JPEG appelée Jpegli qui permet de compresser vos images 35% plus efficacement qu’avec les codecs JPEG traditionnels, tout en conservant une qualité d’image supérieure.

Non seulement Jpegli est rétrocompatible avec le standard JPEG original, mais en plus il offre des fonctionnalités intéressantes comme le support des composantes 10 bits et plus, ce qui permet d’éliminer les vilains artefacts dans les dégradés pour avoir un rendu beaucoup plus ultra-smooth ^^.

Pour cela, Jpegli utilise de la quantification adaptative et une sélection améliorée des matrices de quantification. En gros, ça réduit le bruit, améliore la qualité d’image, et ça fait des miracles sur la taille des fichiers.

De plus, Jpegli reste aussi rapide que les solutions de codage actuelles, donc vous pouvez intégrer cette merveille dans vos workflows sans sacrifier les performances. Alors voilà, si vous voulez donner un coup de boost à vos sites web et offrir de meilleures images plus belles et plus légères, allez jeter un œil à Jpegli ! Pour le moment, y’a pas encore d’outils de conversion mais les sources sont dispo sur le Github, alors y’a plus qu’à attendre que le monde se l’approprie.

Source

❌