Bug 1579913 - Use CodeMirror Operations to improve inline preview performance r=jlast

Differential Revision: https://phabricator.services.mozilla.com/D45212

--HG--
extra : moz-landing-system : lando

devtools/client/debugger/src/components/Editor/InlinePreviews.js

@@ -42,10 +42,10 @@ class InlinePreviews extends Component<Props> {
     ) {
       return null;
     }
-
-    return (
-      <div>
-        {Object.keys(previews).map((line: string) => {
+    
+    let inlinePreviewRows;
+    editor.codeMirror.operation(() => {
+      inlinePreviewRows = Object.keys(previews).map((line: string) => {
           const lineNum: number = parseInt(line, 10);
           const numColumnBreakpoints = columnBreakpoints.filter(
             bp => bp.location.line === lineNum + 1
@@ -60,9 +60,10 @@ class InlinePreviews extends Component<Props> {
               numColumnBreakpoints={numColumnBreakpoints}
             />
           );
-        })}
-      </div>
-    );
+        });
+    });
+
+    return <div>{inlinePreviewRows}</div>;
   }
 }