perf: improve file selection in table view#2940
Merged
Merged
Conversation
Use Set-based O(1) lookups for highlight- and disabled-checks for better performance.
JammingBen
force-pushed
the
perf/table-view-selection
branch
from
July 22, 2026 15:09
1ab39fe to
6407616
Compare
Selecting/deselecting resources in the table view re-rendered the whole list, replaying per-row helpers (getResourceLink, isVisible) once per row. - Extract OcTableRow so each row computes its own memoized highlight/disabled state. This ensures that a change of this state only re-renders the affected rows instead of the entire table. - Read the selection from the store in useResourceViewHelpers instead of a selectedIds prop; drop the prop from ResourceTable/ResourceTiles and the :selected-ids input from the views. Keeping this input and changing it also causes a re-render of the entire component. - Extract ResourceTableSelectAll leaf, dedupe cell helpers into helpers/table.ts, and remove the dead rowMounted emit and checkbox outline handling.
Having the thumbnail interpolated in the list item key of each table row causes the component to render twice: 1. initially and 2. later after the thumbnail has been loaded.
JammingBen
force-pushed
the
perf/table-view-selection
branch
from
July 23, 2026 07:22
6407616 to
f5e3458
Compare
JammingBen
marked this pull request as ready for review
July 23, 2026 07:42
openclouders
pushed a commit
that referenced
this pull request
Jul 24, 2026
perf: improve file selection in table view
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
2 participants
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.
Basically the same as #2939 but for the table view. Unfortunately, the setup is a bit more complicated here because we have ResourceTable > OcTable (design-system) > Tr (design-system).
Selecting/deselecting resources in the table view re-rendered the whole list, replaying all per-row helpers (
getResourceLink,isVisible) once per row. This gets quite expensive with >100 files.OcTableRowso each row computes its own memoized highlight/disabled state. This ensures that a change of this state only re-renders the affected rows instead of the entire table.useResourceViewHelpersinstead of aselectedIdsprop; drop the prop fromResourceTable/ResourceTilesand the:selected-idsinput from the views. Keeping this input and changing it also causes a re-render of the entire component.ResourceTableSelectAllleaf, use Set-based O(1) lookups for highlight- and disabled-checks (when still using thehighlightedprop) and remove the deadrowMountedemit and checkbox outline handling.closes #2937