🧰 UtlKit

Comment Utiliser le Compresseur d'Images : Re-encodage JPEG de Qualité 10 à 95 depuis un Fichier Local, dans le Navigateur

Une image locale, re-encodée en JPEG avec une qualité de 10 à 95 sur un canvas, avec l'écart de taille lu sur une estimation de longueur base64, le tout calculé dans le navigateur.

Le Compresseur d'Images lit un fichier d'image local, le ré-encode en JPEG sur un canvas et montre la variation de taille avant que vous ne téléchargiez quoi que ce soit. Vous choisissez le fichier avec le sélecteur, la page le dessine dans ses dimensions d'origine et le canvas le ré-encode à la qualité du curseur, qui est à 70 par défaut. La lecture imprime ensuite la taille originale, la taille compressée estimée et le pourcentage, par exemple 2,400,000B → 833,351B (-65%), et un aperçu côte à côte montre l'original à côté du résultat. Tout est un appel de canvas dans le navigateur : les octets du fichier ne quittent jamais l'appareil et aucun envoi n'a lieu à aucun moment.

Que la boîte reçoit et ce qu'elle rend

L'entrée est un seul champ de fichier qui accepte des fichiers d'image et ne demande rien d'autre. La taille originale est le nombre exact d'octets du fichier sur le disque, donc la moitié gauche de la lecture est précise. La sortie est toujours un JPEG : le canvas remet ses pixels à l'encodeur JPEG du navigateur, le format de sortie est fixé et non sélectionnable, et la largeur et la hauteur restent exactement celles de l'entrée. Le seul réglage est le curseur de qualité, qui va de 10 à 95 par pas de 5, soit 18 positions, et le déplacer ré-encode sur le champ l'original conservé, de sorte que la lecture et l'aperçu se mettent à jour en direct. Quand la taille vous convient, le bouton de téléchargement écrit le résultat sur votre disque sous le nom compressed.jpg ; le fichier que vous sauvegardez est la vérité pour le nombre réel d'octets.

Pourquoi la sortie est toujours un JPEG

Le ré-encodage est un seul appel de canvas dont le type de sortie est réglé sur JPEG, donc un PNG entre et un JPEG sort, un WebP entre et un JPEG sort, et un GIF entre et ne garde que sa première image, car l'élément image ne décode que la première image d'un fichier animé. Le format fixé a deux conséquences. D'abord, le JPEG n'a pas de canal alpha, donc un PNG transparent ne reste pas transparent : les pixels transparents sont composés sur du noir avant l'encodage, et le fichier que vous téléchargez a du noir là où l'entrée avait de la transparence. Ensuite, l'outil utilise le propre décodeur du navigateur sans plan B, donc un format que le navigateur ne sait pas décoder, comme le HEIC sur la plupart des plateformes, ne termine simplement jamais de décoder et la page n'affiche rien pour lui.

Comment la taille est lue

La taille compressée est une estimation, et délibérément simple. Le canvas renvoie une URL de données, un préfixe de 23 caractères, data:image/jpeg;base64,, suivi de base64, et la page prend la longueur de la chaîne entière et la multiplie par trois quarts, car le base64 emploie quatre caractères pour chaque trois octets. Cette estimation dépasse le nombre réel d'octets du seul fait du préfixe, ce qui donne 17 à 19 octets de trop : un JPEG d'un million d'octets se lit 1,000,019B et un de 999,999 se lit 1,000,016B. Sur un passage complet, un fichier de 2,400,000B dont la sortie de l'encodeur fait 833,333 octets imprime 2,400,000B → 833,351B (-65%) ; le pourcentage est arrondi, donc le nombre affiché et l'arithmétique exacte peuvent différer d'un point.

Quand le fichier grossit

