Update index.html

index.html

@@ -2516,13 +2516,29 @@
       syncUrlParams();
     }
 
+    let urlSyncDebounceTimer = null;
+
+    function debouncedSyncUrlParams(delay = 300) {
+      clearTimeout(urlSyncDebounceTimer);
+      urlSyncDebounceTimer = setTimeout(() => {
+        syncUrlParams();
+      }, delay);
+    }
+
     function readUrlParams() {
       const params = new URLSearchParams(window.location.search);
+      const query = params.get('q') ?? params.get('search');
       const size = params.get('size');
       const arch = params.get('arch');
       const tab = params.get('tab');
       const metric = params.get('metric');
 
+      if (query !== null) {
+        State.searchQuery = query;
+        const searchInput = document.getElementById('global-search');
+        if (searchInput) searchInput.value = query;
+      }
+
       if (['all', '<100M', '<50M', '<10M', '<3M'].includes(size)) State.sizeFilter = size;
       if (['all', 'native', 'custom'].includes(arch)) State.archFilter = arch;
       if (tab && document.getElementById(tab)) State.activeTab = tab;
@@ -2539,7 +2555,12 @@
     }
 
     function syncUrlParams() {
+      clearTimeout(urlSyncDebounceTimer);
+
       const params = new URLSearchParams();
+      const trimmedQuery = State.searchQuery.trim();
+      
+      if (trimmedQuery) params.set('q', trimmedQuery);
       if (State.sizeFilter !== 'all') params.set('size', State.sizeFilter);
       if (State.archFilter !== 'all') params.set('arch', State.archFilter);
       if (State.activeTab !== 'tab-leaderboard') params.set('tab', State.activeTab);
@@ -2573,6 +2594,7 @@
       document.getElementById('global-search').addEventListener('input', (e) => {
         State.searchQuery = e.target.value;
         updateAllViews();
+        debouncedSyncUrlParams(300);
       });
 
       document.getElementById('size-filters').addEventListener('click', (e) => {