Repository navigation
Various Frontend Performance Improvements - #223
Merged
Merged
Conversation
ccrisan
force-pushed
the
frontend-perf-improvements
branch
2 times, most recently
from
September 13, 2026 19:17
4c2f2a7 to
d2a65a8
Compare
Search now requires the typed characters to be adjacent, with whitespace separating groups that must appear in order. The port picker matched each of the id parts and display names separately, so a filter could not span them: typing the device name followed by the port name matched nothing. Match against a single phrase instead, built from the parts of the port id in the order they are displayed, each one as displayed and, when that is a display name, followed by the corresponding id part so either name can be searched for. The phrase is built once per choice rather than on every keystroke, which also takes a linear device lookup per choice off the filtering path. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01FJKFfGXGkJwmAXEvhyftC5
ccrisan
force-pushed
the
frontend-perf-improvements
branch
from
September 13, 2026 19:28
d2a65a8 to
73958b9
Compare
ccrisan
marked this pull request as ready for review
September 15, 2026 20:25
PortIconLabelListItem adds the W and V flags but inherited updateFrom() from IconLabelListItem, which knows only about the label and the icon. A row kept in place therefore kept the badges it was first built with until something forced a full rebuild.
The flag badges are built 448 times on the hub's port list. jQuery's element, style and append helpers came to about 470 ms of the 4.6 s the list takes to build; plain DOM calls bring that to about 100 ms.
There was a problem hiding this comment.
Note
Copilot was unable to run its full agentic suite in this review.
Copilot review overview
Review effort: Lite
Findings: 4
Open (6)
uv lock --upgrade-package "qui-server==$version"expects a PEP 440 version specifier; npm-style… · Newuv lock --upgrade-package "qui-server==$version"expects a PEP 440 version specifier; npm-style… · Newsed -iis not portable across GNU sed vs BSD sed (macOS requires an explicit backup suffix like… · Newthis._flags = other._flagsaliases the flags array between list items. If… · New
What changed in this PR
This PR updates tooling and frontend code to improve QUI version bump workflow and reduce UI latency/perf issues during event bursts and large lists.
Changes:
- Add a unified
update-qui.shflow to update both frontend (@qtoggle/qui) and backend (qui-server) locks in one commit. - Improve frontend performance/UX: avoid quadratic event-bulk scans, reduce DOM construction overhead in large lists, and bound UI debouncing with a max-wait.
- Minor frontend dependency/CSS/behavior improvements (dashboard containment, port picker search phrase building, settings form update guard).
| File | Description |
|---|---|
| update-qui.sh | Adds combined frontend/backend QUI update workflow and commits only relevant lockfiles. |
| qtoggleserver/frontend/package.json | Updates dependencies (jquery-ui package change, Babel runtime additions). |
| qtoggleserver/frontend/less/dashboard/dashboard.less | Adds CSS containment to limit layout/style invalidation. |
| qtoggleserver/frontend/js/utils.js | Reuses a shared digits regex for sort key generation. |
| qtoggleserver/frontend/js/settings/settings-section.js | Avoids updating a closed settings form. |
| qtoggleserver/frontend/js/ports/ports-list.js | Speeds up port flags rendering and fixes in-place row updates; debouncer now has max-wait. |
| qtoggleserver/frontend/js/ports/devices-list.js | Debouncer now has max-wait to prevent “frozen UI” under steady event streams. |
| qtoggleserver/frontend/js/peripherals/peripherals-list.js | Same debouncer max-wait behavior. |
| qtoggleserver/frontend/js/events.js | Replaces repeated per-event filtering/dedup with grouped counts to avoid quadratic behavior. |
| qtoggleserver/frontend/js/devices/devices-table.js | Debouncer now has max-wait behavior. |
| qtoggleserver/frontend/js/dashboard/widgets/widget.js | Normalizes offsets to CSS pixels when comparing with drag/cell measurements. |
| qtoggleserver/frontend/js/dashboard/widgets/port-picker-field.js | Improves search matching with a precomputed match phrase. |
| qtoggleserver/frontend/js/constants.js | Introduces COMMON_DEBOUNCE_MAX_WAIT. |
| qtoggleserver/frontend/js/cache.js | Optimizes slave-device lookup for ports using prefix scanning. |
| docker/Dockerfile | Adds a brief build hint comment. |
Files not reviewed (1)
- qtoggleserver/frontend/package-lock.json: Generated file
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
The function already returns null when slaves are off, and its docstring says so, but a miss returned undefined. The comment also explained a prefix-order case that cannot happen, since a device name has no dot.
uv normalizes the specifier per PEP 440, not PyPI.
* core/ports: Invalidate all attributes when enabling or disabling Enabling only invalidated the `enabled` attribute, but other attributes may be derived from it. `SlavePort.attr_is_online()` returns false for a disabled port, so a read of `online` during the window between a port being registered and being enabled cached a false that nothing ever cleared, leaving the port permanently offline. * slaves/ports: Treat a null remote online attribute as online `online` is optional in the qToggle API, and some devices send it with a null value rather than leaving it out. The dict default only applies to a missing key, so `attr_is_online()` returned null for those ports and the attribute was dropped from the port JSON altogether. * slaves/ports: Drop unused slave fixture arg from online test The test body only uses `slave_port`, which already takes `slave` as a fixture, so the slave device is still created.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.