Consolidate the MutationObserver-dependent features to use a single observer.
This commit is contained in:
parent
75006ff7eb
commit
af3e930544
|
@ -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) {
|
||||||
runAnonymizeUsernamesFeature();
|
observerFeatures.push(() => {
|
||||||
|
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.`);
|
||||||
}
|
}
|
||||||
|
|
|
@ -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.`);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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);
|
|
||||||
startObserver();
|
|
||||||
});
|
|
||||||
|
|
||||||
function startObserver() {
|
|
||||||
observer.observe(document, {
|
|
||||||
childList: true,
|
|
||||||
subtree: true,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
hideVotes(settings);
|
hideVotes(settings);
|
||||||
startObserver();
|
|
||||||
|
|
||||||
log('Hide Votes: Initialized.');
|
log('Hide Votes: Initialized.');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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();
|
|
||||||
startObserver();
|
|
||||||
});
|
|
||||||
|
|
||||||
function startObserver() {
|
|
||||||
observer.observe(document, {
|
|
||||||
childList: true,
|
|
||||||
subtree: true,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Run once when the page loads.
|
|
||||||
addToolbarsToTextareas();
|
addToolbarsToTextareas();
|
||||||
startObserver();
|
|
||||||
|
|
||||||
log('Markdown Toolbar: Initialized.');
|
log('Markdown Toolbar: Initialized.');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue