chpwd.js: Only update DOM properties if they're actually going to change.
authorMark Wooding <mdw@distorted.org.uk>
Fri, 15 May 2020 17:00:06 +0000 (18:00 +0100)
committerMark Wooding <mdw@distorted.org.uk>
Sat, 16 May 2020 09:53:32 +0000 (10:53 +0100)
This might have a significant effect on the background-friendliness of
the validation machinery.  Certainly, if I open Firefox's developer
tools, I used to see the various `whinge' elements highlighted as
changing all the time, which was rather distracting if nothing else, and
probably meant that DOM change-handling machinery was being engaged in
order to do nothing of any use.

Introduce a new function `update' which changes an object property only
if its value would actually change, and use this in the `check'
function.

chpwd.js

index a271db4..f771d65 100644 (file)
--- a/chpwd.js
+++ b/chpwd.js
@@ -64,10 +64,15 @@ var FORMS = {};
  *     submitting a form with invalid data.
  */
 
+function update(obj, slot, value) {
+  /* Update an object slot only if we're gping to change its value. */
+  if (obj[slot] !== value) obj[slot] = value;
+}
+
 function check() {
   /* Check through the various forms to make sure they're filled in OK.  If
-    * not, set the `F-whinge' elements, and disable `F-submit'.
-    */
+   * not, set the `F-whinge' elements, and disable `F-submit'.
+   */
   var f, form, whinge;
 
   for (f in FORMS) {
@@ -75,10 +80,10 @@ function check() {
     we = elt(f + '-whinge');
     sb = elt(f + '-submit');
     whinge = form.check();
-    if (sb !== null) sb.disabled = (whinge !== null);
+    if (sb !== null) update(sb, 'disabled', whinge !== null);
     if (we !== null) {
-      we.textContent = whinge || 'OK';
-      we.className = whinge === null ? 'whinge' : 'whinge wrong';
+      update(we, 'textContent', whinge || 'OK');
+      update(we, 'className',  whinge === null ? 'whinge' : 'whinge wrong');
     }
   }