alex/yomichan
1
Fork 0
Code Releases Activity

Don't use document fragment

Browse Source
This commit is contained in:
toasted-nutbread 2019-12-27 18:15:16 -05:00
parent 7a6f85879e
commit 97f7df3302
2 changed files with 23 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
ext/mixed/css/display.css
View File

@ -42,6 +42,7 @@ body {
margin: 0; margin: 0;
border: 0; border: 0;
padding: 0; padding: 0;
overflow-y: scroll; /* always show scroll bar */
} }
ol, ul { ol, ul {
@ -132,10 +133,6 @@ html:root[data-yomichan-page=float] .navigation-header {
margin-right: 0.2em; margin-right: 0.2em;
} }
html:root[data-yomichan-page=search] body {
overflow-y: scroll; /* always show scroll bar to avoid scanning problems */
}
/* /*
* Entries * Entries

40
ext/mixed/js/display.js
View File

@ -372,17 +372,19 @@ class Display {
this.updateNavigation(this.context.previous, this.context.next); this.updateNavigation(this.context.previous, this.context.next);
this.setNoContentVisible(definitions.length === 0); this.setNoContentVisible(definitions.length === 0);
const fragment = document.createDocumentFragment(); const container = this.container;
for (const definition of definitions) { container.textContent = '';
fragment.appendChild(this.displayGenerator.createTermEntry(definition));
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; const {index, scroll, disableScroll} = context;
if (!disableScroll) { if (!disableScroll) {
this.entryScrollIntoView(index || 0, scroll); this.entryScrollIntoView(index || 0, scroll);
@ -429,17 +431,19 @@ class Display {
this.updateNavigation(this.context.previous, this.context.next); this.updateNavigation(this.context.previous, this.context.next);
this.setNoContentVisible(definitions.length === 0); this.setNoContentVisible(definitions.length === 0);
const fragment = document.createDocumentFragment(); const container = this.container;
for (const definition of definitions) { container.textContent = '';
fragment.appendChild(this.displayGenerator.createKanjiEntry(definition));
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; const {index, scroll} = context;
this.entryScrollIntoView(index || 0, scroll); this.entryScrollIntoView(index || 0, scroll);