Er sorry I introduced a bigger semantic bug in remove when fixing the first one

Author: mksunny1

frameworks/keyed/vanillajs-3/src/Main.js

@@ -28,15 +28,16 @@ function append(n = 1000) {
 }
 function update() {
     const labels = tbody.querySelectorAll('a.lbl'), length = labels.length;
-    for (i = 0; i < length; i += 10) labels[i].firstChild.nodeValue = data[i] += ' !!!'
+    for (i = 0; i < length; i += 10) labels[i].firstChild.nodeValue = data[i] = `${data[i]} !!!`
 }
-function clear() { (data = []) && (tbody.textContent = '') }
+function clear() { data = []; tbody.textContent = '' }
 
 function swap() {
-    if (tbody.children.length < 999) return; const first = tbody.firstElementChild;
+    if (tbody.children.length < 999) return; 
+    const first = tbody.firstElementChild, c998 = tbody.children[998];
     [data[1], data[998]] = [data[998], data[1]];
-    tbody.insertBefore(tbody.insertBefore(first.nextElementSibling, 
-        tbody.children[998]).nextElementSibling, first.nextElementSibling);
+    tbody.insertBefore(tbody.insertBefore(first.nextElementSibling, c998) && c998, 
+                       first.nextElementSibling);
 }
 tbody.onclick = (e) => {
     e.preventDefault; e.stopPropagation;
@@ -45,11 +46,12 @@ tbody.onclick = (e) => {
         if (element === selected) selected.className = selected.className ? "" : "danger";
         else {
             if (selected) selected.className = "";
-            (element.className = "danger") && (selected = element)
+            element.className = "danger"; selected = element;
         }
     } else if (e.target.matches('span.remove')) { 
         const element = e.target.parentNode.parentNode.parentNode;
-        data.splice(Array.prototype.indexOf.call(tbody.children, element)) && tbody.removeChild(element);
+        data.splice(Array.prototype.indexOf.call(tbody.children, element), 1);
+        tbody.removeChild(element);
     }
 }
 for (let [key, fn] of Object.entries({

frameworks/non-keyed/vanillajs-3/src/Main.js

@@ -1,14 +1,7 @@
 const adjectives = ["pretty", "large", "big", "small", "tall", "short", "long", "handsome", "plain", "quaint", "clean", "elegant", "easy", "angry", "crazy", "helpful", "mushy", "odd", "unsightly", "adorable", "important", "inexpensive", "cheap", "expensive", "fancy"];
 const colours = ["red", "yellow", "blue", "green", "pink", "brown", "purple", "brown", "white", "black", "orange"];
 const nouns = ["table", "chair", "house", "bbq", "desk", "car", "pony", "cookie", "sandwich", "burger", "pizza", "mouse", "keyboard"];
-const lengths = [adjectives.length, colours.length, nouns.length];
-function* _random(n) {
-    for (let max of lengths) {
-        const arr = new Array(n);
-        for (i = 0; i < n; i++) arr[i] = Math.round(Math.random() * 1000) % max;
-        yield arr
-    }
-}
+const [l1, l2, l3] = [adjectives.length, colours.length, nouns.length];
 const data = [], nTemplates = (n) => Math.round(n / 100), tbody = document.getElementsByTagName('tbody')[0];
 let index = 1, i, lbl, selected;
 
@@ -35,7 +28,7 @@ function set(n) {
     }
 }
 function append(n = 1000) {
-    const [r1, r2, r3] = _random(n), nt = nTemplates(n); let j = 0;
+    const nt = nTemplates(n); let j = 0, r1, r2, r3;
     const itemTemplate = document.getElementById('itemTemplate').content;
     while (nt >= itemTemplate.children.length * 2) itemTemplate.appendChild(itemTemplate.cloneNode(true));
     while (nt > itemTemplate.children.length) itemTemplate.appendChild(itemTemplate.firstElementChild.cloneNode(true));
@@ -45,6 +38,9 @@ function append(n = 1000) {
 
     while ((n -= nt) >= 0) {
         for (i = 0; i < nt; i++, j++) {
+            r1 = Math.round(Math.random() * 1000) % l1;
+            r2 = Math.round(Math.random() * 1000) % l2;
+            r3 = Math.round(Math.random() * 1000) % l3;
             ids[i].nodeValue = index++;
             data.push(labels[i].nodeValue = `${adjectives[r1[j]]} ${colours[r2[j]]} ${nouns[r3[j]]}`)    
         }
@@ -53,7 +49,7 @@ function append(n = 1000) {
 }
 function update() {
     const labels = tbody.querySelectorAll('a.lbl'), length = labels.length;
-    for (i = 0; i < length; i += 10) labels[i].firstChild.nodeValue = data[i] += ' !!!';
+    for (i = 0; i < length; i += 10) labels[i].firstChild.nodeValue = data[i] = `${data[i]} !!!`;
 }
 function clear() { data.length = 0; tbody.textContent = '' }