139 votes

Gzip versus rapetisser

J'ai eu une assez vive discussion l'autre jour, à propos de minifying du Javascript et du CSS contre quelqu'un qui préfère à l'aide de Gzip.

Je vais appeler cette personne X.

X a dit que Gzip déjà minifies le code, car le zip de vos fichiers.

Je suis en désaccord. Zip est un lossless méthode de la réduction de la taille du fichier. Lossless signifie l'original doit être restauré à la perfection, le sens de l'info doit être stocké pour être en mesure de restaurer les espaces, l'onu a besoin de caractères, code commenté et tout le reste. Qui prend plus de place, depuis plus d'doivent être compressés.

Je n'ai pas de méthode de test, mais je crois que le Gzip de ce code:

.a1 {
    background-color:#FFFFFF;
    padding: 40px 40px 40px 40px;
}

Sera toujours plus grand que le Gzip de ce code:

.a1{body:background-color:#FFF;padding:40px}

Est-il quelqu'un qui peut le prouver, ce qui est bien ou mal.
Et merci de ne pas venir en disant "C'est bon parce que c'est ce que j'ai toujours utilisé".

Je demande la preuve scientifique ici.

202voto

Paul Kuykendall Points 1942

Très simple à tester. J'ai pris votre js, les mettre dans des fichiers différents et a couru gzip -9 sur eux. Voici le résultat. Cela a été fait sur un WinXP machine sous Cygwin et gzip 1.3.12.

-rwx------  1 xxxxxxxx mkgroup-l-d     88 Apr 30 09:17 expanded.js.gz

-rwx------  1 xxxxxxxx mkgroup-l-d     81 Apr 30 09:18 minified.js.gz

Voici un autre test à l'aide d'un vrai monde de la JS exemple. Le fichier source est "common.js" La taille du fichier original est 73134 octets. Minifiés, il est venu à 26232 octets.

Fichier d'origine:

-rwxrwxrwx 1 xxxxxxxx mkgroup-l-d 73134 Apr 13 11:41 common.js

Minifiés fichier:

-rwxr-xr-x 1 xxxxxxxx mkgroup-l-d 26232 Apr 30 10:39 common-min.js

Fichier Original au format gzip -9 option (même version que la version ci-dessus):

-rwxrwxrwx 1 xxxxxxxx mkgroup-l-d 12402 Apr 13 11:41 common.js.gz

Minifiés fichier au format gzip -9 option (même version que la version ci-dessus):

-rwxr-xr-x 1 xxxxxxxx mkgroup-l-d  5608 Apr 30 10:39 common-min.js.gz

Comme vous pouvez le voir, il ya une nette différence entre les différentes méthodes. Le meilleur pari est de rapetisser ainsi que gzip.

29voto

DisgruntledGoat Points 21368

Voici les résultats d'un test que j'ai fait un tout à l'arrière, à l'aide d'une "vraie vie" fichier CSS de mon site. CSS de l'Optimiseur est utilisé pour la minification. Le standard de Linux archive application qui vient avec Ubuntu a été utilisé pour Gzipping.

Original: 28,781 octets
Minifiés: 22,242 octets
Format: 6,969 octets
Min+Gzip: 5,990 octets

Mon opinion personnelle est d'aller pour Gzipping tout d'abord, depuis que, évidemment, fait la plus grande différence. Comme pour la minification, il dépend de la façon dont vous travaillez. Vous devez conserver l'original de fichier CSS afin de faire des modifications par la suite. Si ça ne te dérange pas de rapetisser après chaque changement, puis aller pour elle.

(Remarque: il existe d'autres solutions, telles que la course à travers un minifier "à la demande" quand desservant le fichier, et la mise en cache dans le système de fichiers.)

16voto

thomasrutter Points 42905

Il n'est pas utile de gzip ces deux extraits que vous avez donné. Ils sont infiniment faible, de sorte qu'ils ne bénéficient pas de la compression GZIP - l'ajout de la petite en-tête GZIP, elles vont croître en taille lors de la gzippé!

En réalité, vous n'aurait pas de fichier CSS de ce petit être préoccupé par la compression, parce que la tête de réponse HTTP, seul, permettrait nain, de l'économie d'espace serait négligeable de toute façon, et vous permettrait d'économiser beaucoup plus par le fait d'avoir les modèles en ligne plutôt que d'une feuille de style séparée.

minify+gzip compresse plus que juste gzip

La réponse à la question initiale, oui, rapetisser + gzip gagnerez une quantité importante plus de compression que juste gzip. Cela est vrai pour n'importe quel non-trivial exemple (c'est à dire tout utile JS ou CSS code qui est plus que de quelques centaines d'octets).

Pour des exemples de ce en effet, saisir Jquery code source qui est disponible minifiés et non compressé, les compresser à la fois avec gzip et de prendre un coup d'oeil.

Les raisons pour cela sont:

  • Minification est une compression avec perte. Par conséquent, l'argument selon lequel minification est inutile avec gzip ne tient pas - gzip est de conserver les données, alors que la minification ne le fait pas.
  • Minification supprime les commentaires
  • Minification peut court-circuité les identificateurs où cela est possible; c'est à dire où ils sont des variables locales et il n'a pas d'importance
  • Minification peut rendre trivial 'optimisations du compilateur' pour le code, qui ne sont possibles que par le fait de l'analyse du code
  • Même si vous êtes seulement enlever les espaces, c'est encore la suppression de l'information à partir de votre code. Si vous avez été seulement à l'aide de gzip, vous auriez à les conserver, de sorte que l'espace peut être reconstruit plus tard, donc pour tous les bits de l'espace gzip, il aurait encore besoin d'un petit coût.

12voto

Seb Points 17238

Vous avez raison.

Ce n'est pas la même minifier que gzipping (ils seraient appelés de la même si c'était le cas). Par exemple, ce n'est pas la même pour gzip ce:

var myIncrediblyLongNameForThisVariableThatDoesNothingButTakeUpSpace = null;

Que de rapetisser à la fin avec quelque chose comme:

var a = null;

Bien sûr, je dirais que la meilleure approche dans la plupart des cas, il minifier d'ABORD, puis Gzip, que vient de minifying ou gzipping, mais selon le code parfois juste minifying ou gzipping vous donne de meilleurs résultats que de faire les deux.

5voto

Robert Points 5137

Pourquoi ne pas utiliser à la fois ?

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X