fix(mermaid): lag during editing (closes #6443)

This commit is contained in:
Elian Doran 2025-07-23 22:28:15 +03:00
parent 6021178b7d
commit 2072bd61d1
No known key found for this signature in database
3 changed files with 29 additions and 2 deletions

View File

@ -51,6 +51,14 @@ export default class SpacedUpdate {
this.lastUpdated = Date.now();
}
/**
* Sets the update interval for the spaced update.
* @param interval The update interval in milliseconds.
*/
setUpdateInterval(interval: number) {
this.updateInterval = interval;
}
triggerUpdate() {
if (!this.changed) {
return;

View File

@ -130,7 +130,8 @@ export default abstract class AbstractSplitTypeWidget extends TypeWidget {
constructor() {
super();
this.editorTypeWidget = new EditableCodeTypeWidget();
this.editorTypeWidget = new EditableCodeTypeWidget(true);
this.editorTypeWidget.updateBackgroundColor = () => {};
this.editorTypeWidget.isEnabled = () => true;
@ -146,6 +147,8 @@ export default abstract class AbstractSplitTypeWidget extends TypeWidget {
doRender(): void {
this.$widget = $(TPL);
this.spacedUpdate.setUpdateInterval(750);
// Preview pane
this.$previewCol = this.$widget.find(".note-detail-split-preview-col");
this.$preview = this.$widget.find(".note-detail-split-preview");

View File

@ -28,6 +28,16 @@ const TPL = /*html*/`
export default class EditableCodeTypeWidget extends AbstractCodeTypeWidget {
private debounceUpdate: boolean;
/**
* @param debounceUpdate if true, the update will be debounced to prevent excessive updates. Especially useful if the editor is linked to a live preview.
*/
constructor(debounceUpdate: boolean = false) {
super();
this.debounceUpdate = debounceUpdate;
}
static getType() {
return "editableCode";
}
@ -46,7 +56,13 @@ export default class EditableCodeTypeWidget extends AbstractCodeTypeWidget {
return {
placeholder: t("editable_code.placeholder"),
vimKeybindings: options.is("vimKeymapEnabled"),
onContentChanged: () => this.spacedUpdate.scheduleUpdate(),
onContentChanged: () => {
if (this.debounceUpdate) {
this.spacedUpdate.resetUpdateTimer();
}
this.spacedUpdate.scheduleUpdate();
},
tabIndex: 300
}
}