Set to ctx.font as little as possible to improve Firefox performance

html_orig/jssrc/term_screen.js

@@ -480,20 +480,18 @@ class TermScreen {
       Math.ceil(cellWidth), Math.ceil(cellHeight));
     ctx.globalCompositeOperation = 'source-over';
 
-    let fontModifiers = {};
+    if (!text) return;
+
     let underline = false;
     let blink = false;
     let strike = false;
-    if (attrs & 1) fontModifiers.weight = 'bold';
     if (attrs & 1 << 1) ctx.globalAlpha = 0.5;
-    if (attrs & 1 << 2) fontModifiers.style = 'italic';
     if (attrs & 1 << 3) underline = true;
     if (attrs & 1 << 4) blink = true;
     if (attrs & 1 << 5) text = TermScreen.alphaToFraktur(text);
     if (attrs & 1 << 6) strike = true;
 
     if (!blink || this.window.blinkStyleOn) {
-      ctx.font = this.getFont(fontModifiers);
       ctx.fillStyle = inSelection ? SELECTION_FG : this.colors[fg];
       ctx.fillText(text, (x + 0.5) * cellWidth, (y + 0.5) * cellHeight);
 
@@ -545,7 +543,28 @@ class TermScreen {
     ctx.textAlign = 'center';
     ctx.textBaseline = 'middle';
 
+    // bits in the attr value that affect the font
+    const FONT_MASK = 0b101;
+
+    // Map of (attrs & FONT_MASK) -> Array of cell indices
+    const fontGroups = new Map();
+
     for (let cell = 0; cell < screenLength; cell++) {
+      let attrs = this.screenAttrs[cell];
+      let font = attrs & FONT_MASK;
+      if (!fontGroups.has(font)) fontGroups.set(font, []);
+      fontGroups.get(font).push(cell);
+    }
+
+    for (let font of fontGroups.keys()) {
+      // set font once because in Firefox, this is a really slow action for some
+      // reason
+      let modifiers = {}
+      if (font & 1) modifiers.weight = 'bold'
+      if (font & 1 << 2) modifiers.style = 'italic'
+      ctx.font = this.getFont(modifiers)
+
+      for (let cell of fontGroups.get(font)) {
         let x = cell % width;
         let y = Math.floor(cell / width);
         let isCursor = this.cursor.x === x && this.cursor.y === y;
@@ -593,6 +612,7 @@ class TermScreen {
         }
       }
     }
+  }
 
   loadContent (str) {
     // current index