Skip to main content

Home/ Web Performance/ Group items tagged image

Rss Feed Group items tagged

Mehdi Kabab

PunyPNG - PNG Compression and Image Optimization - Gracepoint After Five - 2 views

  •  
    PunyPNG first analyzes the content of your image and figures out the best image format to use.
Mathieu Pillard

Script optimisation PNG - 2 views

  •  
    Le script est basique, j'ai déjà une version plus complexe gérant plusieurs formats mais je ne connaissais pas du tout (ou alors je l'ai oublié :) advdef, à tester.
  • ...6 more comments...
  •  
    Comme je suis chiant moi j'ai repassé ton image à pngnqi (http://pornel.net/pngnq, sous linux mieux vaut rester sur le pnqnq "normal", les sources sont à jours avec le pngnqi). Je suis tombé à 7397 octets (8321 octets pour l'original). C'est toujours un peu magique pour moi les outils d'optimisation d'image, très vaste comme sujet.
  •  
    pngnq il ne fait pas une quantification et donc une modification de la qualité de l'image ? Peut être que visuellement elle n'est pas impactante, mais si c'est le cas ce n'est pas un outil utilisable en automatique et d'un coup le bénéfice/cout par rapport à optipng devient assez faible
  •  
    oulà, je n'avais pas encore vu le lien, faire tourner pngcrush + optipng + advpng, ça fait lourd en cpu. Est-ce que vraiment le gain par rapport à un optipng (qui normalement fait tout ce que fait pngcrush) vaut le coup ? Quand j'avais tenté tous mes tests sur différents outils et différents paramètres, j'étais revenu à la raison : le surcout par rapport au optipng avec les options par défaut vaut rarement les différence de taille au résultat
  •  
    Pour utilise pngnq en automatique, il faut contrôler le nombre de couleurs dans l'image, car si on lui passe un png24 il en fait un png8. En gros en dessous de 2500 couleurs, on peut tranquilement passer à un png8. Bien sûr il faut faire des vérifications derrière. Trop souvent on utilise du png24 là où on devrait utiliser du png8. Png8 sait faire la transparence alpha (IE6 ne la comprends pas = pixel transparent mais pas un pâté gris comme sur le png24). Il faudra que j'expose mon programme nodejs qui fait tous ces contrôles et est paramétrable Voir http://zeroload.net/blog/zeroload%20latest%20achievements%20in%20web%20performance%20%28with%20details%29/
  •  
    Eric > Je ne comprends pas, ou plutôt je fais semblant de ne pas comprendre . Pourquoi le temps CPU pour optimiser les images est t'il si important ? Tu as déjà été confronté à des traitements supérieur à plusieurs jours (même parallélisés) ? Trois cas possible d'optimisation : 1. Optimiser par l'intégrateur (cas idéal) 2. Au moment de l'upload 3. Traitement par lot , en tâche de fond, N date / heure précise Dans le deuxième cas, mise à part des png supérieur à 3 - 4 mo, l'optimisation même maximum ne devrait pas poser de problème , si ? Dans le troisième cas, il y a toujours moyen de basculer les calculs pendant les heures creuses, voir d'utiliser temporaire des serveurs pour générer les nouveaux média (png, jpg). Une fois le média optimisé au maximum on n'y revient pas. Je dois probablement sous-estimer les temps de calculs, a t'on un ordre d'idée (Tps de calcul / Taille du png) ?
  •  
    Les temps se calculent en minutes (donc quelques heures pour traiter un lot). Ce n'est pas tant le cpu en lui même, c'est que ça peut différer une mise en production, et que toutes les boites n'ont pas une machines qui pourrait faire ça. Oui, je sais bien que trouver quelques heures de CPU devrait être ridicule, mais ça nécessite dans pas mal de boites d'allouer une machine spécifique, et ça ce n'est pas si anodin que ça (même si c'est crétin). Et oui, normalement les releases sont prévues à l'avance, surtout les éléments graphiques, mais en pratique ce n'est pas aussi bien fait et devoir lancer un traitement de quelques heures c'est ultra pénible. Mais surtout, quand la différence avec un simple optipng est de moins de 10Ko sur une page, au final ça ne vaut pas le coup de lancer une grosse automatisation et laisser l'outil sur le poste de l'intégrateur web (où le temps cpu ça compte) suffit largement.
  •  
    Pour information, lorsque j'ai du intégrer un traitement par lot, il y avait 45000 images. Donc optimiser toutes les images lors de la mise en production c'était du suicide. Dans leur cas c'était un traitement critique car en gros après traitement la page était moitié moins lourde (sachant qu'une page classique sur leur site c'était 500ko ..) Le traitement prenait environ 4 heures, sauf que, rien n'empêche de faire du différentiel, c'est ce que j'ai fais et ça va très vite à chaque mise en production il n'optimise que les nouvelles images. Bon si vous avez des millions d'images c'est autre chose, il faut une méthode plus fine.
  •  
    J'arrive après la bataille mais: Vincent: oui en fait, dans le reste de la discussion yavait mention de pngnq, j'ai juste choisi de ne parler que de ce commentaire la, parce-qu'il parlait de advdef, que je ne connaissais pas/plus. J'ai déjà eu des surprises avec pngnq, du coup je l'utilise uniquement à la mano, en vérifiant après coup la différence entre l'image d'origine et l'image optimisée (merci python + PIL) Eric: justement ce thread m'a donné envie de retester. Le temps CPU pour moi c'est peanuts, j'ai pas des millions d'images, ca prend 1 min max à chaque fois et ca peut être fait en hook post-commit sur le gestionnaire de sources.
