跳转到内容

Panolayer Studio · 架构

看清谁调用了谁。

Panolayer 会梳理你仓库中的服务、模块、函数、调用方与依赖关系。这张图直接解析自源码,因此同一份代码始终得到同一张图,你的 Agent 与 Verification Engine 也基于它工作。

Apple silicon 上的 macOS 15 · 免费开始使用 · 无需信用卡

Architecture · from system to source

Panolayer architecture map with application groups, functions and their connected dependencies.

完整截图 · 滚动查看细节

你已经深入某个服务三层,却还在琢磨到底是谁在调用它。

文件树只能显示代码放在哪里,不能显示谁依赖它。面对 Agent 编写的代码,这更难:团队里没人写过它,而 diff 有 2,000 行。Panolayer 让你按调用关系而不是按文件夹来浏览代码。

你可以做什么

从整个系统到一行代码

01

从整个系统开始

打开一个代码仓库,查看其中的服务、每个服务内部的内容,以及它们之间的连接关系。

Start at the repository

Start at the repository

The architecture diagram connects the repository to API Routes, Application Pages, Other, Shared Libraries and UI Components.

完整截图 · 滚动查看细节

02

逐层下钻到你需要的位置

从服务到模块再到函数。图示视图、列视图和路径视图以三种方式展示同一结构。

Open a function. Go straight to its source.

Open a function. Go straight to its source.

The recorded walkthrough opens the pick function from UserSwitcher in the architecture map, revealing its source, summary and verification results.

完整截图 · 滚动查看细节

03

在上下文中阅读任意函数

打开 getPrice(),查看它的作用、输入与输出、调用方、依赖项、适用的规则以及验证状态。

Architecture · source and rules together

Architecture · source and rules together

Panolayer Studio source view showing a PATCH handler, its function summary, and a failed rule at line 65.

完整截图 · 滚动查看细节

04

看清一处改动会波及哪些地方

把 getPrice() 从以分为单位改为以美元为单位,架构图会显示它在任何改动上线前就已波及商品页、购物车和结算流程。

Follow a component into its functions

Follow a component into its functions

The architecture map connects the UserSwitcher component to its pick function, alongside UserSwitcherProps and neighboring components.

完整截图 · 滚动查看细节

05

你的 Agent 看到的是同一张架构图

Agent 可以通过 MCP 工具查询架构图,获取结构、调用方和依赖关系,Verification Engine 则会依据这张图校验它们的改动。

Panolayer Agent · answers grounded in your source

Panolayer Agent · answers grounded in your source

Panolayer Agent explains the posting workflow with references to the repository's routes, validation and data types.

完整截图 · 滚动查看细节

活文档

跟得上代码的文档

询问代码库中的任何部分,即可得到一份基于架构编写的文档,其中的每条论述都链接到源码。代码变更后可重新生成。

Living Documents 的工作原理

Living documents · source-linked context

A living document explaining a feature with links to source files and line numbers.

完整截图 · 滚动查看细节

问题

还有其他问题?联系我们,我们会为你解答。

这张图是由 LLM 生成的吗?

不是。结构是从源码中解析出来的。模型可以在你要求时补充通俗的描述,但绝不决定结构。

不运行 agent 也能用这张图吗?

可以。它可以独立使用,帮你在陌生的代码中辨明方向。

支持哪些语言?

TypeScript、JavaScript、Python、Go、Rust、Java 等。动态调用和生成的代码较难追踪,可能需要人工查看。在文档中查看完整列表。

能用于 monorepo 吗?

可以。

在你的代码库上试用 Panolayer。

免费开始使用 · 无需信用卡

Panolayer 如何处理你的代码

下一步:活文档