Commit Graph
148 Commits
Author SHA1 Message Date
Tunglies 45afb1c15a fix(frontend): reduce long-running memory pressure in connections (#7227)
* fix(connections): stabilize table memory usage

Render the connections table and list from stable row view models, and replace the TanStack row/cell instantiation path with a lightweight virtualized table body.

The leak was isolated to the frontend table render path: websocket data without the table stayed flat, while the normal table path kept producing large per-snapshot object graphs under active/closed churn.

Introduced-by: bf06cbc87d (introduced the TanStack table path)

Related-hot-path: 068678135 (made default ordering/filtering hot enough for long-running /connections sessions to amplify retained heap/RSS)

Related-retention-path: 7fc238c27b (moved Home stats to the full connection websocket subscription, so Home could keep connection snapshots alive for totals/count)

Keep UI behavior intact: column visibility, column order, resizing, sorting, connection details, the closed-connection cap, and the 500ms refresh cadence remain.

* fix(connections): lazily release connection snapshots

Keep the full active/closed connection snapshot scoped to /connections by using a short React Query gcTime for the full subscription.

Home now subscribes to a lightweight connection summary for totals and active count, so leaving /connections no longer keeps the full active/closed arrays and closed history alive for the dashboard.

Only the selected Active or Closed mode feeds filtering, sorting, row-view derivation, and table/list rendering. Switching modes remounts the row subtree and closes detail/column-manager state without changing the capped closed-history behavior.

* fix(connections): decouple collection from rendering

Move the high-frequency connection websocket path out of React Query and into a module-level external store consumed with useSyncExternalStore.

The store keeps one normalized active snapshot plus the capped closed history, continues collecting across route changes, and only notifies mounted subscribers. Home reads the same store through a lightweight summary snapshot, so leaving /connections no longer renders the table/list while connection history is still preserved.

This replaces the short-gc release behavior that made Active/Closed history disappear after navigating away, and bounds retained data to current active connections plus the closed cap instead of React Query cache objects.

* fix(connections): keep collection store authoritative

Remove the temporary per-subscription gcTime override added for /connections. The connection monitor now owns active/closed retention outside React Query, so route changes should stop rendering without clearing collected history.

This leaves the shared Mihomo websocket hook on its original 30s cache behavior for logs, traffic, and memory while /connections uses the external store introduced in the previous commit.

* perf(connections): coalesce snapshots before parsing

Keep only the latest raw websocket message during the 500ms throttle window and parse it when the store flushes. High-churn connection bursts no longer allocate parsed object graphs for snapshots that will be overwritten before React can observe them.

Also compare incoming metadata through the same normalization used for retained records, so optional undefined fields do not prevent metadata reference reuse.

* perf(connections): trim render allocations

Reuse existing row view objects before formatting derived strings when the retained connection object reference is unchanged. Stable closed-history rows no longer allocate throwaway display strings on every snapshot.

Measure the table scroll viewport on mount and resize instead of assuming a 1200px body, so virtual rendering starts from the real visible row count. Keep table state across Active/Closed switches and share the relative-time cell between table and list rows.

* perf(connections): tighten shared time updates

Refresh the shared relative-time clock before the first subscriber render and switch the listener registry back to a Set, avoiding stale labels after returning to /connections and keeping subscriber churn O(1).

Also sort table time rows by the existing numeric startTime field, drop the redundant row-view startTime equality check, and remove one unnecessary table prop guard.

* perf(connections): skip table-wide row projection

Stop materializing ConnectionRowView objects for the whole filtered dataset in table layout. The page now keeps raw connection records for the table path and only formats visible cells inside the virtualized table body, while list layout keeps the cached row-view path.

This removes the steady 500ms allocation pass that was still walking every filtered connection before table rendering. Detail lookup now reads the current filtered raw record directly, and the table clamps scroll state when switching between datasets of different lengths.

* perf(connections): skip unnecessary filter clone when table not searching

In table mode, avoid creating a filtered copy when search is empty: only apply search/sort work for non-empty query while retaining the same default order behavior. Also replace  parsing in order comparators with numeric startTime to avoid per-tick Date object churn and use SearchBox state to detect an empty search.

In table layout without search input, use upstream connection snapshot directly for rendering instead of cloning/sorting every interval tick. This removes a persistent per-update array allocation path while keeping list-mode sort/search behavior unchanged.

* perf(connections): bound closed merge without full transient arrays

Cap closed-history promotion while iterating previous active set without building a temporary large closed array. This preserves the 500-item limit while avoiding 100k-scale transient allocations when many connections close between snapshots.

* fix(changelog): address memory leak caused by frontend

* perf(connections): cache visible table cell snapshots

Add a bounded row snapshot cache for the virtualized table so repeated paints and optional column sorting reuse stable formatted strings instead of rebuilding host/source/rule/chains/traffic text on every refresh. The cache is capped to avoid retaining large active sets.

Also skip full connection-data snapshot merging when only summary listeners are mounted, keeping Home on the summary-only path without changing Connections history while the page is subscribed.

* chore: update Changelog

* chore: update Changelog
2026-06-07 13:08:15 +08:00
Tunglies 2a397d7ef6 fix(settings): load network interfaces in allow LAN dialog 2026-05-24 15:41:15 +08:00
Tunglies c18c23963d refactor: frontend (#7097)
* refactor: remove unused window show/hide event listeners

* refactor: deduplicate profile-changed event handling

* refactor: remove unused setupCloseListener from use-listen

* refactor: remove unused removeAllListeners from use-listen

* fix(backend): dedupe profile changed notification on import

* fix: avoid duplicate timer update completed event

* refactor(frontend): simplify proxy switch fallback path
2026-05-23 12:52:52 +08:00
Tunglies 6e0647f7b2 perf: narrow app data subscriptions 2026-04-29 10:18:03 +08:00
Tunglies 5b738a9d7a fix(logs): preserve logs when pausing (#6902) 2026-04-26 18:53:16 +08:00
Tunglies b85b435e00 refactor: structure config validation outcomes
- Replace boolean/string validation results with structured ValidationOutcome values across config validation, profile switching, DNS validation, and script validation. Callers can now distinguish valid, invalid, skipped, and busy states, with invalid results carrying an error kind and message.

- Route core config updates through structured outcomes and checked forced updates. Generation and validation failures now discard runtime drafts and surface validation failures instead of relying on empty success messages.

- Preserve existing frontend ergonomics by keeping boolean service wrappers where callers only need success, while direct DNS and script validation consumers receive ValidationOutcome. Failed profile editor saves reload the backend-restored file content and synchronize Monaco models so reopened editors show the restored state.
2026-04-25 13:31:08 +08:00
Tunglies 549f21961c perf: reduce frontend subscription and raf churn 2026-04-25 01:12:45 +08:00
Tunglies d9ae7578ce perf: reduce traffic update allocations 2026-04-25 00:17:47 +08:00
Tunglies e0b9f8a48b perf(frontend): optimize traffic graph rendering 2026-04-24 22:27:05 +08:00
wonfen 4d408a8c1a fix: serialize OS state reads with in-progress update_sysproxy 2026-04-22 12:20:26 +08:00
Tunglies d203121abe perf(ui): reduce CPU and memory pressure on hot frontend paths
WebSocket hooks (use-connection-data, use-log-data)
- Single-pass merge for connection snapshots; reuse previous row reference
  when upload/download are unchanged so downstream memos can bail out
- Single-allocation cap on closedConnections (no double concat+slice)
- Single-allocation clamp in appendLogs
- Cache dayjs().format result within each 50ms log flush window

Connection table (connection-table.tsx)
- Decouple 5s relative-time tick from columnDefs via shared module-level
  tickStore + memoised RelativeTimeCell so the tick no longer rebuilds
  the table
- RowComponent memo with custom comparator (relies on stable row reference)
- Lift sx objects to module scope
- Stable onShowDetail via ref

App data provider (app-data-provider, app-data-context)
- Split monolithic context into six sub-contexts (Proxies/Rules/ClashConfig/
  System/Uptime/Refreshers); 3s uptime ticks no longer invalidate unrelated
  consumers
- useAppData adapter aggregates sub-contexts; consumer files unchanged
- useStableFn helper stabilises all refresh* callback identities
- Extract useCtx helper to remove repeated null-check boilerplate

Canvas traffic graph (enhanced-canvas-traffic-graph, use-traffic-monitor)
- Lift Y-axis scale (max/min) to drawGraph layer; calculateY allocations
  per frame: ~600 -> 1
- Document visibility gate stops RAF and the setNow interval when the
  window is hidden; appendData unaffected
- Reuse the existing visibilitychange listener instead of adding a second
  one; isDocumentVisibleRef guards animate() inside the frame
- Convert forEach arrow shorthands to block bodies
- Drop unnecessary state-setter deps from a useCallback

Proxy groups (proxy-groups, proxy-render, use-render-list)
- Narrow proxyColItemsMemo dep: headState -> headState.showType
- Per-group fingerprint cache + prevListRef in use-render-list; steady-state
  refetch ticks become O(0) and the list reference stays stable when nothing
  changed
- useStableCallback wraps handleCheckAll / handleLocation
2026-04-19 19:33:23 +08:00
Tunglies b1eb011050 refactor(ui): extract useProxyDelayState hook and tighten types
- Extract shared delay state logic from ProxyItem and ProxyItemMini
  into `useProxyDelayState` hook (src/hooks/use-proxy-delay-state.ts);
  JSX display thresholds preserved per-component.
- Deduplicate rAF/setTimeout/Promise scheduling in DelayManager via
  a private `scheduleOnNextFrame` helper.
- Drop no-op `useMemo(() => MODES, [])` in proxies page.
- Replace `any` on `setClashLog` prev params and layout-traffic sx
  objects with proper types (`pre!`, `Pick<BoxProps|...>`).
2026-04-19 17:25:57 +08:00
Tunglies b8fbabae04 fix: frontend memory leaks — Monaco dispose, TQ cache eviction, useEffect cleanup
- Dispose Monaco editor instances on dialog close to prevent cycle leak
- Replace gcTime: Infinity with finite TTLs and evict orphaned subscription queryKeys
- Add missing useEffect cleanup for timers, move setTimeout out of useMemo
2026-04-05 23:10:45 +08:00
Tunglies 5da9f99698 fix: prevent TUN from being falsely disabled during startup
- Add 10s startup grace period before TUN auto-disable logic activates;
  service IPC may not be ready when the frontend first queries, causing
  a transient isServiceOk=false that incorrectly persists
- Replace placeholderData (which set isLoading=false with stale data)
  with a proper isStartingUp guard; query now polls every 2s during
  startup to catch service readiness quickly
- Add 'getSystemState' to refresh-verge-config invalidation keys to
  fix key mismatch that prevented event-driven refetches from working
2026-04-03 21:20:37 +08:00
Tunglies a73fafaf9f refactor: migrate SWR to TanStack Query v5 (#6713)
Replace swr with @tanstack/react-query v5 across all hooks, providers,
and components. Introduce singleton QueryClient, WS subscription pattern
via useQuery+useEffect, and enforce component-layer cache access contract.
2026-04-03 08:15:51 +00:00
Tunglies 36624aff49 fix(logs): preserve log data and eliminate blank flash on page navigation
Preserve SWR cache in onConnected to avoid replacing accumulated logs
with kernel buffer on reconnect. Add KeepAlive for the logs page so
its DOM stays mounted across route changes, removing the visible blank
window when navigating back.
2026-04-03 13:13:57 +08:00
Tunglies 824bcc77eb fix: throttle WebSocket subscriptions to prevent UI freeze on profile switch (#6683) (#6686)
Add leading-edge throttle to useMihomoWsSubscription, reduce SWR retry
aggressiveness, and increase WebSocket reconnect delay to prevent event
storms when switching profiles under poor network conditions.
2026-04-02 13:22:30 +00:00
Tunglies 9bcb79465c fix: resolve frontend data race conditions in hooks
- use-system-state: convert module-level `disablingTunMode` to useRef
  to isolate state per hook instance, fix no-op clearTimeout, add
  proper effect cleanup
- use-profiles: convert forEach to for..of so selectNodeForGroup is
  properly awaited, remove fire-and-forget setTimeout around mutate
- use-clash: add useLockFn to patchInfo for concurrency safety
2026-03-31 20:26:34 +08:00
Tunglies 7a06a5a069 fix: remove dead localStorage writes and hardcoded key
- Remove unused `dns_settings_enabled` localStorage writes in
  setting-clash.tsx — state is sourced from verge config, these
  writes were never read anywhere.
- Replace hardcoded `'last_check_update'` localStorage read in
  system-info-card.tsx with exported `readLastCheckTime()` from
  the useUpdate hook, keeping the key in a single source of truth.
2026-03-29 02:06:08 +08:00
Tunglies 99bbd7ee5a fix(home): unify last check update timestamp across settings and home page (#6605)
The settings page "Check for updates" did not update the homepage
"last check update time" because each page managed the timestamp
independently. Centralizes the timestamp in the useUpdate hook
via SWR + localStorage so both pages share a single data source.

Closes https://github.com/clash-verge-rev/clash-verge-rev/issues/6605#issuecomment-4147144987
2026-03-29 01:56:34 +08:00
wonfen 56141e6dfa feat: use optimistic updates for system proxy toggle 2026-03-17 12:50:44 +08:00
wonfen 68ca01cfea refactor: streamline proxy availability checks and remove redundant methods 2026-03-17 09:25:16 +08:00
renovate[bot]renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>Slinetrac
13538914be chore(deps): update dependency @eslint-react/eslint-plugin to v3 (#6522)
* chore(deps): update dependency @eslint-react/eslint-plugin to v3

* chore: remove deprecated rules

* chore: remove eslint from pre-push

* chore: update lint-staged config

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Slinetrac <realakayuki@gmail.com>
2026-03-16 05:40:15 +00:00
Slinetrac c672a6fef3 refactor: lint (#6511)
* refactor: lint

* chore: remove eslint-plugin/config-prettier
2026-03-15 07:40:11 +00:00
Slinetrac 837508c02c feat(monaco): reintroduce meta-json-schema (#6509)
* refactor(editor): make EditorViewer controlled and unify document state handling

* fix(monaco-yaml): add patchCreateWebWorker

* feat(monaco): reintroduce meta-json-schema

* fix(editor): reset document state on target change
2026-03-15 06:04:59 +00:00
Tunglies 262b6f8adf fix: unexpected latency when switching nodes #6363 2026-02-26 15:47:02 +08:00
Tunglies c30eaa3678 refactor: reduce webview lock contention (#6271)
* refactor: replace handle::Handle::get_window() with WindowManager::get_main_window() in multiple files

* refactor: enhance WindowManager to return window state alongside the main window instance

* refactor: update useProfiles and ProfilePage to support profile overrides and improve patchProfilesConfig return type

* refactor: enhance handle_success to check main window existence before notifying profile changes

* refactor: simplify get_main_window_with_state by using pattern matching and improve window state handling

* refactor: fix window activation by removing unnecessary reference in activate_existing_main_window

* refactor: remove redundant macOS conditional for window_manager import
2026-02-07 05:45:15 +00:00
Tunglies c57a962109 refactor: replace useSWR with custom hooks for update and network interfaces (#6195) 2026-01-27 12:52:20 +00:00
Tunglies 6477dd61c3 perf: reduce various timeout and retry intervals for improved responsiveness to fetch proxy infomation (#6072) 2026-01-25 07:31:34 +00:00
Sline fd98caccd2 revert: use-app-data (#6088)
* Revert "refactor(app-data): split monolithic context into focused SWR hooks (#5576)"

This reverts commit 8e8182f707.

# Conflicts:
#	src/components/home/clash-info-card.tsx
#	src/components/home/clash-mode-card.tsx
#	src/components/home/current-proxy-card.tsx
#	src/components/home/home-profile-card.tsx
#	src/components/proxy/provider-button.tsx
#	src/components/proxy/proxy-chain.tsx
#	src/components/proxy/proxy-groups.tsx
#	src/components/proxy/use-render-list.ts
#	src/components/rule/provider-button.tsx
#	src/components/setting/mods/sysproxy-viewer.tsx
#	src/hooks/use-clash-data.ts
#	src/hooks/use-current-proxy.ts
#	src/hooks/use-shared-swr-poller.ts
#	src/hooks/use-system-proxy-state.ts
#	src/pages/rules.tsx

* docs: Changelog.md
2026-01-16 18:32:31 +08:00
renovate[bot]renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>Slinetrac
2128e1f788 chore(deps): lock file maintenance npm dependencies (#6015)
* chore(deps): lock file maintenance npm dependencies

* chore(deps): bump npm deps

* chore: fix eslint ref-name

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Slinetrac <realakayuki@gmail.com>
2026-01-05 13:53:22 +08:00
Slinetrac 522eccdd0e refactor(icon): extract icon cache logic into reusable hook 2026-01-01 16:35:36 +08:00
Tunglies 4ffb8b415f perf(traffic): optimize traffic data handling and improve performance 2025-12-24 13:40:03 +08:00
SukkaandSlinetrac 8e48e4ed10 chore(eslint): add eslint-plugin-react-compiler (#5918)
* chore(eslint): add `eslint-plugin-react-compiler`

* refactor: fix eslint warnings and avoid in-render mutations

---------

Co-authored-by: Slinetrac <realakayuki@gmail.com>
2025-12-22 12:51:20 +08:00
Tunglies 16c3dcc616 fix(proxy): check if proxy port is in use #5891 2025-12-20 19:11:27 +08:00
oomeow ee6b857336 perf: cache listen functions to prevent always repeatedly remove and re-add listener on useLayoutEvents hook 2025-12-14 13:06:34 +08:00
Slinetrac 8316c75c78 Revert "refactor(window): improve WindowProvider implementation"
May break frontend input on macOS
This reverts commit d8e386e3
2025-12-12 16:45:37 +08:00
Slinetrac d8e386e394 refactor(window): improve WindowProvider implementation 2025-12-09 16:42:29 +08:00
Slinetrac bae65a523a chore: rename files to kebab-case and update imports 2025-12-09 13:52:42 +08:00
Slinetrac aa767695af chore(types): consolidate traffic monitor types into shared globals 2025-12-09 13:27:46 +08:00
Sline afee21dae4 refactor: unify Mihomo WS subscription with shared hook (#5719)
* refactor: unify Mihomo WS subscription with shared hook

* refactor: relocate clash log hook and streamline services

* docs: Changelog.md
2025-12-04 14:58:03 +08:00
Slinetrac 3cf51de850 refactor: reorganize component and hook structure; remove unused modules 2025-12-04 12:51:22 +08:00
Slinetrac 4f8ed63cf0 refactor(use-clash): centralize patch typing and port validation logic 2025-12-04 09:30:24 +08:00
Slinetrac 1727d0b6d4 refactor(preload): unify preload logic into preload.ts 2025-12-03 12:51:46 +08:00
Sline 008234988c fix: ensure early CSS injection by preloading Verge config (#5690)
* fix(theme): background css injection

* fix: ensure early CSS injection by preloading Verge config
2025-12-01 21:45:01 +08:00
Slinetrac 99dda5496e fix(i18n): prevent zh flash and normalize language caching #5632 2025-11-28 10:38:42 +08:00
Sline b83ef994f8 refactor(traffic-monitor): Move traffic sampling/compression to a dedicated Web Worker (#5588)
* refactor(traffic-monitor): Move traffic sampling/compression to a dedicated Web Worker

* refactor(traffic-monitor): introduce shared sampler, safe fallback, and decoupled range handling

* refactor(traffic-monitor): add optional subscribe flag and fix range handling

* fix(traffic-monitor): age out idle samples and prevent ref-count updates after unmount
2025-11-25 11:43:45 +08:00
Sline caca8b2bc4 refactor: debugLog for frontend (#5587) 2025-11-25 10:01:04 +08:00
Sline 8e8182f707 refactor(app-data): split monolithic context into focused SWR hooks (#5576)
* refactor(app-data): split monolithic context into focused SWR hooks

* refactor(swr): unify polling and consolidate proxy/config/provider data flow
2025-11-24 16:18:31 +08:00
Tunglies 44adf55975 fix(proxy): sync system proxy switch state with background highlight #5240, #5439, #5421, #4651, #4536
Fixed race condition where button state and background color would desync
during rapid toggles or slow backend responses.

Root causes:
- Button used actualState while background used configState
- toggleSystemProxy returned immediately via setTimeout(0), releasing lock
  before backend operation completed
- 100ms delay in updateProxyStatus caused visual flash

Changes:
- Unified state source: both button and background now use actualState
- Made toggleSystemProxy truly async with proper await chain
- Wrapped toggle function with useLockFn to serialize operations
- Reduced state refresh delay from 100ms to 50ms
- Fixed GuardState lock release timing for async operations
- Added proper error rollback with state refresh on failure

Resolves issue where proxy toggle button would show as off while
background remained green, or vice versa.
2025-11-23 12:17:52 +08:00