Synchronous Storage Operations Causing UI Thread Blocking

[BP602]

Problem

Synchronous localStorage operations throughout the app block the main thread, causing UI jank and poor responsiveness.

Impact

• UI freezing during storage operations
• Poor frame rates during chat activity
• Potential data corruption under concurrent access

Root Cause

25+ synchronous localStorage operations across components:

// MessagesHandler.jsx:127-149 - Blocks UI thread
const storedUsers = JSON.parse(localStorage.getItem("silencedUsers") || "{}");
localStorage.setItem("chatrooms", JSON.stringify(updatedChatrooms));

Solution

1. Implement AsyncStorageManager with Web Worker
2. Add storage operation batching and debouncing
3. Implement caching layer for frequently accessed data

Success Criteria

• Zero synchronous localStorage calls in critical paths
• Storage operations batched with 1s debouncing
• 90%+ cache hit rate for frequently accessed data

Files to Modify

• src/renderer/src/components/Messages/MessagesHandler.jsx
• src/renderer/src/providers/ChatProvider.jsx
• Create new utils/AsyncStorageManager.js

Priority: P0 (Critical)
Estimated Effort: 2-3 days