### Local Storage Autosave

#### ✅ Behavior

- All local state changes (either **user-made** or **received from others**) are autosaved into local storage under the key `Autosaved Session`.
    
- Throttle or debounce autosaving to reduce performance overhead.
	-  **Delay** of `750–1500ms` is typically ideal — tweak based on UX feedback.
	 - Wrap autosave logic in a `useEffect` (for React) that depends on your state.
	 - **Cancel debounce** on unmount to avoid memory leaks:
		     ```
```ts
useEffect(() => {
  return () => debouncedAutosave.cancel();
}, []);

```

#### 🔁 Autosave Trigger Events

- State change from user interaction
    
- State update from WebSocket messages
    
- After loading a saved session (explained further below)
    

#### 🧠 Decision Logic on Load

1. **New session**:
    
    - Start with default state
        
    - Autosave begins immediately
        
2. **Join existing session**:
    
    - Request full state from server
        
    - Begin autosaving once session state is received and applied