Session Cache Manager

Purpose

Session Cache Manager provides persistent browser-based storage for Claude Code conversation transcripts. Store sessions locally, search across cached conversations, and manage your development session history without external dependencies.

Features

• LocalStorage Persistence - All data stored in browser using Web Storage API
• Session Metadata - Track session IDs, names, timestamps, message counts, and sizes
• Real-time Search - Search across session names, IDs, and message content
• Storage Analytics - Monitor cache size, quota usage, and storage health
• Export/Import - Backup and restore cache data as JSON
• Quota Management - Warning system for approaching storage limits
• JSON Serialization - Efficient storage of complex session objects

Web Research Integration

Source: MDN Web Storage API Documentation

Techniques Applied:

• setItem/getItem Pattern - Using proper localStorage.setItem() and localStorage.getItem() methods instead of direct property access for reliable storage operations
• JSON Serialization - Implementing JSON.stringify() for storing complex session objects and JSON.parse() for retrieval, enabling storage of nested data structures
• Feature Detection - Using try/catch pattern to detect localStorage availability before usage, with graceful degradation if unavailable
• Storage Events - Leveraging storage event listeners for cross-tab synchronization (planned for multi-instance coordination)
• Quota Management - Calculating storage usage and implementing warning system based on estimated 5-10MB localStorage limits

Usage

1. Cache a Session - Paste JSONL transcript data, add optional session ID/name, click "Cache Session"
2. Load from File - Click "Load from File" to import a JSONL transcript file directly
3. Search Sessions - Type in search box to filter sessions by name, ID, or content
4. View Details - Click any session in the list to view full message details
5. Export/Import - Backup entire cache with "Export All" or restore with "Import Cache"
6. Monitor Storage - Check statistics dashboard for cache health and quota usage
7. Clear Cache - Use "Clear All Cache" to remove all stored sessions (with confirmation)

Technical Implementation

• Storage Key Pattern - Uses claude_cache_session_ prefix for all session keys
• Metadata Index - Maintains claude_cache_index for efficient session listing
• Data Structure - Each session stores: id, name, timestamp, messages array, metadata
• Search Algorithm - Case-insensitive search across session metadata and message content
• Size Calculation - Estimates storage using JSON.stringify(value).length * 2 (UTF-16 encoding)

Storage Format

Session data is stored as JSON with this structure:

• id - Unique session identifier
• name - User-provided session description
• timestamp - Cache creation timestamp (ISO 8601)
• messages - Array of parsed JSONL message objects
• messageCount - Total number of messages
• firstMessage - Timestamp of first message
• lastMessage - Timestamp of last message