Make hostname reversal configurable (#20)

nicjansma · Apr 13, 2018 · d61c254 · d61c254
1 parent 93f2a21
commit d61c254
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 4 deletions.
diff --git a/src/resourcetiming-compression.js b/src/resourcetiming-compression.js
@@ -35,6 +35,11 @@
         return ResourceTimingCompression;
     };
 
+    /**
+     * Should hostnames in the compressed trie be reversed or not
+     */
+    ResourceTimingCompression.HOSTNAMES_REVERSED = true;
+
     /**
      * Initiator type map
      */
@@ -497,7 +502,7 @@
                 if (el) {
                     // src = IMG, IFRAME
                     // xlink:href = svg:IMAGE
-                    src = el.src || el.getAttribute("src") || el.getAttribute("xlink:href");
+                    src = el.currentSrc || el.src || el.getAttribute("src") || el.getAttribute("xlink:href");
 
                     // change src to be relative
                     a.href = src;
@@ -516,6 +521,30 @@
                                 Math.round(rect.top + y),
                                 Math.round(rect.left + x),
                             ];
+
+                            // If this is an image, it has a naturalHeight & naturalWidth
+                            // if these are different from its display height and width, we should report that
+                            // because it indicates scaling in HTML
+                            // If the image came from a srcset, then the naturalHeight/Width will be density corrected.
+                            // We get the actual physical dimensions by assigning the image to an uncorrected Image
+                            // object.
+                            // This should load from in-memory cache, so there should be no extra load.
+                            var realImg = new Image();
+                            realImg.onload = function() {
+                                if (
+                                    (realImg.naturalHeight || realImg.naturalWidth)
+                                    &&
+                                    (
+                                        entries[src][0] !== realImg.naturalHeight
+                                        ||
+                                        entries[src][1] !== realImg.naturalWidth
+                                    )
+                                ) {
+                                    entries[src].push(realImg.naturalHeight, realImg.naturalWidth);
+                                }
+                            };
+                            realImg.src = el.src;
+
                         }
                     }
                 }
@@ -824,7 +853,9 @@
             }
 
             url = this.trimUrl(e.name, this.trimUrls);
-            url = this.reverseHostname(url);
+            if (ResourceTimingCompression.HOSTNAMES_REVERSED) {
+                url = this.reverseHostname(url);
+            }
 
             // if this entry already exists, add a pipe as a separator
             if (results[url] !== undefined) {

diff --git a/src/resourcetiming-decompression.js b/src/resourcetiming-decompression.js
@@ -110,6 +110,11 @@
         return ResourceTimingDecompression;
     };
 
+    /**
+     * Are hostnames in the compressed trie reversed or not
+     */
+    ResourceTimingDecompression.HOSTNAMES_REVERSED = true;
+
     /**
      * Initiator type map
      */
@@ -319,6 +324,11 @@
             return dimensionData;
         }
 
+        // If x is 0, and the last dimension, then it will be excluded, so initialize to 0
+        // If x & y are 0, and the last dimensions, then both will be excluded, so initialize to 0
+        dimensionData.y = 0;
+        dimensionData.x = 0;
+
         // Base 36 decode and assign to correct keys of dimensionData.
         for (i = 0; i < dimensions.length; i++) {
             if (dimensions[i] === "") {
@@ -328,6 +338,14 @@
             }
         }
 
+        // If naturalHeight and naturalWidth are missing, then they are the same as height and width
+        if (!dimensionData.hasOwnProperty("naturalHeight")) {
+            dimensionData.naturalHeight = dimensionData.height;
+        }
+        if (!dimensionData.hasOwnProperty("naturalWidth")) {
+            dimensionData.naturalWidth = dimensionData.width;
+        }
+
         return dimensionData;
     };
 
@@ -545,7 +563,10 @@
             return {};
         }
 
-        url = ResourceTimingDecompression.reverseHostname(url);
+        if (ResourceTimingDecompression.HOSTNAMES_REVERSED) {
+            url = ResourceTimingDecompression.reverseHostname(url);
+        }
+
         var initiatorType = parseInt(data[0], 10);
         data = data.length > 1 ? data.split(SPECIAL_DATA_PREFIX) : [];
         var timings = data.length > 0 && data[0].length > 1 ? data[0].substring(1).split(",") : [];

diff --git a/test/test-resourcetiming-decompression.js b/test/test-resourcetiming-decompression.js
@@ -275,14 +275,20 @@
             it("Should a height, width of 1.", function() {
                 expect({
                     height: 1,
-                    width: 1
+                    width: 1,
+                    y: 0,
+                    x: 0,
+                    naturalHeight: 1,
+                    naturalWidth: 1
                 }).to.eql(ResourceTimingDecompression.decompressDimension("*01,1"));
             });
 
             it("Should find a height, width, y, x of 1.", function() {
                 expect({
                     height: 1,
                     width: 1,
+                    naturalHeight: 1,
+                    naturalWidth: 1,
                     y: 1,
                     x: 1
                 }).to.eql(ResourceTimingDecompression.decompressDimension("*01,1,1,1"));
@@ -292,10 +298,23 @@
                 expect({
                     height: 1,
                     width: 1,
+                    naturalHeight: 1,
+                    naturalWidth: 1,
                     y: 0,
                     x: 1
                 }).to.eql(ResourceTimingDecompression.decompressDimension("*01,1,,1"));
             });
+
+            it("Should find a height, width, x of 1 and y of 0, naturalHeight of 2 and naturalWidth of 4.", function() {
+                expect({
+                    height: 1,
+                    width: 1,
+                    naturalHeight: 2,
+                    naturalWidth: 4,
+                    y: 0,
+                    x: 1
+                }).to.eql(ResourceTimingDecompression.decompressDimension("*01,1,,1,2,4"));
+            });
         });
 
         describe("addDimension()", function() {