sync-construction-async-property-ui-render-gate-pattern

Sync construction with async property pattern. Use when creating clients that need async initialization but must be exportable from modules and usable synchronously in UI components.

1. Zdefiniuj funkcję createClient(), która zwraca obiekt klienta synchronicznie, bez await. Funkcja powinna inicjować asynchroniczną pracę (np. połączenie z bazą, załadowanie z dysku) w tle, ale sama musi zakończyć się natychmiast.

2. Dołącz do obiektu klienta właściwość whenSynced (lub podobną), która przechowuje Promise reprezentujący zakończenie inicjalizacji asynchronicznej. Ta właściwość będzie możliwa do oczekiwania, gdy będzie to potrzebne.

3. Eksportuj klienta bezpośrednio z modułu: export const client = createClient(). Nie używaj top-level await ani getter functions — klient jest dostępny natychmiast po imporcie.

4. W komponentach UI importuj klienta normalnie i używaj jego metod synchronicznie: client.save(data), client.load(id). Metody działają od razu, bez czekania na inicjalizację.

5. Gdy musisz zagwarantować, że inicjalizacja asynchroniczna jest ukończona (np. przed renderowaniem krytycznych danych), użyj await client.whenSynced w odpowiednim miejscu — w funkcji setup komponentu, route guardzie lub effect hook.

6. W SvelteKit możesz użyć tego wzorca do warunkowego renderowania: czekaj na whenSynced w +page.js lub +layout.js, aby zagwarantować gotowość klienta przed renderowaniem strony.