Precompute cursor pixel rects in EditorComponent and pass them down

src/cursor-component.coffee

@@ -6,8 +6,8 @@ CursorComponent = React.createClass
   displayName: 'CursorComponent'
 
   render: ->
-    {editor, screenRange, scrollTop, scrollLeft, defaultCharWidth} = @props
-    {top, left, height, width} = editor.pixelRectForScreenRange(screenRange)
+    {pixelRect, scrollTop, scrollLeft, defaultCharWidth} = @props
+    {top, left, height, width} = pixelRect
     top -= scrollTop
     left -= scrollLeft
     width = defaultCharWidth if width is 0

src/cursors-component.coffee

@@ -12,7 +12,7 @@ CursorsComponent = React.createClass
   cursorBlinkIntervalHandle: null
 
   render: ->
-    {editor, cursorScreenRanges, scrollTop, scrollLeft, defaultCharWidth} = @props
+    {cursorPixelRects, scrollTop, scrollLeft, defaultCharWidth} = @props
     {blinkOff} = @state
 
     className = 'cursors'
@@ -20,8 +20,8 @@ CursorsComponent = React.createClass
 
     div {className},
       if @isMounted()
-        for key, screenRange of cursorScreenRanges
-          CursorComponent({key, editor, screenRange, scrollTop, scrollLeft, defaultCharWidth})
+        for key, pixelRect of cursorPixelRects
+          CursorComponent({key, pixelRect, scrollTop, scrollLeft, defaultCharWidth})
 
   getInitialState: ->
     blinkOff: false
@@ -34,10 +34,7 @@ CursorsComponent = React.createClass
 
   shouldComponentUpdate: (newProps, newState) ->
     not newState.blinkOff is @state.blinkOff or
-      not isEqualForProperties(newProps, @props,
-        'cursorScreenRanges', 'scrollTop', 'scrollLeft', 'lineHeightInPixels',
-        'defaultCharWidth', 'scopedCharacterWidthsChangeCount'
-      )
+      not isEqualForProperties(newProps, @props, 'cursorPixelRects', 'scrollTop', 'scrollLeft', 'defaultCharWidth')
 
   componentWillUpdate: (newProps) ->
     @pauseCursorBlinking() if @props.cursorScreenRanges and not isEqual(newProps.cursorScreenRanges, @props.cursorScreenRanges)

src/editor-component.coffee

@@ -55,7 +55,7 @@ EditorComponent = React.createClass
     if @isMounted()
       renderedRowRange = @getRenderedRowRange()
       [renderedStartRow, renderedEndRow] = renderedRowRange
-      cursorScreenRanges = @getCursorScreenRanges(renderedRowRange)
+      cursorPixelRects = @getCursorPixelRects(renderedRowRange)
 
       decorations = editor.decorationsForScreenRowRange(renderedStartRow, renderedEndRow)
       highlightDecorations = @getHighlightDecorations(decorations)
@@ -101,7 +101,7 @@ EditorComponent = React.createClass
           onBlur: @onInputBlurred
 
         CursorsComponent {
-          editor, scrollTop, scrollLeft, cursorScreenRanges, cursorBlinkPeriod, cursorBlinkResumeDelay,
+          scrollTop, scrollLeft, cursorPixelRects, cursorBlinkPeriod, cursorBlinkResumeDelay,
           lineHeightInPixels, defaultCharWidth, @scopedCharacterWidthsChangeCount
         }
         LinesComponent {
@@ -253,6 +253,18 @@ EditorComponent = React.createClass
         cursorScreenRanges[cursor.id] = screenRange
     cursorScreenRanges
 
+  getCursorPixelRects: (renderedRowRange) ->
+    {editor} = @props
+    [renderedStartRow, renderedEndRow] = renderedRowRange
+
+    cursorPixelRects = {}
+    for selection in editor.getSelections() when selection.isEmpty()
+      {cursor} = selection
+      screenRange = cursor.getScreenRange()
+      if renderedStartRow <= screenRange.start.row < renderedEndRow
+        cursorPixelRects[cursor.id] = editor.pixelRectForScreenRange(screenRange)
+    cursorPixelRects
+
   getLineDecorations: (decorationsByMarkerId) ->
     {editor} = @props
     decorationsByScreenRow = {}