Éric D.

Images, PNG et GIF - Performance web - 0 views

  •  
    Et si on parlait un peu des images ? du point de vue des performances web, toujours.    Sur un site classique comme TF1, Amazon, LeMonde, on dépasse les 100 images sur la page d'accueil, pour un total de près de 300ko. Les sites plus au fait des problèmes de performance ont entre 30 et 50 images mais le poids total est encore souvent supérieur à 100ko.
Éric D.

optimiser-images-web.pdf (Objet application/pdf) - 0 views

  •  
    Très bon résumé sur l'optimisation des images
  •  
    Très bon résumé sur l'optimisation des images
  •  
    Très bon résumé sur l'optimisation des images
Maurice Svay

JPEG with Alpha - 1 views

  •  
    Proposition pour embarquer l'alpha dans un fichier JPEG
  •  
    j'espère que ça restera vraiment une "expérience", utiliser canvas, javascript, css pour afficher une image transparente, avec ces inconvénients : # By default, the images load without their alpha, then get alpha'd causing a flash. This can be worked around by making them invisible until correctly loaded. # The image must reside on the same server as the web page or the cross site scripting prohibitions in AJAX will come into play. # My examples are double loading the image, for some reason the AJAX fetch is not using the cache. I don't know why, but it is probably just me. ça reste un affreux bricolage qui pourrait donner des envies à des gens qui n'y connaissent rien et pourrir des sites avec ça. Mais l'expérience est "amusante" de là à en faire une "proposition", j'ai des doutes
  •  
    C'est clair qu'afficher l'alpha avec canvas+js reste du bricolage. En revanche, si les implémenteurs arrivent à se mettre d'accord pour le faire directement dans le navigateur, ça pourrait être intéressant.
Oncle Tom

Retina revolution - 9 views

  •  
    On fait quoi avec Retina et HiDPI ? On propose une image à résolution plus importante alors qu'on s'est battu des mois à améliorer les performances de nos sites Web ? Comparatif de compressions et de rendus pour haute densité … et où l'on peut constater que cette réduction de poids sera plus efficace et simple à gérer qu'une multiplication des résolutions d'image.
  •  
    L'approche est maligne mais me dérange sur quelques aspects : 1. Si elle vient à se populariser on va se retrouver avec un Web remplies d'images de qualité médiocre uniquement exploitable sous forme de miniatures. En outre, nous pourrons faire une croix sur les recherches d'images ciblées par dimensions. 2. La contribution par des utilisateurs lambdas ne sera pas aisée de par la validation du rendu après réduction du visuel. 3. Quid de l'automatisation ? Les images présentées dans les exemples de Daan sont de qualité studio et supportent parfaitement le traitement. Enrichir le billet par des photos de moindre qualité serait intéressant.
Samuel Martin

Comparatif web performance des candidats 2012 - les images - Creaone.fr - 2 views

  •  
    ImagePicker et ImageOptim sont présentés ; pour récupérer et optimiser les images.
Laurent Paoletti

Poor Choices are Ruining the Web | Zoompf - 4 views

  •  
    A recent article by John Naughton has sparked a debate inside the web design and web development community. Are designers, with their image heavy designs, ruining the web? The answer is yes, but its not why you think. It's not because designers use big images or even that they use a lot of images.
Mehdi Kabab

