From 9d11b51a3e172cea1b1d5b5a86f298a72a098eb8 Mon Sep 17 00:00:00 2001
From: Calixte Denizet <calixte.denizet@gmail.com>
Date: Fri, 30 Oct 2020 14:51:50 +0100
Subject: [PATCH] Replace css color rgb(...) by #...

* it's faster to generate the color code in using a table for components
* it's very likely a way faster to parse (when setting the color in the canvas)
---
 src/core/pattern.js             |  4 ++--
 src/display/annotation_layer.js |  4 ++--
 src/display/canvas.js           |  4 ++--
 src/display/pattern_helper.js   |  2 +-
 src/display/svg.js              |  6 +++---
 src/shared/util.js              | 13 +++++--------
 6 files changed, 15 insertions(+), 18 deletions(-)

diff --git a/src/core/pattern.js b/src/core/pattern.js
index 3c81d7824..0a6e50d41 100644
--- a/src/core/pattern.js
+++ b/src/core/pattern.js
@@ -205,14 +205,14 @@ Shadings.RadialAxial = (function RadialAxialClosure() {
       ratio[0] = t0 + i * step;
       fn(ratio, 0, color, 0);
       rgbColor = cs.getRgb(color, 0);
-      var cssColor = Util.makeCssRgb(rgbColor[0], rgbColor[1], rgbColor[2]);
+      var cssColor = Util.makeHexColor(rgbColor[0], rgbColor[1], rgbColor[2]);
       colorStops.push([i / NUMBER_OF_SAMPLES, cssColor]);
     }
 
     var background = "transparent";
     if (dict.has("Background")) {
       rgbColor = cs.getRgb(dict.get("Background"), 0);
-      background = Util.makeCssRgb(rgbColor[0], rgbColor[1], rgbColor[2]);
+      background = Util.makeHexColor(rgbColor[0], rgbColor[1], rgbColor[2]);
     }
 
     if (!extendStart) {
diff --git a/src/display/annotation_layer.js b/src/display/annotation_layer.js
index effa122b5..e293c7ca7 100644
--- a/src/display/annotation_layer.js
+++ b/src/display/annotation_layer.js
@@ -221,7 +221,7 @@ class AnnotationElement {
       }
 
       if (data.color) {
-        container.style.borderColor = Util.makeCssRgb(
+        container.style.borderColor = Util.makeHexColor(
           data.color[0] | 0,
           data.color[1] | 0,
           data.color[2] | 0
@@ -860,7 +860,7 @@ class PopupElement {
       const r = BACKGROUND_ENLIGHT * (255 - color[0]) + color[0];
       const g = BACKGROUND_ENLIGHT * (255 - color[1]) + color[1];
       const b = BACKGROUND_ENLIGHT * (255 - color[2]) + color[2];
-      popup.style.backgroundColor = Util.makeCssRgb(r | 0, g | 0, b | 0);
+      popup.style.backgroundColor = Util.makeHexColor(r | 0, g | 0, b | 0);
     }
 
     const title = document.createElement("h1");
diff --git a/src/display/canvas.js b/src/display/canvas.js
index 7a31fe075..8d9ffa2ce 100644
--- a/src/display/canvas.js
+++ b/src/display/canvas.js
@@ -1951,12 +1951,12 @@ const CanvasGraphics = (function CanvasGraphicsClosure() {
       this.current.patternFill = true;
     },
     setStrokeRGBColor: function CanvasGraphics_setStrokeRGBColor(r, g, b) {
-      const color = Util.makeCssRgb(r, g, b);
+      const color = Util.makeHexColor(r, g, b);
       this.ctx.strokeStyle = color;
       this.current.strokeColor = color;
     },
     setFillRGBColor: function CanvasGraphics_setFillRGBColor(r, g, b) {
-      const color = Util.makeCssRgb(r, g, b);
+      const color = Util.makeHexColor(r, g, b);
       this.ctx.fillStyle = color;
       this.current.fillColor = color;
       this.current.patternFill = false;
diff --git a/src/display/pattern_helper.js b/src/display/pattern_helper.js
index 4fe13a721..11c40214d 100644
--- a/src/display/pattern_helper.js
+++ b/src/display/pattern_helper.js
@@ -571,7 +571,7 @@ const TilingPattern = (function TilingPatternClosure() {
           current.strokeColor = ctx.strokeStyle;
           break;
         case PaintType.UNCOLORED:
-          const cssColor = Util.makeCssRgb(color[0], color[1], color[2]);
+          const cssColor = Util.makeHexColor(color[0], color[1], color[2]);
           context.fillStyle = cssColor;
           context.strokeStyle = cssColor;
           // Set color needed by image masks (fixes issues 3226 and 8741).
diff --git a/src/display/svg.js b/src/display/svg.js
index 86206e645..7ca368138 100644
--- a/src/display/svg.js
+++ b/src/display/svg.js
@@ -1049,7 +1049,7 @@ if (typeof PDFJSDev === "undefined" || PDFJSDev.test("GENERIC")) {
     }
 
     setStrokeRGBColor(r, g, b) {
-      this.current.strokeColor = Util.makeCssRgb(r, g, b);
+      this.current.strokeColor = Util.makeHexColor(r, g, b);
     }
 
     setFillAlpha(fillAlpha) {
@@ -1057,7 +1057,7 @@ if (typeof PDFJSDev === "undefined" || PDFJSDev.test("GENERIC")) {
     }
 
     setFillRGBColor(r, g, b) {
-      this.current.fillColor = Util.makeCssRgb(r, g, b);
+      this.current.fillColor = Util.makeHexColor(r, g, b);
       this.current.tspan = this.svgFactory.createElement("svg:tspan");
       this.current.xcoords = [];
       this.current.ycoords = [];
@@ -1143,7 +1143,7 @@ if (typeof PDFJSDev === "undefined" || PDFJSDev.test("GENERIC")) {
       this.svg = bbox;
       this.transformMatrix = matrix;
       if (paintType === 2) {
-        const cssColor = Util.makeCssRgb(...color);
+        const cssColor = Util.makeHexColor(...color);
         this.current.fillColor = cssColor;
         this.current.strokeColor = cssColor;
       }
diff --git a/src/shared/util.js b/src/shared/util.js
index ab1f58aef..828150f6b 100644
--- a/src/shared/util.js
+++ b/src/shared/util.js
@@ -618,16 +618,13 @@ const IsEvalSupportedCached = {
   },
 };
 
-const rgbBuf = ["rgb(", 0, ",", 0, ",", 0, ")"];
+const hexNumbers = [...Array(256).keys()].map(n =>
+  n.toString(16).padStart(2, "0")
+);
 
 class Util {
-  // makeCssRgb() can be called thousands of times. Using ´rgbBuf` avoids
-  // creating many intermediate strings.
-  static makeCssRgb(r, g, b) {
-    rgbBuf[1] = r;
-    rgbBuf[3] = g;
-    rgbBuf[5] = b;
-    return rgbBuf.join("");
+  static makeHexColor(r, g, b) {
+    return `#${hexNumbers[r]}${hexNumbers[g]}${hexNumbers[b]}`;
   }
 
   // Concatenates two transformation matrices together and returns the result.