Time-based limit for Terminal._innerWrite

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "xterm",
+  "name": "@zeit/xterm",
   "description": "Full xterm terminal, in your browser",
   "version": "3.9.1",
   "main": "lib/public/Terminal.js",

src/Terminal.ts

@@ -65,10 +65,12 @@ const document = (typeof window !== 'undefined') ? window.document : null;
 const WRITE_BUFFER_PAUSE_THRESHOLD = 5;
 
 /**
- * The number of writes to perform in a single batch before allowing the
- * renderer to catch up with a 0ms setTimeout.
+ * The max number of ms to spend on writes before allowing the renderer to
+ * catch up with a 0ms setTimeout. A value of < 33 to keep us close to
+ * 30fps, and a value of < 16 to try to run at 60fps. Of course, the real FPS
+ * depends on the time it takes for the renderer to draw the frame.
  */
-const WRITE_BATCH_SIZE = 300;
+const WRITE_TIMEOUT_MS = 12;
 
 /**
  * The set of options that only have an effect when set in the Terminal constructor.
@@ -1361,13 +1363,13 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
       this.writeBuffer = [];
     }
 
-    const writeBatch = this.writeBuffer.splice(0, WRITE_BATCH_SIZE);
-    while (writeBatch.length > 0) {
-      const data = writeBatch.shift();
+    const startTime = Date.now();
+    while (this.writeBuffer.length > 0) {
+      const data = this.writeBuffer.shift();
 
       // If XOFF was sent in order to catch up with the pty process, resume it if
       // the writeBuffer is empty to allow more data to come in.
-      if (this._xoffSentToCatchUp && writeBatch.length === 0 && this.writeBuffer.length === 0) {
+      if (this._xoffSentToCatchUp && this.writeBuffer.length === 0) {
         this.handler(C0.DC1);
         this._xoffSentToCatchUp = false;
       }
@@ -1385,6 +1387,10 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
 
       this.updateRange(this.buffer.y);
       this.refresh(this._refreshStart, this._refreshEnd);
+
+      if (Date.now() - startTime >= WRITE_TIMEOUT_MS) {
+        break;
+      }
     }
     if (this.writeBuffer.length > 0) {
       // Allow renderer to catch up before processing the next batch

src/renderer/webgl/WebglCharAtlas.ts

@@ -85,7 +85,7 @@ export default class WebglCharAtlas extends BaseCharAtlas {
     this._tmpCtx = this._tmpCanvas.getContext('2d', {alpha: this._config.allowTransparency});
 
     // This is useful for debugging
-    document.body.appendChild(this.cacheCanvas);
+    // document.body.appendChild(this.cacheCanvas);
   }
 
   public dispose(): void {