fix: take the const decorations out of loop

Author: aminya

lib/mixins/canvas-drawer.js

@@ -135,8 +135,11 @@ export default class CanvasDrawer extends Mixin {
     const maxTokensInOneLine = this.maxTokensInOneLine
 
     this.updateTokensLayer(firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, context, editor, editorElement, displayCodeHighlights, ignoreWhitespacesInTokens, maxTokensInOneLine)
-    this.updateBackDecorationsLayer(firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
-    this.updateFrontDecorationsLayer(firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+
+    const decorations = this.minimap.decorationsByTypeThenRows(firstRow, lastRow)
+
+    this.updateBackDecorationsLayer(firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
+    this.updateFrontDecorationsLayer(firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
 
     this.pendingChanges = []
     this.pendingBackDecorationChanges = []
@@ -226,9 +229,10 @@ export default class CanvasDrawer extends Mixin {
    * @param {number} canvasWidth  this.tokensLayer.getSize().width
    * @param {number} canvasHeight  this.tokensLayer.getSize().height
    * @param {TextEditorElement} editorElement  this.minimap.getTextEditorElement()
+   * @param {Array<Decoration>} decorations
    * @access private
    */
-  updateBackDecorationsLayer (firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement) {
+  updateBackDecorationsLayer (firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations) {
     const intactRanges = computeIntactRanges(firstRow, lastRow, this.pendingBackDecorationChanges, this.offscreenFirstRow, this.offscreenLastRow)
 
     // NOTE: this method is the hot function of Minimap. Do not refactor. The code is inlined delibarately.
@@ -238,7 +242,7 @@ export default class CanvasDrawer extends Mixin {
     this.backLayer.clearCanvas()
 
     if (intactRanges.length === 0) {
-      this.drawBackDecorationsForLines(firstRow, lastRow, 0, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+      this.drawBackDecorationsForLines(firstRow, lastRow, 0, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
     } else {
       for (let j = 0, len = intactRanges.length; j < len; j++) {
         const intact = intactRanges[j]
@@ -254,12 +258,12 @@ export default class CanvasDrawer extends Mixin {
       for (let i = 0, len = intactRanges.length; i < len; i++) {
         const range = intactRanges[i]
 
-        this.drawBackDecorationsForLines(currentRow, range.start, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+        this.drawBackDecorationsForLines(currentRow, range.start, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
 
         currentRow = range.end
       }
       if (currentRow <= lastRow) {
-        this.drawBackDecorationsForLines(currentRow, lastRow, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+        this.drawBackDecorationsForLines(currentRow, lastRow, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
       }
     }
 
@@ -280,9 +284,10 @@ export default class CanvasDrawer extends Mixin {
    * @param {number} canvasWidth  this.tokensLayer.getSize().width
    * @param {number} canvasHeight  this.tokensLayer.getSize().height
    * @param {TextEditorElement} editorElement  this.minimap.getTextEditorElement()
+   * @param {Array<Decoration>} decorations
    * @access private
    */
-  updateFrontDecorationsLayer (firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement) {
+  updateFrontDecorationsLayer (firstRow, lastRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations) {
     const intactRanges = computeIntactRanges(firstRow, lastRow, this.pendingFrontDecorationChanges, this.offscreenFirstRow, this.offscreenLastRow)
 
     // NOTE: this method is the hot function of Minimap. Do not refactor. The code is inlined delibarately.
@@ -292,7 +297,7 @@ export default class CanvasDrawer extends Mixin {
     this.frontLayer.clearCanvas()
 
     if (intactRanges.length === 0) {
-      this.drawFrontDecorationsForLines(firstRow, lastRow, 0, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+      this.drawFrontDecorationsForLines(firstRow, lastRow, 0, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
     } else {
       for (let j = 0, len = intactRanges.length; j < len; j++) {
         const intact = intactRanges[j]
@@ -308,12 +313,12 @@ export default class CanvasDrawer extends Mixin {
       for (let i = 0, len = intactRanges.length; i < len; i++) {
         const range = intactRanges[i]
 
-        this.drawFrontDecorationsForLines(currentRow, range.start, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+        this.drawFrontDecorationsForLines(currentRow, range.start, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
 
         currentRow = range.end
       }
       if (currentRow <= lastRow) {
-        this.drawFrontDecorationsForLines(currentRow, lastRow, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement)
+        this.drawFrontDecorationsForLines(currentRow, lastRow, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations)
       }
     }
 
@@ -474,12 +479,12 @@ export default class CanvasDrawer extends Mixin {
    * @param {number} canvasWidth  this.tokensLayer.getSize().width
    * @param {number} canvasHeight  this.tokensLayer.getSize().height
    * @param {TextEditorElement} editorElement  this.minimap.getTextEditorElement()
+   * @param {Array<Decoration>} decorations
    * @access private
    */
-  drawBackDecorationsForLines (firstRow, lastRow, offsetRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement) {
+  drawBackDecorationsForLines (firstRow, lastRow, offsetRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations) {
     if (firstRow > lastRow) { return }
 
-    const decorations = this.minimap.decorationsByTypeThenRows(firstRow, lastRow)
     const renderData = {
       context: this.backLayer.context,
       canvasWidth,
@@ -521,12 +526,12 @@ export default class CanvasDrawer extends Mixin {
    * @param {number} canvasWidth  this.tokensLayer.getSize().width
    * @param {number} canvasHeight  this.tokensLayer.getSize().height
    * @param {TextEditorElement} editorElement  this.minimap.getTextEditorElement()
+   * @param {Array<Decoration>} decorations
    * @access private
    */
-  drawFrontDecorationsForLines (firstRow, lastRow, offsetRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement) {
+  drawFrontDecorationsForLines (firstRow, lastRow, offsetRow, lineHeight, charHeight, charWidth, canvasWidth, canvasHeight, editorElement, decorations) {
     if (firstRow > lastRow) { return }
 
-    const decorations = this.minimap.decorationsByTypeThenRows(firstRow, lastRow)
     const renderData = {
       context: this.frontLayer.context,
       canvasWidth,