Existe-t-il un moyen simple de visualiser le niveau de compression dans Chrome?
Je suis occupé à vérifier le fonctionnement de mon serveur Web sous gzip. Je suis convaincu que gzip est activé car chrome affiche l'en-tête content-encoding: gzip.
Existe-t-il un moyen simple de savoir combien de fichiers ont été compressés dans les outils de développement Chrome?
Réponse mise à jour pour 2017 : Oui.
La colonne de taille de l'onglet Réseau dans Chrome Outils de développement présente à la fois la taille compressée et non compressée, pour gzip, brotli et ainsi de suite. Par exemple:
Ici, la taille compressée est de 242 Ko, la taille non compressée est de 1,1 Mo
Pour voir les deux, assurez-vous que Devtools affiche grandes lignes de requête . C'est la première icône dans les options "Affichage" de la barre d'outils spécifique au réseau.
De loin, la méthode la plus simple consiste à utiliser un outil en ligne. GIDZipTest vous montre beaucoup de détails: la taille d'origine, la taille compressée et le pourcentage de compression.
Cependant, cela est possible dans Chrome avec un peu d'effort. (Mise à jour pour le dernier Chrome, septembre 2011.)
Dans les outils de développement, allez dans l'onglet "Réseau" et rechargez la page. Vous verrez une liste de tous les fichiers récupérés dans la colonne de gauche. Cliquez sur la page/le fichier approprié à gauche puis sur l'onglet "En-têtes" dans le volet de droite.
Sous "En-têtes de réponse", vous devriez voir "Content-Encoding: gzip" suivi d'un en-tête "Content-Length". C'est la taille du contenu compressé.
Il est plus difficile de trouver la taille non compressée. Si vous distribuez des fichiers statiques, vous pouvez simplement vérifier sa taille. Pour le contenu dynamique, vous devrez copier-coller le code HTML dans un éditeur de texte et l'enregistrer pour vérifier sa taille exacte.
Mise à jour pour 2017
Lorsque vous utilisez de grandes icônes, les outils chrome dev indiquent une taille de compression avant et après dans les onglets du réseau.
J'ai confirmé en activant et désactivant gzip sur mon serveur Web.
Une autre façon d’y parvenir est avec cURL:
curl -i -H "Accept-Encoding: gzip" http://someurl.com | wc -c
versus
curl -i http://someurl.com | wc -c
Le nombre indiqué après chaque commande est le nombre d'octets qui ont traversé le fil.
J'ai entendu dire que celui dans chrome est défectueux à cause d'un bogue dans webkit.
Le Y Slow Plugin pour Firefox fait un excellent travail. Lors de son exécution, accédez à l'onglet Composants et développez le type de composant pour lequel vous souhaitez utiliser les valeurs. Il montrera la taille originale et la taille de gzip.
Ce n'est pas un outil spécifiquement pour Chrome, mais j'utilise Fiddler lors de la vérification du trafic HTTP/des informations d'en-tête. C'est un excellent outil, fonctionne sur n'importe quel navigateur et c'est gratuit!
Pour ceux qui arrivent encore ici à partir d'une recherche générale sur Google (comme je l'ai fait), dans les versions modernes de Firefox, il est possible de voir la taille "brute" et la taille gzippée directement à partir de ses devtools en comparant les colonnes "Taille transférée" et "Taille". "Taille" est la taille brute de la réponse, la "Taille transférée" est la taille réelle des données transférées pour la réponse, qui peut être inférieure à la taille réelle dans le cas de gzip, comme dans l'image ci-dessous, ou même 0 dans Si la réponse a été mise en cache dans le client.
