Skip to content

perf(web): optimize shift+click range selection#28636

Open
maarteNNNN wants to merge 1 commit into
immich-app:mainfrom
maarteNNNN:main
Open

perf(web): optimize shift+click range selection#28636
maarteNNNN wants to merge 1 commit into
immich-app:mainfrom
maarteNNNN:main

Conversation

@maarteNNNN

@maarteNNNN maarteNNNN commented May 26, 2026

Copy link
Copy Markdown
  • Add O(1) hasSelectionCandidate via #candidateSet (was O(n) .some() scan per thumbnail)
  • Add assetId index lookup map in GalleryViewer for O(1) range slicing (was O(n) findIndex x2)
  • Add same-month fast path in retrieveRange() to skip async iteration"

Description

I was experiencing performance issues in regard to range selecting (with Shift + Click). I presumed it was related to some reactivity stuff and wanted to optimize it. This PR cover that. Using v2.7.5 on my remote instance I frequently get freezes. My two cents is when video previews are far apart dates are in the selection mix.

Basically the PR introduces a hashmap for faster lookups and improving the selection performance.

Fixes # (issue)

How Has This Been Tested?

I initially tried against my remote instance since the data was there. But since there are too many breaking changes in main at the moment I needed to copy my data of my remote instance locally. I initially tried the performance enhancements basing myself of v2.7.5 using my remote machine for ease to confirm that I could fix it and it proved to be way smoother.

After confirming I backed up my remote DB and photos and setup my local setup with the same data and added my performance enhancements again.

Checklist:

  • I have carefully read CONTRIBUTING.md
  • I have performed a self-review of my own code
  • I have made corresponding changes to the documentation if applicable
  • I have no unrelated changes in the PR.
  • I have confirmed that any new dependencies are strictly necessary.
  • I have written tests for new code (if applicable)
  • I have followed naming conventions/patterns in the surrounding code
  • All code in src/services/ uses repositories implementations for database calls, filesystem operations, etc.
  • All code in src/repositories/ is pretty basic/simple and does not have any immich specific logic (that belongs in src/services/)

Please describe to which degree, if any, an LLM was used in creating this pull request.

I've used an LLM to find the relevant pieces of code to adapt, setup and debug the breaking main branch with copying over my remote v2.7.5 db and it generated the commit message.

- Add O(1) hasSelectionCandidate via #candidateSet (was O(n) .some() scan per thumbnail)
- Add assetId index lookup map in GalleryViewer for O(1) range slicing (was O(n) findIndex x2)
- Add same-month fast path in retrieveRange() to skip async iteration
@immich-push-o-matic

immich-push-o-matic Bot commented May 26, 2026

Copy link
Copy Markdown

Label error. Requires exactly 1 of: changelog:.*. Found: 🖥️web. A maintainer will add the required label.

Comment on lines +90 to +96
let assetIndexMap = $derived.by(() => {
const map = new Map<string, number>();
for (let i = 0; i < assets.length; i++) {
map.set(assets[i].id, i);
}
return map;
});

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
let assetIndexMap = $derived.by(() => {
const map = new Map<string, number>();
for (let i = 0; i < assets.length; i++) {
map.set(assets[i].id, i);
}
return map;
});
const assetIndexMap = $derived(new Map(assets.map(({ id }, i) => [id, i])));

}
return range;
}

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this actually a relevant change? Is the timeline manager iterator significantly slower? Did you test it with and without this path?

selectAssets(assets: TimelineAsset[]) {
for (const asset of assets) {
this.selectAsset(asset);
this.#selectedMap.set(asset.id, asset);

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unrelated change?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Range select (shift-clicking second asset) doesn't work under Firefox ETP

2 participants