scriptoriumadmin/supermemory
1
0
Fork 0
mirror of https://github.com/supermemoryai/supermemory.git synced 2026-09-15 23:31:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
supermemory/packages/memory-graph
History
Vorflux AI 1c5ef7e5ed Rewrite @supermemory/memory-graph with perf optimizations and consolidate consumers 
Package changes (packages/memory-graph):
- Spatial grid nearest-neighbor: O(n^2) -> O(n*k) for doc-doc edge rendering
- Zoom-based edge culling: skip low-similarity edges at low zoom levels
- Modular canvas engine from mono repo (renderer, simulation, viewport, hit-test)
- Remove vanilla-extract CSS, use inline styles only
- Add motion/react for slide-in animations
- Export mock data generator for stress testing
- Add performance and integration tests (15/15 pass)

Web app changes (apps/web):
- Remove local graph implementation (~4400 lines deleted)
- Add thin wrapper (memory-graph-wrapper.tsx) using useGraphApi hook
- Keep app-specific graph-card.tsx and use-graph-api.ts

Playground changes (apps/memory-graph-playground):
- Add stress test buttons (50/100/200/500 docs)
- Add mock data generation via package
- Convert DocumentWithMemories to GraphApiDocument format
- Show FPS counter during stress tests

All TypeScript compiles clean. Performance tests: 15/15 pass.
2026-03-26 17:58:28 +00:00
..
src Rewrite @supermemory/memory-graph with perf optimizations and consolidate consumers 2026-03-26 17:58:28 +00:00
.gitignore package the graph (#563) 2025-11-19 18:57:56 +00:00
.npmignore package the graph (#563) 2025-11-19 18:57:56 +00:00
CHANGELOG.md MemoryGraph - revamped (#627) 2025-12-29 00:32:26 +05:30
package.json Rewrite @supermemory/memory-graph with perf optimizations and consolidate consumers 2026-03-26 17:58:28 +00:00
README.md add docs for graph package (#603) 2025-12-04 18:56:40 +00:00
tsconfig.json Rewrite @supermemory/memory-graph with perf optimizations and consolidate consumers 2026-03-26 17:58:28 +00:00
vite.config.ts Rewrite @supermemory/memory-graph with perf optimizations and consolidate consumers 2026-03-26 17:58:28 +00:00

README.md

@supermemory/memory-graph

Interactive graph visualization for documents and their memory connections.

npm version License: MIT

Installation

npm install @supermemory/memory-graph
# or
bun add @supermemory/memory-graph
# or
pnpm add @supermemory/memory-graph

Quick Start

import { MemoryGraph } from '@supermemory/memory-graph';
import type { DocumentWithMemories } from '@supermemory/memory-graph';

function App() {
  const [documents, setDocuments] = useState<DocumentWithMemories[]>([]);
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    fetch('/api/graph')
      .then(res => res.json())
      .then(data => {
        setDocuments(data.documents);
        setIsLoading(false);
      });
  }, []);

  return (
    <div style={{ height: '100vh' }}>
      <MemoryGraph
        documents={documents}
        isLoading={isLoading}
        variant="console"
      />
    </div>
  );
}

Features

  • Interactive canvas visualization - Pan, zoom, and drag nodes using Canvas 2D rendering
  • Document and memory nodes - Documents as rectangles, memories as hexagons
  • Relationship visualization - Edges show document similarity and memory version chains
  • Space filtering - Filter by workspace or view all memories
  • Two variants - Full-featured console mode or embedded consumer mode
  • Pagination support - Load more documents on demand
  • TypeScript support - Full type definitions included

Essential Props

Prop Type Description
documents DocumentWithMemories[] Array of documents with their memory entries
isLoading boolean Show loading state
variant "console" | "consumer" Display mode (default: "console")
error Error | null Error to display
loadMoreDocuments () => Promise<void> Function to load more data
highlightDocumentIds string[] IDs of documents to highlight

Documentation

Full documentation available at docs.supermemory.ai:

Requirements

  • React 18+
  • Modern browser

License

MIT

Links