Atomatic render, replace the current buffer without causing re-render

[Lantianyou]

Hi everyone, I am really new to xterm.js and maybe suggesting a very dump question.

Every single time, the clear() method is called, the scroll event is fired as the source here shows:
(

xterm.js/src/browser/Terminal.ts

Lines 1323 to 1339 in 48b8e31

	public clear(): void {
	if (this.buffer.ybase === 0 && this.buffer.y === 0) {
	// Don't clear if it's already clear
	return;
	}
	this.buffer.clearAllMarkers(0);
	this.buffer.lines.set(0, this.buffer.lines.get(this.buffer.ybase + this.buffer.y)!);
	this.buffer.lines.length = 1;
	this.buffer.ydisp = 0;
	this.buffer.ybase = 0;
	this.buffer.y = 0;
	for (let i = 1; i < this.rows; i++) {
	this.buffer.lines.push(this.buffer.getBlankLine(DEFAULT_ATTR_DATA));
	}
	this.refresh(0, this.rows - 1);
	this._onScroll.fire({ position: this.buffer.ydisp, source: ScrollSource.TERMINAL });
	}

)
However, I want to clear the current buffer without causing the scroll event to fire.
Since I want to replace the current buffer with new buffer. My implementation is like this:

terminal.clear()
newBuffer.map(line => terminal.writeln(line))
terminal.scrollToBottom()

But the terminal instance is rendered twice, 1 after clear() 2. the terminal with newBuffer. And the scroll event is fired in between.

I want to

1. simply renter the terminal once or
2. after clear method is called, do not fire the scroll event.

[Tyriar]

While we should maybe not be firing that event if ydisp was 0 before, we fire it because the scroll bar/scroll state changed. As for the double rendering, this is by design since writing to the terminal is always queued/async:

https://github.com/Tyriar/xterm.js/blob/a5f2ea336eff69c784414f371baacde641f03517/src/common/input/WriteBuffer.ts#L105-L109

There is no way to do an atomic render like this and I don't think it's worth adding, but in your case you could hide the element temporarily and then show it again

// hide the terminal element
terminal.clear()
// FYI forEach is better here as it will not create and return another array
newBuffer.forEach(line => terminal.writeln(line))
terminal.scrollToBottom()
// show the terminal element