Optimize cache keys, vector search, localStorage, and React re-renders

[Copilot]

Identified and fixed 5 performance bottlenecks: inefficient cache key generation, O(n) vector similarity search, blocking localStorage operations, unnecessary React re-renders, and redundant array operations.

Cache Key Generation

• Replaced substring-based keys with hash + length suffix to reduce collisions
• Normalized text cache keys with trim().toLowerCase() for better hit rates

// Before: collision-prone, inconsistent
const cacheKey = prompt.substring(0, 50);

// After: stable hash with collision prevention
const hashPrompt = (prompt: string): string => {
  let hash = 0;
  for (let i = 0; i < prompt.length; i++) {
    hash = ((hash << 5) - hash) + prompt.charCodeAt(i);
    hash = hash & hash;
  }
  return `${hash.toString(36)}_${prompt.length}`;
};

Vector Similarity Search

• Pre-compute query magnitude once before loop
• Single-pass dot product + magnitude computation
• Reduces computation from 3 array passes to 1

// Before: 3 passes through arrays
const dotProduct = vecA.reduce((sum, a, i) => sum + a * vecB[i], 0);
const magnitudeA = Math.sqrt(vecA.reduce((sum, a) => sum + a * a, 0));
const magnitudeB = Math.sqrt(vecB.reduce((sum, b) => sum + b * b, 0));

// After: 1 pass, pre-computed query magnitude
const queryMagnitude = Math.sqrt(queryEmbedding.reduce((sum, a) => sum + a * a, 0));
for (let i = 0; i < vecA.length; i++) {
  dotProduct += vecA[i] * vecB[i];
  sumBSquared += vecB[i] * vecB[i];
}

localStorage Operations

• Debounced saves (500ms VectorStore, 300ms Database) to prevent main thread blocking
• Moved data retrieval into setTimeout to prevent race conditions

React Re-renders

• Memoized static components (Header, IdeaCard, BlueprintCard)
• Created dedicated CaptionCard component with React.memo
• Applied useCallback/useMemo for event handlers and computed values

Array Operations

• Pre-computed hashtag formatting to eliminate repeated replace() calls
• Simplified hashtag processing from map(t => '#' + t.replace('#', '')) to map(t => t.startsWith('#') ? t : '#' + t)

Original prompt

Identify and suggest improvements to slow or inefficient code

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.