From ed0e0d2a31d9f80b5ffb45da8f93aeadbd9da7a1 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Tue, 8 Oct 2024 15:31:43 +0200 Subject: [PATCH 1/3] Reduce buildFormData calls Co-authored-by: Marius van den Beek --- client/src/components/Form/FormDisplay.vue | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/client/src/components/Form/FormDisplay.vue b/client/src/components/Form/FormDisplay.vue index e51dfe7e39b1..94029923c1b6 100644 --- a/client/src/components/Form/FormDisplay.vue +++ b/client/src/components/Form/FormDisplay.vue @@ -139,10 +139,7 @@ export default { }, created() { this.onCloneInputs(); - // build flat formData that is ready to be submitted - this.formData = this.buildFormData(); - // emit back to parent, so that parent has submittable data - this.$emit("onChange", this.formData); + this.onChange(); // highlight initial warnings this.onWarnings(); // highlight initial errors From 2b5d16a6a8ca3ba1495ef1052a1afab64948462f Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Thu, 10 Oct 2024 10:03:39 +0200 Subject: [PATCH 2/3] Debounce onChange calls to avoid unnecessary tool rebuilding --- client/src/components/Tool/ToolForm.vue | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/client/src/components/Tool/ToolForm.vue b/client/src/components/Tool/ToolForm.vue index 0268d65bad8e..2237c564d466 100644 --- a/client/src/components/Tool/ToolForm.vue +++ b/client/src/components/Tool/ToolForm.vue @@ -120,6 +120,7 @@ import ToolEntryPoints from "components/ToolEntryPoints/ToolEntryPoints"; import { mapActions, mapState, storeToRefs } from "pinia"; import { useHistoryItemsStore } from "stores/historyItemsStore"; import { useJobStore } from "stores/jobStore"; +import { debounce } from "underscore"; import { refreshContentsWrapper } from "utils/data"; import { canMutateHistory } from "@/api"; @@ -287,7 +288,7 @@ export default { this.onUpdate(); } }, - onUpdate() { + onUpdate: debounce(function (e) { this.disabled = true; console.debug("ToolForm - Updating input parameters.", this.formData); updateToolFormData(this.formConfig.id, this.currentVersion, this.history_id, this.formData) @@ -297,7 +298,7 @@ export default { .finally(() => { this.disabled = false; }); - }, + }, 500), onChangeVersion(newVersion) { this.requestTool(newVersion); }, From 62939c63009e42b820daebfdb869a969ada3b616 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Fri, 15 Nov 2024 14:07:34 +0100 Subject: [PATCH 3/3] Revert "Debounce onChange calls to avoid unnecessary tool rebuilding" This reverts commit 2b5d16a6a8ca3ba1495ef1052a1afab64948462f. As `request volume` / `debounce` tradeoff is not worth it. --- client/src/components/Tool/ToolForm.vue | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/client/src/components/Tool/ToolForm.vue b/client/src/components/Tool/ToolForm.vue index 2237c564d466..0268d65bad8e 100644 --- a/client/src/components/Tool/ToolForm.vue +++ b/client/src/components/Tool/ToolForm.vue @@ -120,7 +120,6 @@ import ToolEntryPoints from "components/ToolEntryPoints/ToolEntryPoints"; import { mapActions, mapState, storeToRefs } from "pinia"; import { useHistoryItemsStore } from "stores/historyItemsStore"; import { useJobStore } from "stores/jobStore"; -import { debounce } from "underscore"; import { refreshContentsWrapper } from "utils/data"; import { canMutateHistory } from "@/api"; @@ -288,7 +287,7 @@ export default { this.onUpdate(); } }, - onUpdate: debounce(function (e) { + onUpdate() { this.disabled = true; console.debug("ToolForm - Updating input parameters.", this.formData); updateToolFormData(this.formConfig.id, this.currentVersion, this.history_id, this.formData) @@ -298,7 +297,7 @@ export default { .finally(() => { this.disabled = false; }); - }, 500), + }, onChangeVersion(newVersion) { this.requestTool(newVersion); },