perf(sidebar): debounce table search to keep typing responsive (#1725)

* perf(sidebar): debounce table search to keep typing responsive

* test(sidebar): make filterQuery-vs-searchText test discriminating

---------

Co-authored-by: xuhengyu <xuhengyu@aspirecn.com>
Co-authored-by: Ngo Quoc Dat <datlechin@gmail.com>

Author: 3 people

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Changed
+
+- Typing in the sidebar table search stays responsive on databases with thousands of tables; filtering runs after a short pause instead of on every keystroke.
+
 ### Fixed
 
 - Oracle connections no longer crash the app when the server sends a backend message the driver cannot decode; the query fails with a clear error and the connection reconnects. (#483)

TablePro/ViewModels/SidebarViewModel.swift

@@ -10,6 +10,7 @@ import TableProPluginKit
 @MainActor @Observable
 final class SidebarViewModel {
     private static var registry: [UUID: SidebarViewModel] = [:]
+    private static let searchDebounceNanoseconds: UInt64 = 150_000_000
 
     static func shared(
         connectionId: UUID,
@@ -78,8 +79,15 @@ final class SidebarViewModel {
     // MARK: - Published State
 
     var searchText = "" {
+        didSet { scheduleFilterQueryUpdate(oldValue: oldValue) }
+    }
+
+    private(set) var filterQuery = "" {
         didSet { invalidateFilterCaches() }
     }
+
+    @ObservationIgnored private var filterDebounceTask: Task<Void, Never>?
+
     var expanded: ExpansionState {
         didSet { persistExpansion(oldValue: oldValue) }
     }
@@ -329,7 +337,7 @@ final class SidebarViewModel {
     }
 
     func filteredTables(from tables: [TableInfo]) -> [TableInfo] {
-        let query = searchText
+        let query = filterQuery
         let fingerprint = (count: tables.count, generation: schemaGeneration, query: query)
         if let cache = cachedFilteredTables,
            let inputs = cachedFilterInputs,
@@ -359,7 +367,7 @@ final class SidebarViewModel {
     }
 
     func filteredTables(of kind: SidebarObjectKind, from tables: [TableInfo]) -> [TableInfo] {
-        let query = searchText
+        let query = filterQuery
         let fingerprint = (count: tables.count, generation: schemaGeneration, query: query)
         if cachedFilteredByKindFingerprint?.count != fingerprint.count
             || cachedFilteredByKindFingerprint?.generation != fingerprint.generation
@@ -378,7 +386,7 @@ final class SidebarViewModel {
     }
 
     func filteredRoutines(of kind: SidebarObjectKind, from routines: [RoutineInfo]) -> [RoutineInfo] {
-        let query = searchText
+        let query = filterQuery
         let fingerprint = (count: routines.count, generation: schemaGeneration, query: query)
         if cachedFilteredRoutinesFingerprint?.count != fingerprint.count
             || cachedFilteredRoutinesFingerprint?.generation != fingerprint.generation
@@ -393,7 +401,7 @@ final class SidebarViewModel {
     }
 
     func effectiveExpanded(kind: SidebarObjectKind, hasMatches: Bool) -> Bool {
-        if !searchText.isEmpty && hasMatches { return true }
+        if !filterQuery.isEmpty && hasMatches { return true }
         return expanded[kind]
     }
 
@@ -436,4 +444,24 @@ final class SidebarViewModel {
         cachedFilteredRoutines = [:]
         cachedFilteredRoutinesFingerprint = nil
     }
+
+    private func scheduleFilterQueryUpdate(oldValue: String) {
+        if searchText.isEmpty || oldValue.isEmpty {
+            filterDebounceTask?.cancel()
+            filterDebounceTask = nil
+            filterQuery = searchText
+            return
+        }
+        filterDebounceTask?.cancel()
+        filterDebounceTask = Task { @MainActor [weak self] in
+            try? await Task.sleep(nanoseconds: Self.searchDebounceNanoseconds)
+            guard !Task.isCancelled else { return }
+            guard let self else { return }
+            self.filterQuery = self.searchText
+        }
+    }
+
+    deinit {
+        filterDebounceTask?.cancel()
+    }
 }

TablePro/Views/Sidebar/SidebarTreeView.swift

@@ -23,7 +23,7 @@ struct SidebarTreeView: View {
     }
 
     private var searchText: String {
-        viewModel.searchText
+        viewModel.filterQuery
     }
 
     private var visibleSchemas: [String] {

TablePro/Views/Sidebar/SidebarView.swift

@@ -275,7 +275,7 @@ struct SidebarView: View {
             loadingState
         case .failed(let message):
             errorState(message: message)
-        case .loaded where !viewModel.searchText.isEmpty && !hasAnyMatch:
+        case .loaded where !viewModel.filterQuery.isEmpty && !hasAnyMatch:
             noMatchState
         case .loaded(let allTables) where allTables.isEmpty && routines.isEmpty:
             emptyState
@@ -361,7 +361,7 @@ struct SidebarView: View {
             if viewModel.databaseType == .redis, let keyTreeVM = sidebarState.redisKeyTreeViewModel {
                 Section(isExpanded: $viewModel.isRedisKeysExpanded) {
                     RedisKeyTreeView(
-                        nodes: keyTreeVM.displayNodes(searchText: viewModel.searchText),
+                        nodes: keyTreeVM.displayNodes(searchText: viewModel.filterQuery),
                         isLoading: keyTreeVM.isLoading,
                         isTruncated: keyTreeVM.isTruncated,
                         onSelectNamespace: { prefix in

TableProTests/ViewModels/SidebarViewModelTests.swift

@@ -520,3 +520,93 @@ struct SidebarViewModelMultiSectionTests {
         UserDefaults.standard.removeObject(forKey: SidebarPersistenceKey.legacyTablesExpanded)
     }
 }
+
+@Suite("SidebarViewModel search debounce")
+struct SidebarViewModelSearchDebounceTests {
+    @Test("filterQuery updates immediately on first non-empty input")
+    @MainActor
+    func filterQueryUpdatesImmediatelyOnFirstInput() {
+        let vm = makeViewModel()
+
+        vm.searchText = "user"
+
+        #expect(vm.filterQuery == "user")
+    }
+
+    @Test("filterQuery clears immediately when search becomes empty")
+    @MainActor
+    func filterQueryClearsImmediatelyOnEmpty() async {
+        let vm = makeViewModel()
+        vm.searchText = "user"
+        vm.searchText = "users"
+        await Task.yield()
+
+        vm.searchText = ""
+
+        #expect(vm.filterQuery == "")
+    }
+
+    @Test("filterQuery stays at previous value during debounce window")
+    @MainActor
+    func filterQueryHoldsPreviousValueDuringDebounce() async {
+        let vm = makeViewModel()
+        vm.searchText = "user"
+        #expect(vm.filterQuery == "user")
+
+        vm.searchText = "users"
+        await Task.yield()
+
+        #expect(vm.filterQuery == "user")
+    }
+
+    @Test("filterQuery catches up after debounce window elapses")
+    @MainActor
+    func filterQueryCatchesUpAfterDebounce() async {
+        let vm = makeViewModel()
+        vm.searchText = "user"
+
+        vm.searchText = "users"
+
+        try? await Task.sleep(nanoseconds: 300_000_000)
+        await Task.yield()
+
+        #expect(vm.filterQuery == "users")
+    }
+
+    @Test("rapid consecutive keystrokes collapse to the final value")
+    @MainActor
+    func rapidKeystrokesCollapseToFinalValue() async {
+        let vm = makeViewModel()
+        vm.searchText = "u"
+
+        vm.searchText = "us"
+        vm.searchText = "use"
+        vm.searchText = "user"
+        await Task.yield()
+
+        #expect(vm.filterQuery == "u")
+
+        try? await Task.sleep(nanoseconds: 300_000_000)
+        await Task.yield()
+
+        #expect(vm.filterQuery == "user")
+    }
+
+    @Test("filter caches still serve filteredTables using filterQuery, not searchText")
+    @MainActor
+    func filteredTablesHonorsFilterQueryNotSearchText() async {
+        let vm = makeViewModel()
+        let users = TestFixtures.makeTableInfo(name: "users", type: .table)
+        let userLog = TestFixtures.makeTableInfo(name: "user_log", type: .table)
+        let orders = TestFixtures.makeTableInfo(name: "orders", type: .table)
+        let mixed = [users, userLog, orders]
+
+        vm.searchText = "user"
+        vm.searchText = "users"
+        await Task.yield()
+
+        let matches = vm.filteredTables(of: .table, from: mixed)
+
+        #expect(matches.map(\.name) == ["users", "user_log"])
+    }
+}