reduce keyCDN image quality when pixelratio x2

layouts/partials/GetImageUrlKeycdn

@@ -10,6 +10,7 @@
 {{ end }}
 {{ $scale := .scale }}
 {{ $fit := "" }}
+{{ $quality := "" }}
 {{ with .size }}
   {{ $sizes := split . "x" }}
   {{ $width := int (index $sizes 0) }}
@@ -17,6 +18,7 @@
   {{ with $scale }}
     {{ $width = mul $width $scale }}
     {{ $height = mul $height $scale }}
+    {{ $quality = 50 }}
   {{ end }}
   {{ $fit = "inside" }}
   {{ $result = printf "%swidth=%d&height=%d&" $result $width $height }}
@@ -28,4 +30,7 @@
 {{ if ne $fit "" }}
   {{ $result = printf "%s&fit=%s" $result $fit }}
 {{ end }}
+{{ if ne $quality "" }}
+  {{ $result = printf "%s&quality=%d" $result $quality }}
+{{ end }}
 {{ return $result }}

layouts/partials/footer/debug.html

@@ -182,8 +182,9 @@
       throw new TypeError("Expected an image node. Got none.");
     }
     const listener = function () {
-      const dimensionWidth = img.naturalWidth * window.devicePixelRatio;
-      const dimensionHeight = img.naturalHeight * window.devicePixelRatio;
+      const pixelRatio = window.devicePixelRatio > 1 ? 2 : 1;
+      const dimensionWidth = img.naturalWidth * pixelRatio;
+      const dimensionHeight = img.naturalHeight * pixelRatio;
       console.log(`
         -------------------------
         Rendered size: ${img.width}x${img.height}