From 97f7df33027e8c8baced23da02b74a5fbd0a14cf Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Fri, 27 Dec 2019 18:15:16 -0500
Subject: Don't use document fragment

---
 ext/mixed/js/display.js | 36 ++++++++++++++++++++----------------
 1 file changed, 20 insertions(+), 16 deletions(-)

(limited to 'ext/mixed/js')

diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index 5238661b..efe33ee6 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -372,16 +372,18 @@ class Display {
         this.updateNavigation(this.context.previous, this.context.next);
         this.setNoContentVisible(definitions.length === 0);
 
-        const fragment = document.createDocumentFragment();
-        for (const definition of definitions) {
-            fragment.appendChild(this.displayGenerator.createTermEntry(definition));
-        }
+        const container = this.container;
+        container.textContent = '';
 
-        await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome
-        if (this.setContentToken !== token) { return; }
+        for (let i = 0, ii = definitions.length; i < ii; ++i) {
+            if (i > 0) {
+                await promiseTimeout(1);
+                if (this.setContentToken !== token) { return; }
+            }
 
-        this.container.textContent = '';
-        this.container.appendChild(fragment);
+            const entry = this.displayGenerator.createTermEntry(definitions[i]);
+            container.appendChild(entry);
+        }
 
         const {index, scroll, disableScroll} = context;
         if (!disableScroll) {
@@ -429,16 +431,18 @@ class Display {
         this.updateNavigation(this.context.previous, this.context.next);
         this.setNoContentVisible(definitions.length === 0);
 
-        const fragment = document.createDocumentFragment();
-        for (const definition of definitions) {
-            fragment.appendChild(this.displayGenerator.createKanjiEntry(definition));
-        }
+        const container = this.container;
+        container.textContent = '';
 
-        await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome
-        if (this.setContentToken !== token) { return; }
+        for (let i = 0, ii = definitions.length; i < ii; ++i) {
+            if (i > 0) {
+                await promiseTimeout(0);
+                if (this.setContentToken !== token) { return; }
+            }
 
-        this.container.textContent = '';
-        this.container.appendChild(fragment);
+            const entry = this.displayGenerator.createKanjiEntry(definitions[i]);
+            container.appendChild(entry);
+        }
 
         const {index, scroll} = context;
         this.entryScrollIntoView(index || 0, scroll);
-- 
cgit v1.2.3