Le pourcentage d'économie est l'arrondi d'un moins la taille compressée sur la taille originale, fois cent, et un résultat négatif s'affiche avec un signe plus, donc un fichier qui a grossi est signalé comme, par exemple, 45,000B → 47,018B (+4 %). Cela arrive pour de petites images, où domine la charge fixe de l'encodeur, pour un JPEG déjà compressé à une qualité égale ou inférieure à celle choisie, et toujours quand le curseur est au-dessus de la qualité à laquelle l'original a été enregistré. Le sens n'est pas un défaut : à 10 la sortie est la plus petite qu'elle sera et à 95 la plus grande, donc si la lecture monte quand on monte la qualité, l'original était déjà plus fin que ce que l'encodeur veut faire.

Où vont les pixels

Le fichier est lu par FileReader comme une URL de données dans la page, et le seul calcul est le dessin sur canvas plus l'encodage JPEG, donc les octets ne quittent jamais l'appareil et aucune requête réseau n'a lieu à aucun moment. Il n'y a pas non plus de persistance : la page garde l'URL de données seulement pendant qu'elle est ouverte, il n'y a ni historique ni cache, et fermer ou recharger l'onglet jette l'image et le résultat. Le seul artefact qui peut quitter l'appareil est le compressed.jpg que vous choisissez de télécharger, et c'est vous qui choisissez.

De quoi il ne s'agit pas

L'outil garde les dimensions de l'entrée telles quelles, donc ce n'est pas un redimensionneur ; changer la taille en pixels, c'est le travail du Redimensionneur d'Images. Ce n'est pas non plus un convertisseur de formats, parce que la sortie est fixée à JPEG ; choisir le format de sortie, c'est le travail du Convertisseur d'Images. Il ne lit ni n'affiche les métadonnées du fichier, que montre la Visionneuse d'informations d'image, et il ne recadre pas ; pour ça, voyez le guide de recadrage.

Outils Associés

Questions Fréquentes

Le Compresseur d'Images envoie-t-il mon image vers un serveur ?

Non. Le fichier est lu par FileReader comme une URL de données dans la page, et le seul calcul est le dessin sur canvas plus l'encodage JPEG, donc les octets ne quittent jamais l'appareil et aucune requête réseau n'a lieu. La seule chose qui peut partir est le compressed.jpg que vous choisissez de télécharger.

Pourquoi la transparence de mon PNG a disparu et l'arrière-plan est-il noir ?

La sortie est toujours un JPEG, et le JPEG n'a pas de canal alpha. Avant l'encodage, les pixels transparents sont composés sur du noir sur le canvas, donc le fichier que vous téléchargez a du noir là où l'entrée avait de la transparence. Il n'y a aucun réglage qui garde la transparence, parce que le format de sortie est fixé.

Pourquoi la lecture de taille diffère-t-elle de quelques octets du fichier téléchargé ?

La lecture est une estimation : la longueur de l'URL de données, un préfixe base64 de 23 caractères plus le corps base64, fois trois quarts, arrondie. Le préfixe seul pousse le nombre 17 à 19 octets au-dessus du décompte réel. Le fichier que vous téléchargez est encodé directement depuis le canvas, donc c'est la vérité ; traitez la lecture comme un aperçu de même forme, pas comme une promesse exacte à l'octet.

Pourquoi mon fichier compressé est-il plus gros que l'original ?

Le pourcentage d'économie peut devenir négatif, et un résultat négatif s'affiche avec un signe plus, par exemple 45,000B → 47,018B (+4 %). Cela arrive pour de petites images, où domine la charge fixe de l'encodeur, pour un JPEG déjà compressé à une qualité égale ou inférieure à celle choisie, et toujours quand le curseur est au-dessus de la qualité à laquelle l'original a été enregistré. À 10 la sortie est la plus petite et à 95 la plus grande, donc la lecture peut monter quand on monte la qualité.

Quelle qualité dois-je choisir ?

Le curseur a 18 positions, de 10 à 95 par pas de 5, et il est à 70 par défaut. Le déplacer ré-encode sur le champ l'original conservé, donc la lecture et l'aperçu se mettent à jour en direct ; choisissez la qualité la plus basse où l'aperçu a encore une bonne tenue pour l'usage que vous ferez de l'image, et vérifiez la lecture de taille à cette position.

Articles Associés