Skip to content

TODO.md

Latest commit

 

History

History
59 lines (41 loc) · 1.86 KB

TODO.md

File metadata and controls

59 lines (41 loc) · 1.86 KB

TODO - Architecture Improvements

Data Loading Architecture Refactor

Current Issues

  • Complex nested queries in queries.ts that load everything at once
  • Large payloads with deeply nested data structures
  • Difficult to cache individual entities efficiently
  • Components can't independently manage loading states
  • Hard to debug and maintain complex joins

Proposed Solution: Flat Data Loading

Replace the current nested approach with a flatter, more modular data loading strategy:

Current Approach (Complex)

fetchSets() -> includes artists -> includes genres -> includes votes
fetchArtists() -> includes genres -> includes votes

Proposed Approach (Flat)

fetchSets() -> just set data + artist_ids + genre_ids
fetchArtists(ids) -> just artist data + genre_ids
fetchGenres() -> cached genre list (loaded once)
fetchVotes(entityIds) -> vote data for specific entities

Benefits

  • Better caching: Each entity type cached separately with TanStack Query
  • Parallel loading: Components can load data independently
  • Smaller payloads: Only fetch what's needed when needed
  • Better UX: Show sets immediately while other data loads progressively
  • Easier testing: Each query has single responsibility
  • More maintainable: Simpler queries, easier to debug

Implementation Plan

  1. Create separate query functions for each entity type
  2. Update components to use dependent queries
  3. Implement proper loading states for progressive data loading
  4. Add proper error boundaries for individual data loading failures
  5. Update TypeScript types to reflect flatter structure
  6. Migrate existing nested queries one by one

Priority: Medium

This is a significant architectural change that will improve performance and maintainability but requires careful migration planning.

Other TODOs

Add other future improvements here...