文章介绍了@codemix/graph图数据库工具，支持实时同步和查询功能。演示了全球航线数据查询和互动头像墙两个应用场景，用户可拖拽头像建立连接并实时同步。该工具基于Yjs CRDT技术实现多标签页同步，提供TypeScript支持，可通过npm安装。文章还展示了如何用zod定义图数据库的顶点、边和索引模式。

@codemix/graph 图数据库工具介绍

产品演示

全球航线演示

• 将真实航线数据加载到图中，并使用TypeScript进行查询
• 查看实时演示

互动墙功能

• 基于@codemix/graph和@codemix/y-graph-storage构建
• 支持实时协作：添加头像、重新排列、绘制连接线
• 所有更改通过Y.js CRDT技术实时同步
• 体验实时演示

安装与使用

安装

bash $ pnpm add @codemix/graph 注意：目前为alpha版本，已在codemix生产环境使用，但建议用户谨慎使用。

定义数据模型

```typescript import { Graph, GraphSchema } from "@codemix/graph"; import { z } from "zod";

const schema = { vertices: { User: { properties: { email: { type: z.email(), index: { type: "hash", unique: true } }, name: { type: z.string() }, }, }, Repo: { properties: { name: { type: z.string() }, stars: { type: z.number() }, }, }, }, edges: { OWNS: { properties: {} }, FOLLOWS: { properties: {} }, }, } as const satisfies GraphSchema; ```

数据操作

```typescript // 添加顶点 const alice = graph.addVertex("User", { name: "Alice", email: "alice@example.com" });

// 添加边 graph.addEdge(alice, "OWNS", myRepo, {});

// 更新属性 graph.updateProperty(myRepo, "stars", 42); ```

查询功能

类型安全查询

```typescript const g = new GraphTraversal(graph);

// 基本查询 for (const path of g.V().hasLabel("User")) { path.value.get("name"); // 自动类型推断 }

// 属性过滤 const seniors = g.V() .hasLabel("User") .where((v) => v.get("name").startsWith("A"));

// 边遍历 for (const path of g.V() .hasLabel("User") .out("OWNS").hasLabel("Repo")) { path.value.get("stars"); } ```

实时协作功能

Y.js集成

```typescript import { YGraph } from "@codemix/y-graph-storage";

const doc = new Y.Doc(); const graph = new YGraph({ schema, doc });

// 支持WebSocket等多种同步方式 const provider = new WebsocketProvider("wss://my-server", "graph-room", doc); ```

实时查询

```typescript const topRepos = graph.query((g) => g.V().hasLabel("Repo").order("stars", "desc").limit(10) );

topRepos.subscribe({ next() { for (const path of topRepos) { console.log(path.value.get("name"), path.value.get("stars")); } }, }); ```

Cypher查询支持

``typescript const { steps } = parseQueryToSteps( MATCH (u:User)-[:OWNS]->(r:Repo) WHERE r.stars > 100 RETURN u.name, r.name `);

const traverser = createTraverser(steps); for (const row of traverser.traverse(graph, [])) { console.log(row); } ```

产品背景

• 许可证：MIT
• 创始人：Charles Pick（codemix创始人，ts-sql作者）
• 开发背景：为构建结构化知识图谱需求而开发
• GitHub仓库

关于codemix

codemix是一个统一的产品知识管理平台，能够： - 捕获业务领域、用户流程等核心概念 - 通过聊天、图表或协作编辑变更产品 - 支持AI开发代理共享上下文 - 支持新建项目或导入现有代码库

免费试用

（注：保留了所有技术细节和核心功能介绍，删减了部分重复的示例代码和次要说明）

以下是评论内容的总结：

1. 关于技术实现的讨论

   • 有评论认为使用TypeScript实现图数据库可能存在性能问题，质疑其是否适合高要求的图数据库场景。
     引用："Can anyone explain why it is a good idea to make a graphdb in typescript?"
     引用："It seems like this could be a performance trap."
   • 另一观点认为Cypher-over-Gremlin的设计是明智的，尤其是结合LLM的能力。
     引用："Cypher-over-Gremlin is a smart call — LLMs can write Cypher."

2. 对复杂设计的质疑

   • 有评论认为当前设计过于复杂，整合了多种技术（Gremlin、Cypher、Yjs、Zod），并建议使用更简单的方案如Datalog。
     引用："What’s the advantage of using all these different things in one system? You can do all of this in datalog."
     引用："JS implementations exist."

3. 对实际应用的关注

   • 有评论提到Yjs作为存储后端的优势，尤其是其CRDT同步功能。
     引用："The Yjs as storage backend trick is clever, you basically get CRDT sync for free."
     引用："The live queries also caught my eye."
   • 也有评论对本地优先应用架构和CRDT表示兴趣。
     引用："I’m really digging into CRDT and trying to get familiar with it."

4. 其他反馈

   • 有评论对链式方法模式表示不满，认为其在单元测试中带来不便。
     引用："These days I don’t like it anymore. Especially when it comes to unit-testing."
   • 另有评论直接询问性能基准和Safari兼容性问题。
     引用："Got benchmarks?"
     引用："The page keeps crashing on safari."

总结：评论中对技术实现、设计复杂性和实际应用价值有不同观点，既有对某些设计选择的肯定，也有对性能和复杂性的担忧。