diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index ce64cc49..4db17264 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -42,6 +42,7 @@ body { margin: 0; border: 0; padding: 0; + overflow-y: scroll; /* always show scroll bar */ } ol, ul { @@ -132,10 +133,6 @@ html:root[data-yomichan-page=float] .navigation-header { margin-right: 0.2em; } -html:root[data-yomichan-page=search] body { - overflow-y: scroll; /* always show scroll bar to avoid scanning problems */ -} - /* * Entries 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,17 +372,19 @@ 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 = ''; + + for (let i = 0, ii = definitions.length; i < ii; ++i) { + if (i > 0) { + await promiseTimeout(1); + if (this.setContentToken !== token) { return; } + } + + const entry = this.displayGenerator.createTermEntry(definitions[i]); + container.appendChild(entry); } - await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome - if (this.setContentToken !== token) { return; } - - this.container.textContent = ''; - this.container.appendChild(fragment); - const {index, scroll, disableScroll} = context; if (!disableScroll) { this.entryScrollIntoView(index || 0, scroll); @@ -429,17 +431,19 @@ 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 = ''; + + for (let i = 0, ii = definitions.length; i < ii; ++i) { + if (i > 0) { + await promiseTimeout(0); + if (this.setContentToken !== token) { return; } + } + + const entry = this.displayGenerator.createKanjiEntry(definitions[i]); + container.appendChild(entry); } - await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome - if (this.setContentToken !== token) { return; } - - this.container.textContent = ''; - this.container.appendChild(fragment); - const {index, scroll} = context; this.entryScrollIntoView(index || 0, scroll);