From 585001bd4ebd4d0bd202c30afa6bac1bc28c1fe3 Mon Sep 17 00:00:00 2001
From: Ingvar Stepanyan <rreverser@google.com>
Date: Fri, 23 Jul 2021 17:01:40 +0000
Subject: [PATCH] Optimise Widget rendering

Names and lists of values should always remain the same, only update on value/readonly changes.
---
 ui/widget.js | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/ui/widget.js b/ui/widget.js
index 0e205a2..f2722bd 100644
--- a/ui/widget.js
+++ b/ui/widget.js
@@ -2,6 +2,17 @@ import { h, Component, createRef } from 'preact';
 
 /** @typedef {import('../libapi.mjs').Config} Config */
 
+/**
+ * @param {Config} config
+ */
+function getValueForComparison(config) {
+  if (config.type === 'window' || config.type === 'section') {
+    // compare instances themselves
+    return config;
+  }
+  return config.value;
+}
+
 /**
  *
  * @extends Component<{ config: Config, setValue: (name: string, value: any) => Promise<void> }>
@@ -13,7 +24,14 @@ export class Widget extends Component {
     /** @type {Widget['props']} */ nextProps,
     /** @type {Widget['state']} */ nextState
   ) {
-    return !(this.state.inProgress && nextState.inProgress);
+    if (this.state.inProgress && nextState.inProgress) {
+      return false;
+    }
+    return (
+      getValueForComparison(this.props.config) !==
+        getValueForComparison(nextProps.config) ||
+      this.props.config.readonly !== nextProps.config.readonly
+    );
   }
 
   getValueProp(out = false) {