1
Fork 0

Consolidate the MutationObserver-dependent features to use a single observer.

This commit is contained in:
Bauke 2022-02-23 23:28:33 +01:00
parent 75006ff7eb
commit af3e930544
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
4 changed files with 45 additions and 59 deletions

View File

@ -34,13 +34,50 @@ async function initialize() {
} }
} }
// Object to hold the active components we are going to render. const observerFeatures: Array<() => any> = [];
const components: Record<string, TRXComponent | undefined> = {}; const observer = new window.MutationObserver(() => {
log('Page mutation detected, rerunning features.');
observer.disconnect();
for (const feature of observerFeatures) {
feature();
}
startObserver();
});
function startObserver() {
observer.observe(document.body, {
childList: true,
subtree: true,
});
}
if (settings.features.anonymizeUsernames) { if (settings.features.anonymizeUsernames) {
observerFeatures.push(() => {
runAnonymizeUsernamesFeature(); runAnonymizeUsernamesFeature();
});
} }
if (settings.features.hideVotes) {
observerFeatures.push(() => {
runHideVotesFeature(settings);
});
}
if (settings.features.markdownToolbar) {
observerFeatures.push(() => {
runMarkdownToolbarFeature();
});
}
// Initialize all the observer-dependent features first.
for (const feature of observerFeatures) {
feature();
}
// Object to hold the active components we are going to render.
const components: Record<string, TRXComponent | undefined> = {};
if (settings.features.autocomplete) { if (settings.features.autocomplete) {
components.autocomplete = html` components.autocomplete = html`
<${AutocompleteFeature} settings=${settings} /> <${AutocompleteFeature} settings=${settings} />
@ -51,18 +88,10 @@ async function initialize() {
components.backToTop = html`<${BackToTopFeature} />`; components.backToTop = html`<${BackToTopFeature} />`;
} }
if (settings.features.hideVotes) {
runHideVotesFeature(settings);
}
if (settings.features.jumpToNewComment) { if (settings.features.jumpToNewComment) {
components.jumpToNewComment = html`<${JumpToNewCommentFeature} />`; components.jumpToNewComment = html`<${JumpToNewCommentFeature} />`;
} }
if (settings.features.markdownToolbar) {
runMarkdownToolbarFeature();
}
if (settings.features.userLabels) { if (settings.features.userLabels) {
components.userLabels = html` components.userLabels = html`
<${UserLabelsFeature} settings=${settings} /> <${UserLabelsFeature} settings=${settings} />
@ -88,6 +117,11 @@ async function initialize() {
replacement, replacement,
); );
// Start the mutation observer only when some features depend on it are enabled.
if (observerFeatures.length > 0) {
startObserver();
}
const initializedIn = window.performance.now() - start; const initializedIn = window.performance.now() - start;
log(`Initialized in approximately ${initializedIn} milliseconds.`); log(`Initialized in approximately ${initializedIn} milliseconds.`);
} }

View File

@ -1,22 +1,7 @@
import {log, querySelectorAll} from '../utilities/exports.js'; import {log, querySelectorAll} from '../utilities/exports.js';
export function runAnonymizeUsernamesFeature() { export function runAnonymizeUsernamesFeature() {
const observer = new window.MutationObserver(() => {
observer.disconnect();
anonymizeUsernames();
startObserver();
});
function startObserver() {
observer.observe(document, {
childList: true,
subtree: true,
});
}
const count = anonymizeUsernames(); const count = anonymizeUsernames();
startObserver();
log(`Anonymize Usernames: Initialized for ${count} user links.`); log(`Anonymize Usernames: Initialized for ${count} user links.`);
} }

View File

@ -2,22 +2,7 @@ import Settings from '../settings.js';
import {log, querySelectorAll} from '../utilities/exports.js'; import {log, querySelectorAll} from '../utilities/exports.js';
export function runHideVotesFeature(settings: Settings) { export function runHideVotesFeature(settings: Settings) {
const observer = new window.MutationObserver(() => {
observer.disconnect();
hideVotes(settings); hideVotes(settings);
startObserver();
});
function startObserver() {
observer.observe(document, {
childList: true,
subtree: true,
});
}
hideVotes(settings);
startObserver();
log('Hide Votes: Initialized.'); log('Hide Votes: Initialized.');
} }

View File

@ -75,25 +75,7 @@ const snippets: MarkdownSnippet[] = [
})); }));
export function runMarkdownToolbarFeature() { export function runMarkdownToolbarFeature() {
// Create an observer that will add toolbars whenever
// a new Markdown form is created (like when clicking Reply).
const observer = new window.MutationObserver(() => {
observer.disconnect();
addToolbarsToTextareas(); addToolbarsToTextareas();
startObserver();
});
function startObserver() {
observer.observe(document, {
childList: true,
subtree: true,
});
}
// Run once when the page loads.
addToolbarsToTextareas();
startObserver();
log('Markdown Toolbar: Initialized.'); log('Markdown Toolbar: Initialized.');
} }