From b68f7bb40473d8c5b63c1fb3e13a443756c3bbf5 Mon Sep 17 00:00:00 2001
From: Jonas Jenwald <jonas.jenwald@gmail.com>
Date: Sun, 25 Aug 2019 12:32:49 +0200
Subject: [PATCH 1/2] [TextLayer] Only measure the width of the text, in
 `_layoutText`, for multi-char text divs

For performance reasons single-char text divs aren't being scaled, as outlined in a comment in `appendText`. Hence it doesn't seem necessary, or even a good idea, to unconditionally measuring the width of the text in `_layoutText`.
---
 src/display/text_layer.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/display/text_layer.js b/src/display/text_layer.js
index 00fd7e46bcd44..774129852c5da 100644
--- a/src/display/text_layer.js
+++ b/src/display/text_layer.js
@@ -541,12 +541,14 @@ var renderTextLayer = (function renderTextLayerClosure() {
         this._layoutTextLastFontFamily = fontFamily;
       }
 
-      let width = this._layoutTextCtx.measureText(textDiv.textContent).width;
-
       let transform = '';
-      if (textDivProperties.canvasWidth !== 0 && width > 0) {
-        textDivProperties.scale = textDivProperties.canvasWidth / width;
-        transform = `scaleX(${textDivProperties.scale})`;
+      if (textDivProperties.canvasWidth !== 0) {
+        // Only measure the width for multi-char text divs, see `appendText`.
+        const { width, } = this._layoutTextCtx.measureText(textDiv.textContent);
+        if (width > 0) {
+          textDivProperties.scale = textDivProperties.canvasWidth / width;
+          transform = `scaleX(${textDivProperties.scale})`;
+        }
       }
       if (textDivProperties.angle !== 0) {
         transform = `rotate(${textDivProperties.angle}deg) ${transform}`;

From a1398048e54f615ae7cbb546d3930a124cd11701 Mon Sep 17 00:00:00 2001
From: Jonas Jenwald <jonas.jenwald@gmail.com>
Date: Sun, 25 Aug 2019 12:39:46 +0200
Subject: [PATCH 2/2] [TextLayer] Simplify building of the *expanded* transform
 in `expandTextDivs`

Rather than essentially re-computing the `originalTransform` every time, we can simply use it directly instead.
---
 src/display/text_layer.js | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/display/text_layer.js b/src/display/text_layer.js
index 774129852c5da..6027ffa82deba 100644
--- a/src/display/text_layer.js
+++ b/src/display/text_layer.js
@@ -636,11 +636,8 @@ var renderTextLayer = (function renderTextLayerClosure() {
           transformBuf.length = 0;
           paddingBuf.length = 0;
 
-          if (divProps.angle !== 0) {
-            transformBuf.push(`rotate(${divProps.angle}deg)`);
-          }
-          if (divProps.scale !== 1) {
-            transformBuf.push(`scaleX(${divProps.scale})`);
+          if (divProps.originalTransform) {
+            transformBuf.push(divProps.originalTransform);
           }
           if (divProps.paddingTop > 0) {
             paddingBuf.push(`${divProps.paddingTop}px`);