perf: optimize smol loading and memory virtualization#68
Conversation
…tion UX Bluetooth/CarPlay: - Add "car mode activation" - auto-starts playback when Bluetooth connects even if music wasn't interrupted (just paused) - Reset interruption tracking on Bluetooth connect for fresh start - CarPlay reconnect now also auto-starts if song is loaded but paused Memory optimization: - Close BroadcastChannel on pagehide to prevent memory leak - Limit playlist context window to 50 songs (was unlimited) - Reduce collage images from 80 to 24 - Strip heavy fields (lyrics, style) from in-memory song data - Reduce localStorage cache from 500 to 200 songs with minimal fields Passkey login on subdomains: - Add helpful error messages for passkey migration scenario - Detect when user needs to login at smol.xyz first - Show migration warning only on subdomains, with direct link - Better logging for debugging RP ID issues https://claude.ai/code/session_0136pA9sXWuqL8RAcs5GDNrJ
- Try primary RP ID (smol.xyz) first for subdomain logins - Automatically fallback to full hostname if no credentials found - Removes need for users to manually login at smol.xyz first - Simplified error messages now that fallback is automatic - Removed migration warning banner (no longer needed) https://claude.ai/code/session_0136pA9sXWuqL8RAcs5GDNrJ
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 80b5891d8d
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| <<<<<<< HEAD | ||
| .map((s) => `${API_URL}/image/${s.Id}.png?scale=16`), | ||
| ).slice(0, 40); | ||
| collageImages = [...base, ...base]; | ||
| ======= |
There was a problem hiding this comment.
Remove merge conflict markers before build
The file still contains unresolved merge conflict markers (e.g., <<<<<<< HEAD / ======= / >>>>>>> origin/main). Svelte compilation will fail on any build because these markers are not valid syntax, so the app cannot run until the conflict is resolved.
Useful? React with 👍 / 👎.
| // Capture pagination state | ||
| paginationCursor = data.pagination?.nextCursor || null; | ||
| hasMoreSongs = data.pagination?.hasMore || smols.length >= 200; | ||
| } |
There was a problem hiding this comment.
Avoid pagination without cursor to prevent duplicates
Here hasMoreSongs is set to true based on length even when data.pagination is missing, leaving paginationCursor as null. In that state, loadMoreSongs() sends a request without a cursor, which will just re-fetch the first page and append duplicate songs, leading to repeated items/infinite scrolling whenever the API doesn't return pagination (or when the fallback path is used). Consider gating hasMoreSongs on the presence of a cursor or adding an offset-based fallback.
Useful? React with 👍 / 👎.
Summary
Optimizes smol loading and memory usage to ensure all songs are available on the home page while keeping the application performant on small phones.
Changes
VisibilityWrapper.svelteusingIntersectionObserverto lazily render grid items.GRID_LIMIT_MAXto 10,000 inGlobalPlayer.svelte.liveDiscographyand caching.GlobalPlayer.svelte.Testing
npm run checkpasses (ignoring unrelated pre-existing errors).Ready for review.