feat: improve performance: don't sort timeline buckets from server (#24032)

feat/sync-adjustment-time
Min Idzelis 2025-11-24 11:26:52 +07:00 committed by GitHub
parent 75d23fe135
commit d6b39a464d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 13 additions and 7 deletions

@ -1,6 +1,5 @@
import { setDifference, type TimelineDate } from '$lib/utils/timeline-util'; import { setDifference, type TimelineDate } from '$lib/utils/timeline-util';
import { AssetOrder } from '@immich/sdk'; import { AssetOrder } from '@immich/sdk';
import { SvelteSet } from 'svelte/reactivity';
import type { DayGroup } from './day-group.svelte'; import type { DayGroup } from './day-group.svelte';
import type { MonthGroup } from './month-group.svelte'; import type { MonthGroup } from './month-group.svelte';
import type { TimelineAsset } from './types'; import type { TimelineAsset } from './types';
@ -10,8 +9,10 @@ export class GroupInsertionCache {
[year: number]: { [month: number]: { [day: number]: DayGroup } }; [year: number]: { [month: number]: { [day: number]: DayGroup } };
} = {}; } = {};
unprocessedAssets: TimelineAsset[] = []; unprocessedAssets: TimelineAsset[] = [];
changedDayGroups = new SvelteSet<DayGroup>(); // eslint-disable-next-line svelte/prefer-svelte-reactivity
newDayGroups = new SvelteSet<DayGroup>(); changedDayGroups = new Set<DayGroup>();
// eslint-disable-next-line svelte/prefer-svelte-reactivity
newDayGroups = new Set<DayGroup>();
getDayGroup({ year, month, day }: TimelineDate): DayGroup | undefined { getDayGroup({ year, month, day }: TimelineDate): DayGroup | undefined {
return this.#lookupCache[year]?.[month]?.[day]; return this.#lookupCache[year]?.[month]?.[day];
@ -32,7 +33,8 @@ export class GroupInsertionCache {
} }
get updatedBuckets() { get updatedBuckets() {
const updated = new SvelteSet<MonthGroup>(); // eslint-disable-next-line svelte/prefer-svelte-reactivity
const updated = new Set<MonthGroup>();
for (const group of this.changedDayGroups) { for (const group of this.changedDayGroups) {
updated.add(group.monthGroup); updated.add(group.monthGroup);
} }
@ -40,7 +42,8 @@ export class GroupInsertionCache {
} }
get bucketsWithNewDayGroups() { get bucketsWithNewDayGroups() {
const updated = new SvelteSet<MonthGroup>(); // eslint-disable-next-line svelte/prefer-svelte-reactivity
const updated = new Set<MonthGroup>();
for (const group of this.newDayGroups) { for (const group of this.newDayGroups) {
updated.add(group.monthGroup); updated.add(group.monthGroup);
} }

@ -46,7 +46,7 @@ export async function loadFromTimeBuckets(
} }
} }
const unprocessedAssets = monthGroup.addAssets(bucketResponse); const unprocessedAssets = monthGroup.addAssets(bucketResponse, true);
if (unprocessedAssets.length > 0) { if (unprocessedAssets.length > 0) {
console.error( console.error(
`Warning: getTimeBucket API returning assets not in requested month: ${monthGroup.yearMonth.month}, ${JSON.stringify( `Warning: getTimeBucket API returning assets not in requested month: ${monthGroup.yearMonth.month}, ${JSON.stringify(

@ -153,7 +153,7 @@ export class MonthGroup {
}; };
} }
addAssets(bucketAssets: TimeBucketAssetResponseDto) { addAssets(bucketAssets: TimeBucketAssetResponseDto, preSorted: boolean) {
const addContext = new GroupInsertionCache(); const addContext = new GroupInsertionCache();
for (let i = 0; i < bucketAssets.id.length; i++) { for (let i = 0; i < bucketAssets.id.length; i++) {
const { localDateTime, fileCreatedAt } = getTimes( const { localDateTime, fileCreatedAt } = getTimes(
@ -194,6 +194,9 @@ export class MonthGroup {
} }
this.addTimelineAsset(timelineAsset, addContext); this.addTimelineAsset(timelineAsset, addContext);
} }
if (preSorted) {
return addContext.unprocessedAssets;
}
for (const group of addContext.existingDayGroups) { for (const group of addContext.existingDayGroups) {
group.sortAssets(this.#sortOrder); group.sortAssets(this.#sortOrder);