title: Flicker while scrolling down in Safari
body: <p>I want to embed a Monaco Editor in a page under some fixed texts, I want the height of the Monaco Editor to fill exactly the rest of the page. People gave me an answer (<a href="https://jsbin.com/lafinuzezi/1/edit?html,output" rel="nofollow noreferrer">JSBin</a>):</p>
  
  <pre><code>&lt;html&gt;
      &lt;style&gt;
      body {
          margin: 0;
          height: 100%;
      }
  
      .rb {
          height: 100%;
          display: flex;
          flex-direction: column;
      }
  
      .myME {
          flex:1;
          background: grey;
      }
  
      #container &gt; * {
          max-height:100%;
          overflow:auto;
      }
      &lt;/style&gt;
      &lt;body&gt;
          &lt;div class="rb"&gt;
              &lt;div class="top"&gt;1&lt;br/&gt;2&lt;br/&gt;3&lt;br/&gt;4&lt;br/&gt;&lt;/div&gt;
              &lt;div class="myME" id="container"&gt;&lt;/div&gt;    
          &lt;/div&gt;
      &lt;script src="https://www.matrixlead.com/monaco-editor/min/vs/loader.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          require.config({ paths: { 'vs': 'https://www.matrixlead.com/monaco-editor/min/vs' }})
  
          require(["vs/editor/editor.main"], function () {
            var editor = monaco.editor.create(document.getElementById('container'), {
              value: 'function x() {\n\tconsole.log("Hello world!");\n}',
              language: 'javascript',
              minimap: { enabled: false },
              automaticLayout: true,
              scrollBeyondLastLine: false
            });
          });
      &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>It works in Chrome. However, in Safari, while scrolling down quickly, we could see flicker.</p>
  
  <p>Does anyone know how to fix this?</p>