Compare gzip size for svg optimizations

front/src/views/rule.html

@@ -217,9 +217,12 @@
                     <div><a href="{{image.url}}" target="_blank"><img ng-src="{{image.url}}" class="checker" /></a></div>
                 </div>
                 <div>
-                    <p>Current weight: {{image.original | bytes}}</p>
-                    <p ng-if="image.lossless">With a lossless optimization:<br/>{{image.lossless | bytes}} (<b>-{{image.original - image.lossless | bytes}}</b>)</p>
-                    <p ng-if="image.lossy">With a lossy optimization:<br/>{{image.lossy | bytes}} (<b>-{{image.original - image.lossy | bytes}}</b>)</p>
+                    <p ng-if="!image.afterCompression">Current weight: {{image.original | bytes}}</p>
+                    <p ng-if="image.afterCompression">Current weight: {{image.original | bytes}} ({{image.afterCompression | bytes}} gzipped)</p>
+                    <p ng-if="image.lossless && image.afterOptimizationAndCompression">With a lossless optimization:<br/>{{image.afterOptimizationAndCompression | bytes}} gzipped (<b>-{{image.gain | bytes}}</b> gzipped)</p>
+                    <p ng-if="image.lossless && !image.afterOptimizationAndCompression">With a lossless optimization:<br/>{{image.lossless | bytes}} (<b>-{{image.gain | bytes}}</b>)</p>
+                    <p ng-if="image.lossy && image.afterOptimizationAndCompression">With a lossy optimization:<br/>{{image.afterOptimizationAndCompression | bytes}} gzipped (<b>-{{image.gain | bytes}} gzipped</b>)</p>
+                    <p ng-if="image.lossy && !image.afterOptimizationAndCompression">With a lossy optimization:<br/>{{image.lossy | bytes}} (<b>-{{image.gain | bytes}}</b>)</p>
                 </div>
             </div>
         </div>

lib/tools/weightChecker/weightChecker.js

@@ -168,19 +168,25 @@ var WeightChecker = function() {
         };
 
         requests.forEach(function(req) {
-            if (req.weightCheck.uncompressedSize && imageOptimizer.entryTypeCanBeOptimized(req) && req.weightCheck.isOptimized === false) {
-                var gain = req.weightCheck.uncompressedSize - req.weightCheck.optimized;
+            if (req.weightCheck.bodySize > 0 && imageOptimizer.entryTypeCanBeOptimized(req) && req.weightCheck.isOptimized === false) {
+                var before = req.weightCheck.afterCompression || req.weightCheck.bodySize;
+                var after = req.weightCheck.afterOptimizationAndCompression || req.weightCheck.optimized;
+                var gain = before - after;
 
-                results.totalGain += gain;
+                if (gain > 200) {
+                    results.totalGain += gain;
 
-                results.images.push({
-                    url: req.url,
-                    original: req.weightCheck.uncompressedSize,
-                    optimized: req.weightCheck.optimized,
-                    lossless: req.weightCheck.lossless,
-                    lossy: req.weightCheck.lossy,
-                    gain: gain
-                });
+                    results.images.push({
+                        url: req.url,
+                        original: req.weightCheck.bodySize,
+                        isCompressed: req.weightCheck.isCompressed,
+                        afterCompression: req.weightCheck.afterCompression,
+                        afterOptimizationAndCompression: req.weightCheck.afterOptimizationAndCompression,
+                        lossless: req.weightCheck.lossless,
+                        lossy: req.weightCheck.lossy,
+                        gain: gain
+                    });
+                }
             }
         });
 
@@ -197,7 +203,7 @@ var WeightChecker = function() {
         requests.forEach(function(req) {
             if (req.weightCheck.bodySize > 0 && fileMinifier.entryTypeCanBeMinified(req) && req.weightCheck.isOptimized === false) {
                 var before = req.weightCheck.afterCompression || req.weightCheck.bodySize;
-                var after = req.weightCheck.afterOptimizationAndCompression || req.weightCheck.afterCompression;
+                var after = req.weightCheck.afterOptimizationAndCompression || req.weightCheck.optimized;
                 var gain = before - after;
 
                 if (gain > 200) {