(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol. margin.at
extension web atproto comments
99
fork

Configure Feed

Select the types of activity you want to include in your feed.

improve performance of annotation fetching and add DOM mutation observer

scanash00 0b7443ac 5ee9638c

+25 -2
+25 -2
extension/src/entrypoints/content.ts
··· 724 724 CSS.highlights.clear(); 725 725 } 726 726 activeItems = []; 727 + cachedMatcher = null; 727 728 sendMessage('updateBadge', { count: 0 }); 728 729 if (overlayEnabled) { 729 - fetchAnnotations(); 730 + setTimeout(() => fetchAnnotations(), 300); 730 731 } 731 732 } 732 733 ··· 745 746 checkUrlChange(); 746 747 }; 747 748 748 - setInterval(checkUrlChange, 1000); 749 + setInterval(checkUrlChange, 500); 750 + 751 + let domChangeTimeout: ReturnType<typeof setTimeout> | null = null; 752 + const observer = new MutationObserver((mutations) => { 753 + const hasSignificantChange = mutations.some( 754 + (m) => m.type === 'childList' && (m.addedNodes.length > 3 || m.removedNodes.length > 3) 755 + ); 756 + if (hasSignificantChange && overlayEnabled && activeItems.length === 0) { 757 + if (domChangeTimeout) clearTimeout(domChangeTimeout); 758 + domChangeTimeout = setTimeout(() => { 759 + cachedMatcher = null; 760 + fetchAnnotations(); 761 + }, 500); 762 + } 763 + }); 764 + observer.observe(document.body || document.documentElement, { 765 + childList: true, 766 + subtree: true, 767 + }); 768 + 769 + ctx.onInvalidated(() => { 770 + observer.disconnect(); 771 + }); 749 772 750 773 window.addEventListener('load', () => { 751 774 setTimeout(() => fetchAnnotations(), 500);