refactor: use debounce avoid potential perf issue #12

Author: EINDEX

src/pages/background/index.ts

@@ -3,6 +3,7 @@ import Browser from 'webextension-polyfill';
 import { getLogseqCopliotConfig } from '../../config';
 import { removeUrlHash } from '@/utils';
 import { setExtensionBadge } from './utils';
+import { debounce } from 'lodash';
 
 const logseqClient = new LogseqClient();
 
@@ -31,8 +32,12 @@ const quickCapture = async (data: string) => {
   const activeTab = tab[0];
   const url = `logseq://x-callback-url/quickCapture?title=${
     activeTab.title
-  }&url=${encodeURIComponent(activeTab.url!)}&content=${encodeURIComponent(data)}`;
+  }&url=${encodeURIComponent(activeTab.url!)}&content=${encodeURIComponent(
+    data,
+  )}`;
   Browser.tabs.update(activeTab.id, { url: url });
+
+  debounceBadgeSearch(activeTab.url, activeTab.id);
 };
 
 Browser.runtime.onInstalled.addListener(() => {
@@ -46,15 +51,15 @@ Browser.runtime.onInstalled.addListener(() => {
 Browser.tabs.onActivated.addListener((activeInfo) => {
   const promise = new Promise(async () => {
     const tab = await Browser.tabs.get(activeInfo.tabId);
-    await badgeSearch(tab.url, activeInfo.tabId);
+    await debounceBadgeSearch(tab.url, activeInfo.tabId);
   });
   promise.catch((err) => console.error(err));
 });
 
 Browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
   if (tab.active && changeInfo.status === 'complete') {
     const promise = new Promise(async () => {
-      await badgeSearch(tab.url, tabId);
+      await debounceBadgeSearch(tab.url, tabId);
     });
     promise.catch((err) => console.error(err));
   }
@@ -68,6 +73,8 @@ const badgeSearch = async (url: string | undefined, tabId: number) => {
   await setExtensionBadge(resultCount, tabId);
 };
 
+const debounceBadgeSearch = debounce(badgeSearch, 200);
+
 Browser.contextMenus.create({
   id: 'quick-capture',
   title: 'Quick Capture',