Group items tagged

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.

Statistiques sur les pages moyennes (nombre de requêtes, de domaines, poids, etc.)

l'équivalent en fonctionalités de webpagetest.org, mais pour surveiller les smartphones

Outil de test de performance pour mobiles (simule un mobile Android ou iPhone pour l'instant). Indique les temps de chargement et le poids total ; optionnellement une vidéo de chargement et une capture d'écran.

Pourquoi créer 2 sites différents pour le mobile et le desktop (toujours pas de traduction/adaptation potable en français ?). Principalement pour des raisons techniques, d'expérience utilisateur et de performance (poids d'images, structure de page, usage adapté).

Si l'article le mérite on peut toujours ouvrir un Google Doc et essayer de traduire à plusieurs s'il y a des gens motivés. Eric pourrait même publier la traduction sur son blog. Perso j'ai déjà une traduction sur un long article UX en cours.

Petite appli en ligne pour générer son propre framework Javascript, basé sur votre propre sélection de librairie, de JSON2 à Spine en passant par Ender. Les tailles sont indiquées et les librairies choisies le sont en particulier pour leur robustesse et faible empreinte mémoire.

J'ai assisté à la présentation de Zepto à la JSConf Ce micro framework permet d'avoir une API compatible avec jQuery, mais utilisant directement les implémentations native de webkit. Il est destiné à fonctionner sur les plateformes iOS et Android avec un poids de 4 Kb contre 31 Kb pour jQuery

Excellent, merci Alexandre pour cette précision. Comptent-ils pousser la compatibilité vers d'autres navigateurs ? En tous cas, combiné avec yepnope (pour le polyfill), ça peut être super pour construire ses dépendances à poids mini.

"Web FontFonts speak many languages, but most of the time you only need a select few. Removing the letters you don't need can greatly reduce the font file size to make your websites faster, optimize bandwidth usage, and reduce high-traffic costs. "

"Scour is an open-source Python script that aggressively cleans SVG files, removing a lot of 'cruft' that certain tools or authors embed into their documents. The goal of scour is to provide an identically rendered image"

"CryoPNG est donc en gros comme PunyPNG ou ImageOptim mais en plus costaud. C'est une simple interface graphique pour de puissants scripts qui eux utilisent pngout, cryopng, huffmix, defluff..."

entre 2008 et 2010 : - un peu plus de sites appliquent les règles de perf frontend de base - les sites ont pris en poids et en complexité - du coup la performance globale est en baisse

Aujourd'hui je fais réviser les bases avec Yslow. Il s'agit d'un outil développé par Yahoo! pour vérifier de façon automatisée l'application des règles de performances web internes. Il offre une vue rapide du poids et du temps de rendu de la page, une notation après vérification une à une de 13 des règles de performance web Yahoo!, des graphiques statistiques sur la gestion du cache, et des informations détaillées sur tous les composants de la page

Ceux qui ont utilisé les jeux vidéo il y a 10 ou 15 ans connaissent forcément les sprites. Pour économiser les ressources on regroupe toutes les icônes et les images dans un ou plusieurs fichiers. Le résultat c'est une sorte de tableau d'images, le jeu utilise alors simplement une partie de cette image à chaque fois qu'il a besoin d'une icône.  Tout est une question de ressources disponibles, à l'époque on parlait de mémoire occupée et d'accès disque. Plusieurs années après, le Web a les mêmes problématiques : la poids et le nombre d'éléments à charger impactent directement et fortement les performances des pages. Il est donc logique qu'on utilise les mêmes solutions.

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.