fix: refactor the parameters of drawLines out of loop

Author: aminya

lib/mixins/canvas-drawer.js

@@ -157,20 +157,28 @@ export default class CanvasDrawer extends Mixin {
     // NOTE: this method is the hot function of Minimap. Do not refactor. The code is inlined delibarately.
 
     // redrawRangesOnLayer inlined (this.redrawRangesOnLayer(this.tokensLayer, intactRanges, firstRow, lastRow, this.drawLines))
-    const layer = this.tokensLayer
 
     const devicePixelRatio = this.minimap.getDevicePixelRatio()
     const lineHeight = this.minimap.getLineHeight() * devicePixelRatio
+    const charHeight = this.minimap.getCharHeight() * devicePixelRatio
+    const charWidth = this.minimap.getCharWidth() * devicePixelRatio
+    const canvasWidth = this.tokensLayer.getSize().width
+    const context = this.tokensLayer.context
+    const editor = this.minimap.getTextEditor()
+    const editorElement = this.minimap.getTextEditorElement()
+    const displayCodeHighlights = this.displayCodeHighlights
+    const ignoreWhitespacesInTokens = this.ignoreWhitespacesInTokens
+    const maxTokensInOneLine = this.maxTokensInOneLine
 
-    layer.clearCanvas()
+    this.tokensLayer.clearCanvas()
 
     if (intactRanges.length === 0) {
-      this.drawLines(firstRow, lastRow, 0)
+      this.drawLines(firstRow, lastRow, 0, lineHeight, charHeight, charWidth, canvasWidth, context, editor, editorElement, displayCodeHighlights, ignoreWhitespacesInTokens, maxTokensInOneLine)
     } else {
       for (let j = 0, len = intactRanges.length; j < len; j++) {
         const intact = intactRanges[j]
 
-        layer.copyPartFromOffscreen(
+        this.tokensLayer.copyPartFromOffscreen(
           intact.offscreenRow * lineHeight,
           (intact.start - firstRow) * lineHeight,
           (intact.end - intact.start) * lineHeight
@@ -181,17 +189,17 @@ export default class CanvasDrawer extends Mixin {
       for (let i = 0, len = intactRanges.length; i < len; i++) {
         const range = intactRanges[i]
 
-        this.drawLines(currentRow, range.start, currentRow - firstRow)
+        this.drawLines(currentRow, range.start, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, context, editor, editorElement, displayCodeHighlights, ignoreWhitespacesInTokens, maxTokensInOneLine)
 
         currentRow = range.end
       }
       if (currentRow <= lastRow) {
-        this.drawLines(currentRow, lastRow, currentRow - firstRow)
+        this.drawLines(currentRow, lastRow, currentRow - firstRow, lineHeight, charHeight, charWidth, canvasWidth, context, editor, editorElement, displayCodeHighlights, ignoreWhitespacesInTokens, maxTokensInOneLine)
       }
     }
 
-    layer.resetOffscreenSize()
-    layer.copyToOffscreen()
+    this.tokensLayer.resetOffscreenSize()
+    this.tokensLayer.copyToOffscreen()
   }
 
   /**
@@ -459,25 +467,26 @@ export default class CanvasDrawer extends Mixin {
    * @param  {number} lastRow the last row to render
    * @param  {number} offsetRow the relative offset to apply to rows when
    *                            rendering them
+   * @param {number} lineHeight  this.minimap.getLineHeight() * devicePixelRatio
+   * @param {number} charHeight  this.minimap.getCharHeight() * devicePixelRatio
+   * @param {number} charWidth  this.minimap.getCharWidth() * devicePixelRatio
+   * @param {number} canvasWidth  this.tokensLayer.getSize().width
+   * @param {CanvasRenderingContext2D} context this.tokensLayer.context
+   * @param {TextEditor} editor this.minimap.getTextEditor()
+   * @param {TextEditorElement} editorElement  this.minimap.getTextEditorElement()
+   * @param {boolean} displayCodeHighlights this.displayCodeHighlights
+   * @param {boolean} ignoreWhitespacesInTokens this.ignoreWhitespacesInTokens
+   * @param {number} maxTokensInOneLine this.maxTokensInOneLine
    * @access private
    */
-  drawLines (firstRow, lastRow, offsetRow) {
-    if (firstRow > lastRow) { return }
-
-    const devicePixelRatio = this.minimap.getDevicePixelRatio()
-    const lineHeight = this.minimap.getLineHeight() * devicePixelRatio
-    const charHeight = this.minimap.getCharHeight() * devicePixelRatio
-    const charWidth = this.minimap.getCharWidth() * devicePixelRatio
-    const displayCodeHighlights = this.displayCodeHighlights
-    const context = this.tokensLayer.context
-    const { width: canvasWidth } = this.tokensLayer.getSize()
+  drawLines (firstRow, lastRow, offsetRow, lineHeight, charHeight, charWidth, canvasWidth, context, editor, editorElement, displayCodeHighlights, ignoreWhitespacesInTokens, maxTokensInOneLine) {
+    // NOTE: this method is the hot function of Minimap. Do not refactor. The code is inlined delibarately.
 
-    const editor = this.minimap.getTextEditor()
-    const editorElement = this.minimap.getTextEditorElement()
+    if (firstRow > lastRow) { return }
 
     let lastLine, x
     let y = (offsetRow * lineHeight) - lineHeight
-    eachTokenForScreenRows(firstRow, lastRow, editor, this.maxTokensInOneLine, (line, token) => {
+    eachTokenForScreenRows(firstRow, lastRow, editor, maxTokensInOneLine, (line, token) => {
       if (lastLine !== line) {
         x = 0
         y += lineHeight
@@ -494,7 +503,7 @@ export default class CanvasDrawer extends Mixin {
           : this.getDefaultColor(editorElement)
 
         x = drawToken(
-          context, token.text, color, x, y, charWidth, charHeight, this.ignoreWhitespacesInTokens
+          context, token.text, color, x, y, charWidth, charHeight, ignoreWhitespacesInTokens
         )
       }
     })