Trimage (lossless) image compressor - 8 views

  •  
    Interface visuelle (GUI) permettant de compresser plusieurs images, PNG et JPG. Ce programme, utilisable également en CLI, se base sur optipng, advpng et jpegoptim.
  • ...4 more comments...
  •  
    Outils peu convaincant. L'outil conserve toujours le fichier compressé même si ce dernier est supérieur en taille.
  •  
    Dommage :-/ ça automatise une partie du taf déjà.
  •  
    Mouai, Eric n'a probablement pas fait de test, mais de mon côté mieux vaut utiliser à la main les outils "optipng, pngout, deflopt avec options" on obtient de bien meilleurs résultats. L'intérêt de l'outil réside dans l'interface à la limite
  •  
    Non, je n'ai pas fait de test. Par contre j'ai vu que la correction du bug soulevé par Samuel est prévue. Après attention, on peut toujours obtenir de meilleurs résultats à la main avec ce genre d'outils, mais parfois au prix d'un temps cpu démesuré. Le propre de ces outils c'est de choisir des valeurs raisonnables et optimale pour le compromis efficacité/temps. Pour moi l'intérêt c'est surtout que c'est "déjà fait", donc pas besoin de chercher les bons paramètres pour le compromis optimal, de faire appel à image magik pour savoir quel outil utiliser en fonction du format et du nombre de couleurs, et de scripter tout ça soi même : c'est déjà fait. J'apprécie aussi qu'ils aient prévu une gui *et* une cli pour le même outil. C'est assez sympa.
  •  
    Il y a aussi http://phpied.com/files/yuicd/ a suivre, déjà essayé pour recompresser rapidement des png et le résultat est très bon à chaque fois.
  •  
    A cross-platform tool for losslessly optimizing PNG and JPG files. Inspired by ImageOptim.
Éric D.

Optimisation JPEG - Performance web - 0 views

  •  
    Je vous avais rapidement parlé de pngcrush pour optimiser les images PNG, sans aucune perte de qualité. Stoyan Stefanov nous propose jpegtran dans sa dernière présentation sur l'optimisation des images.
Samuel Martin

Adaptive Images in HTML - 3 views

  •  
    Petite résolution d'écran = Chargement de petites images
  •  
    Je bookmarke, mais impossible de tester avec l'iphone, le site délivré est différent. J'ai tenté de charger le site de démo dans un navigateur avec une faible dimension, c'est toujours l'image la plus grande qui est chargée. Cela se base donc sur la résolution écran et non la résolution navigateur. A confirmer.
Éric D.

optimiser-images-web.pdf - 0 views

  •  
    Très bon résumé sur l'optimisation des images
anonymous

Media Query & Asset Downloading Results - TimKadlec.com - 1 views

  •  
    Media Query & Asset Downloading Results A little while back, I mentioned I was doing some research for the book about how images are downloaded when media queries are involved. via Pocket
anonymous

PNG and JPG Optimizers - 2 views

  •  
    "ScriptPNG is a PNG optimizer for Windows 32 bits. It reduces files size by parallel processing, with differents levels of compression. It converts GIF, BMP, JPG, PCX, or TGA to PNG. ScriptJPG is a JPG optimizer for Windows 32 bits. It reduces files size with a lossless process or with differents lossy methods - those methods also reduce image quality."
Samuel Martin

rflynn/imgmin - 1 views

  •  
    Imgmin applies established best practices and statistical means toautomatically optimize JPEG filesize for each unique image without sacrificing quality, resulting in significant site-wide latency reduction and bandwidth savings which improves user experience and saves money.
  • ...1 more comment...
  •  
    dommage que l'outil ne sache pas compresser différemment plusieurs parties d'une même image !
  •  
    1. Est-ce automatisable ? 2. Le gain est t'il réellement intéressant ?
  •  
    1. oui, de la même manière que imgmin arrive à automatiser la recherche du meilleur taux de compression global... 2. oui également, c'est la technique utilisée par http://www.jpegmini.com, juge par toi-même.
Oncle Tom

Replacing the -9999px hack (new image replacement) - 5 views

  •  
    Une nouvelle technique pour masquer du contenu sans utiliser le fameux `left: -9999px`. Principal avantage : le navigateur n'a pas besoin de dessiner une boîte énorme pour y placer ce contenu.
Oncle Tom

pngquant Home Page - 0 views

  •  
    pngquant 2 applies vector quantization algorithm to optimise image colour palette with the least amount of loss as possible.
1 - 20 of 136 Next › Last »
Showing 20 items per page