docs: expand ReMe documentation site (#451)

2026-08-28 05:25:04 +00:00 · 2026-08-12 13:18:40 +08:00 · 2026-08-12 13:18:40 +08:00 · dbf2a17da6
commit dbf2a17da6
parent 64249873ce
6 changed files with 292 additions and 38 deletions
--- a/README.md
+++ b/README.md
@ -63,12 +63,12 @@ keeping the files under the user's control.

 - [2026.08] - Published the [ReMe blog](docs/en/reme-blog.md), an end-to-end introduction to its local-first memory
  architecture, self-evolving workflows, hybrid search, proactive discovery, and benchmark results.
- [2026.08] - Introduced [ReMe Studio](website/README.md), a local web workspace for browsing, editing, and searching
+- [2026.08] - Introduced [ReMe Studio](https://reme.agentscope.io/?doc=studio-en), a local web workspace for browsing, editing, and searching
  memory files, chatting with the read-only ReMe Agent, inspecting the digest wikilink graph, and managing the local service.
- [2026.08] - [Experience-driven enhancement method](benchmark/toolmemory/README.md) of agent tool-use execution built
+- [2026.08] - [Experience-driven enhancement method](https://reme.agentscope.io/?doc=toolmemory-en) of agent tool-use execution built
  on ReMe is available on [arXiv:2608.03403](https://arxiv.org/abs/2608.03403).
- [2026.07] - Introduced optional Cookbooks: [Daily Paper](cookbook/daily_paper/README.md) for paper discovery and
-  analysis, and [Auto Fin](cookbook/auto-fin/README.md) for researching the latest 24 hours of topic-related CLS news
+- [2026.07] - Introduced optional Cookbooks: [Daily Paper](https://reme.agentscope.io/?doc=daily-paper-en) for paper discovery and
+  analysis, and [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-en) for researching the latest 24 hours of topic-related CLS news
  with local-memory search and validated historical wikilinks.
 - [2026.07] - Our
  paper [Remember Me, Refine Me: A Dynamic Procedural Memory Framework for Experience-Driven Agent Evolution](https://aclanthology.org/2026.findings-acl.829/)
@ -171,7 +171,7 @@ npm run dev

 Then open <http://localhost:3000>. The development server uses `http://127.0.0.1:2333` by default; set
 `NEXT_PUBLIC_REME_API_URL` to connect to another ReMe HTTP service. Static-build and frontend configuration instructions are
-in the [ReMe Studio guide](website/README.md).
+in the [ReMe Studio guide](https://reme.agentscope.io/?doc=studio-en).

 ### 5-Minute Memory Demo

@ -222,7 +222,7 @@ These Markdown guides cover the main user workflows and the runtime contracts im
 | [Proactive](docs/en/proactive.md) | Read interest topics safely and integrate them into a host agent's decision flow. |
 | [Agent Integration Scenarios](docs/en/reme_scene.md) | Choose among CLI/SKILL.md, HTTP, MCP, and embedded Python integration. |
 | [Framework](docs/en/framework.md) | Understand Application, Job, Step, Component, service, configuration, and lifecycle boundaries. |
-| [ReMe Studio](website/README.md) | Use, configure, develop, test, and build the web frontend. |
+| [ReMe Studio](https://reme.agentscope.io/?doc=studio-en) | Use, configure, develop, test, and build the web frontend. |
 | [ReMe Blog](docs/en/reme-blog.md) | Read the product story, design rationale, examples, and benchmark summary. |

 ## 🧑‍🍳 Cookbooks
@ -233,8 +233,8 @@ another row in this table.

 | Cookbook                                      | Capability                                                                                                    |
 |-----------------------------------------------|---------------------------------------------------------------------------------------------------------------|
-| [Daily Paper](cookbook/daily_paper/README.md) | Discover and rank papers, analyze PDFs with an agent, and generate file-native notes and a five-minute brief. |
-| [Auto Fin](cookbook/auto-fin/README.md)       | Fetch topic-related CLS news, search ReMe history, and generate wikilink-backed Markdown reports.             |
+| [Daily Paper](https://reme.agentscope.io/?doc=daily-paper-en) | Discover and rank papers, analyze PDFs with an agent, and generate file-native notes and a five-minute brief. |
+| [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-en)       | Fetch topic-related CLS news, search ReMe history, and generate wikilink-backed Markdown reports.             |

 ## 📁 Memory System

@ -338,12 +338,12 @@ benchmark.

 | Benchmark                                                    | Setting      |              Sample size | Agentic score | Focus                                                              |
 |--------------------------------------------------------------|--------------|-------------------------:|--------------:|--------------------------------------------------------------------|
-| **[LongMemEval cleaned-s](benchmark/longmemeval/README.md)** | **Overall**  |        **500 questions** |     **89.4%** | Cross-session retrieval, knowledge updates, and temporal reasoning |
-| [BEAM](benchmark/beam/README.md)                             | 100K context | 20 cases / 400 questions |         66.1% | Ten types of long-context memory tasks                             |
-| [BEAM](benchmark/beam/README.md)                             | 1M context   | 35 cases / 700 questions |         65.0% | Ultra-long conversation settings                                   |
+| **[LongMemEval cleaned-s](https://reme.agentscope.io/?doc=longmemeval-en)** | **Overall**  |        **500 questions** |     **89.4%** | Cross-session retrieval, knowledge updates, and temporal reasoning |
+| [BEAM](https://reme.agentscope.io/?doc=beam-en)                             | 100K context | 20 cases / 400 questions |         66.1% | Ten types of long-context memory tasks                             |
+| [BEAM](https://reme.agentscope.io/?doc=beam-en)                             | 1M context   | 35 cases / 700 questions |         65.0% | Ultra-long conversation settings                                   |

 ReMe also achieved a **0.580 PROC score across five user personas** in the repository's
-[π-Bench evaluation](benchmark/pibench/README.md), 2.4% above NanoBot under the same test-model configuration. PROC
+[π-Bench evaluation](https://reme.agentscope.io/?doc=pibench-en), 2.4% above NanoBot under the same test-model configuration. PROC
 measures proactive handling of hidden intent, clarification, cross-session preferences and conventions, task
 dependencies, and underspecified requests.

--- a/README_ZH.md
+++ b/README_ZH.md
@ -55,13 +55,13 @@ Code 等 Agent 协作，在持续整理知识的同时，始终把文件控制

 - [2026.08] - 发布 [ReMe 博客](docs/zh/reme-blog.md)，系统介绍本地优先的记忆架构、自进化工作流、混合检索、
  主动发现与评测结果。
- [2026.08] - 新增 [ReMe Studio](website/README_ZH.md)：用于浏览、编辑和搜索记忆文件，与只读 ReMe Agent
+- [2026.08] - 新增 [ReMe Studio](https://reme.agentscope.io/?doc=studio-zh)：用于浏览、编辑和搜索记忆文件，与只读 ReMe Agent
  对话，查看 digest wikilink 图，并管理本地服务。
 - [2026.08] - 基于 ReMe 的智能体工具使用
-  [经验驱动增强方法](benchmark/toolmemory/README_ZH.md)已发布，见
+  [经验驱动增强方法](https://reme.agentscope.io/?doc=toolmemory-zh)已发布，见
  [arXiv:2608.03403](https://arxiv.org/abs/2608.03403)。
- [2026.07] - 新增可选 Cookbook 工作流：[每日论文](cookbook/daily_paper/README_ZH.md)用于论文发现与解析，
-  [Auto Fin](cookbook/auto-fin/README_ZH.md)用于研究最近 24 小时的主题相关财联社新闻，通过本地记忆搜索回顾历史材料并构建
+- [2026.07] - 新增可选 Cookbook 工作流：[每日论文](https://reme.agentscope.io/?doc=daily-paper-zh)用于论文发现与解析，
+  [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-zh)用于研究最近 24 小时的主题相关财联社新闻，通过本地记忆搜索回顾历史材料并构建
  wikilink。
 - [2026.07] -
  我们的论文 [Remember Me, Refine Me: A Dynamic Procedural Memory Framework for Experience-Driven Agent Evolution](https://aclanthology.org/2026.findings-acl.829/)
@ -163,7 +163,7 @@ npm run dev
 ```

 然后打开 <http://localhost:3000>。开发服务默认连接 `http://127.0.0.1:2333`；如需连接其他 ReMe HTTP
-服务，请设置 `NEXT_PUBLIC_REME_API_URL`。静态构建和前端配置说明见 [ReMe Studio 指南](website/README_ZH.md)。
+服务，请设置 `NEXT_PUBLIC_REME_API_URL`。静态构建和前端配置说明见 [ReMe Studio 指南](https://reme.agentscope.io/?doc=studio-zh)。

 ### 5 分钟记忆 Demo

@ -214,7 +214,7 @@ ReMe 会把 Agent 记忆保存为可读的 Markdown。
 | [Proactive](docs/zh/proactive.md) | 安全读取兴趣主题，并将其接入宿主 Agent 的决策流程。 |
 | [Agent 接入场景](docs/zh/reme_scene.md) | 在 CLI/SKILL.md、HTTP、MCP 和嵌入式 Python 集成之间选择。 |
 | [框架说明](docs/zh/framework.md) | 理解 Application、Job、Step、Component、service、配置和生命周期边界。 |
-| [ReMe Studio](website/README_ZH.md) | 使用、配置、开发、测试和构建 Web 前端。 |
+| [ReMe Studio](https://reme.agentscope.io/?doc=studio-zh) | 使用、配置、开发、测试和构建 Web 前端。 |
 | [ReMe 博客](docs/zh/reme-blog.md) | 了解完整产品故事、设计动机、使用示例和评测摘要。 |

 ## 🧑‍🍳 Cookbooks
@ -224,8 +224,8 @@ cookbook 会继续在表格中按行追加。

 | Cookbook                                      | 能力                                                                           |
 |-----------------------------------------------|--------------------------------------------------------------------------------|
-| [每日论文](cookbook/daily_paper/README_ZH.md) | 发现并排序论文，使用 Agent 解读 PDF，生成文件化论文笔记和五分钟简报。          |
-| [Auto Fin](cookbook/auto-fin/README_ZH.md)    | 拉取主题相关财联社新闻，搜索 ReMe 历史材料并生成带 wikilink 的 Markdown 报告。 |
+| [每日论文](https://reme.agentscope.io/?doc=daily-paper-zh) | 发现并排序论文，使用 Agent 解读 PDF，生成文件化论文笔记和五分钟简报。          |
+| [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-zh)    | 拉取主题相关财联社新闻，搜索 ReMe 历史材料并生成带 wikilink 的 Markdown 报告。 |

 ## 📁 记忆系统

@ -320,11 +320,11 @@ ReMe 通过 Agent 多轮搜索与读取的方式，评测多会话和超长上

 | 基准                                                            | 设置        |            样本量 | Agentic 得分 | 主要检验内容                   |
 |-----------------------------------------------------------------|-------------|------------------:|-------------:|--------------------------------|
-| **[LongMemEval cleaned-s](benchmark/longmemeval/README_ZH.md)** | **整体**    |        **500 题** |    **89.4%** | 跨会话检索、知识更新与时间推理 |
-| [BEAM](benchmark/beam/README_ZH.md)                             | 100K 上下文 | 20 cases / 400 题 |        66.1% | 十类长上下文记忆任务           |
-| [BEAM](benchmark/beam/README_ZH.md)                             | 1M 上下文   | 35 cases / 700 题 |        65.0% | 超长对话设置                   |
+| **[LongMemEval cleaned-s](https://reme.agentscope.io/?doc=longmemeval-zh)** | **整体**    |        **500 题** |    **89.4%** | 跨会话检索、知识更新与时间推理 |
+| [BEAM](https://reme.agentscope.io/?doc=beam-zh)                             | 100K 上下文 | 20 cases / 400 题 |        66.1% | 十类长上下文记忆任务           |
+| [BEAM](https://reme.agentscope.io/?doc=beam-zh)                             | 1M 上下文   | 35 cases / 700 题 |        65.0% | 超长对话设置                   |

-在仓库的 [π-Bench 评测](benchmark/pibench/README_ZH.md)中，ReMe Agent 在 5 种用户角色上的平均 **PROC 得分为 0.580**
+在仓库的 [π-Bench 评测](https://reme.agentscope.io/?doc=pibench-zh)中，ReMe Agent 在 5 种用户角色上的平均 **PROC 得分为 0.580**
 ，比相同测试模型配置的 NanoBot 高 2.4%。PROC 用于评估隐藏意图完成、针对性澄清、跨会话偏好和规范复用、跨任务依赖推断以及欠规格请求推进等主动性能力。

 ## 🤝 Agent-friendly Integration
--- a/github-pages/README.md
+++ b/github-pages/README.md
@ -50,6 +50,9 @@ The build script reads the canonical repository files directly. Do not edit gene
 - `README.md` and `README_ZH.md`: project introductions
 - `docs/en/` and `docs/zh/`: English and Chinese guides
 - `docs/figure/`: documentation images
+- `website/README.md` and `website/README_ZH.md`: ReMe Studio guide
+- `cookbook/*/README*.md`: research workflow guides
+- `benchmark/{beam,longmemeval,pibench,toolmemory}/README*.md`: benchmark guides and results
 - `skills/reme_memory/SKILL.md`: ReMe Memory skill guide
 - `AGENTS.md`: repository development guide

--- a/github-pages/scripts/generate-content.mjs
+++ b/github-pages/scripts/generate-content.mjs
@ -51,6 +51,79 @@ const localizedTitles = {
  contributing: { zh: "开源与贡献", en: "Open Source and Contributing" },
 };

+const productDocuments = [
+  {
+    slug: "studio",
+    source: "website",
+    titles: { zh: "ReMe 工作台", en: "ReMe Studio" },
+    descriptions: {
+      zh: "浏览、编辑和搜索本地记忆，并探索记忆图谱。",
+      en: "Browse, edit, search, and explore local memory from the web workspace.",
+    },
+    group: "workspace",
+  },
+  {
+    slug: "daily-paper",
+    source: "cookbook/daily_paper",
+    titles: { zh: "每日论文", en: "Daily Paper" },
+    descriptions: {
+      zh: "发现论文、解析 PDF，并生成阅读笔记与每日简报。",
+      en: "Discover papers, analyze PDFs, and produce reading notes and a daily brief.",
+    },
+    group: "cookbooks",
+  },
+  {
+    slug: "auto-fin",
+    source: "cookbook/auto-fin",
+    titles: { zh: "财经研究", en: "Auto Fin" },
+    descriptions: {
+      zh: "结合最新财联社新闻与本地历史记忆生成研究报告。",
+      en: "Research recent CLS news with historical context from local memory.",
+    },
+    group: "cookbooks",
+  },
+  {
+    slug: "beam",
+    source: "benchmark/beam",
+    titles: { zh: "BEAM", en: "BEAM" },
+    descriptions: {
+      zh: "评测大规模记忆检索能力。",
+      en: "Evaluate memory retrieval at scale.",
+    },
+    group: "benchmarks",
+  },
+  {
+    slug: "longmemeval",
+    source: "benchmark/longmemeval",
+    titles: { zh: "LongMemEval", en: "LongMemEval" },
+    descriptions: {
+      zh: "评测跨会话长期记忆问答能力。",
+      en: "Evaluate long-term, cross-session memory question answering.",
+    },
+    group: "benchmarks",
+  },
+  {
+    slug: "pibench",
+    source: "benchmark/pibench",
+    titles: { zh: "π-Bench", en: "π-Bench" },
+    descriptions: {
+      zh: "评测带持久记忆的个人智能体。",
+      en: "Evaluate personal agents with persistent memory.",
+    },
+    group: "benchmarks",
+  },
+  {
+    slug: "toolmemory",
+    source: "benchmark/toolmemory",
+    titles: { zh: "Tool Memory / ExpG", en: "Tool Memory / ExpG" },
+    descriptions: {
+      zh: "通过经验驱动的自适应指导增强 Agent 工具使用。",
+      en: "Improve agent tool use through experience-driven adaptive guidance.",
+    },
+    group: "benchmarks",
+  },
+];
+
 const sharedDocuments = [
  {
    id: "reme-memory-skill",
@ -118,6 +191,19 @@ async function buildManifest() {
        language,
      });
    }
+
+    for (const product of productDocuments) {
+      const filename = language === "zh" ? "README_ZH.md" : "README.md";
+      documents.push({
+        id: `${product.slug}-${language}`,
+        path: `${product.source}/${filename}`,
+        sourcePath: `${product.source}/${filename}`,
+        title: product.titles[language],
+        description: product.descriptions[language],
+        group: product.group,
+        language,
+      });
+    }
  }

  return [...documents, ...sharedDocuments];
@ -135,6 +221,14 @@ await cp(path.join(repoDir, "docs"), path.join(outputDir, "docs"), {
  recursive: true,
  filter: (source) => path.basename(source) !== ".DS_Store",
 });
+for (const product of productDocuments) {
+  await mkdir(path.join(outputDir, product.source), { recursive: true });
+  for (const filename of ["README.md", "README_ZH.md"]) {
+    await cp(path.join(repoDir, product.source, filename), path.join(outputDir, product.source, filename));
+  }
+}
+await mkdir(path.join(outputDir, "website", "public"), { recursive: true });
+await cp(path.join(repoDir, "website", "public", "og.png"), path.join(outputDir, "website", "public", "og.png"));
 await mkdir(path.join(outputDir, "skills", "reme_memory"), { recursive: true });
 await cp(
  path.join(repoDir, "skills", "reme_memory", "SKILL.md"),
--- a/github-pages/src/main.js
+++ b/github-pages/src/main.js
@ -4,17 +4,17 @@ import "./styles.css";

 const baseUrl = import.meta.env.BASE_URL;
 const repositoryUrl = "https://github.com/agentscope-ai/ReMe";
-const officialDocsUrl = "https://reme.agentscope.io";

 const copy = {
  zh: {
    docs: "文档",
+    home: "首页",
    search: "搜索文档…",
    noResults: "没有找到匹配的文档",
    menu: "打开导航",
    toc: "本页目录",
    edit: "在 GitHub 查看源文件",
-    officialDocs: "官方文档",
+    quickStart: "快速开始",
    groups: {
      overview: "项目介绍",
      start: "开始使用",
@ -22,17 +22,21 @@ const copy = {
      automation: "自动化能力",
      concepts: "架构与场景",
      integration: "Agent 集成",
+      workspace: "工作区",
+      cookbooks: "研究工作流",
+      benchmarks: "评测",
      development: "开发者规范",
    },
  },
  en: {
    docs: "Documentation",
+    home: "Home",
    search: "Search documentation…",
    noResults: "No matching documents",
    menu: "Open navigation",
    toc: "On this page",
    edit: "View source on GitHub",
-    officialDocs: "Official docs",
+    quickStart: "Quick start",
    groups: {
      overview: "Introduction",
      start: "Get started",
@ -40,6 +44,9 @@ const copy = {
      automation: "Automation",
      concepts: "Architecture & scenarios",
      integration: "Agent integration",
+      workspace: "Workspace",
+      cookbooks: "Research workflows",
+      benchmarks: "Benchmarks",
      development: "Development",
    },
  },
@ -52,6 +59,43 @@ const state = {
  query: "",
 };

+const homeCopy = {
+  zh: {
+    eyebrow: "LOCAL-FIRST · FILE-NATIVE",
+    title: "让 Agent 真正记住，\n也让记忆始终属于你。",
+    description: "ReMe 将对话和资料沉淀为可读、可编辑、可检索、相互链接的 Markdown，并提供从工作区管理到主动研究的一整套工具。",
+    start: "快速开始",
+    project: "了解 ReMe",
+    explore: "按目标探索",
+    exploreDescription: "选择你现在想完成的事情。每个入口都直接连接到对应的完整文档。",
+    cards: [
+      { id: "studio-zh", icon: "◫", label: "管理记忆", title: "ReMe 工作台", description: "在本地 Web 工作区中浏览、编辑、搜索记忆，并探索 wikilink 图谱。", tone: "mint" },
+      { id: "daily-paper-zh", icon: "◌", label: "发现与分析", title: "每日论文", description: "从论文榜单筛选值得阅读的工作，解析 PDF，并生成笔记与五分钟简报。", tone: "blue" },
+      { id: "auto-fin-zh", icon: "↗", label: "主题研究", title: "财经研究", description: "连接最新财联社新闻和本地历史记忆，生成可追溯的研究报告。", tone: "amber" },
+    ],
+    benchmark: "验证记忆能力",
+    benchmarkDescription: "从检索规模、跨会话问答、个人智能体到工具经验，查看 ReMe 的四套评测与复现实验。",
+    benchmarkAction: "浏览全部评测",
+  },
+  en: {
+    eyebrow: "LOCAL-FIRST · FILE-NATIVE",
+    title: "Memory that works for agents.\nFiles that remain yours.",
+    description: "ReMe turns conversations and resources into readable, editable, searchable, interconnected Markdown—with tools spanning workspace management and proactive research.",
+    start: "Quick start",
+    project: "Meet ReMe",
+    explore: "Explore by goal",
+    exploreDescription: "Start with what you want to accomplish. Every entry opens the complete guide.",
+    cards: [
+      { id: "studio-en", icon: "◫", label: "Manage memory", title: "ReMe Studio", description: "Browse, edit, and search memory in a local web workspace, then explore its wikilink graph.", tone: "mint" },
+      { id: "daily-paper-en", icon: "◌", label: "Discover & analyze", title: "Daily Paper", description: "Select useful papers from rankings, analyze PDFs, and create notes plus a five-minute brief.", tone: "blue" },
+      { id: "auto-fin-en", icon: "↗", label: "Research topics", title: "Auto Fin", description: "Connect recent CLS news with historical local memory to produce traceable research reports.", tone: "amber" },
+    ],
+    benchmark: "Validate memory systems",
+    benchmarkDescription: "Explore four reproducible evaluations covering retrieval scale, cross-session QA, personal agents, and tool-use experience.",
+    benchmarkAction: "Browse all benchmarks",
+  },
+};
+
 const app = document.querySelector("#app");

 app.innerHTML = `
@ -67,7 +111,7 @@ app.innerHTML = `
        <button type="button" data-language="zh">中</button>
        <button type="button" data-language="en">EN</button>
      </div>
-      <a class="official-docs-link" href="${officialDocsUrl}" target="_blank" rel="noreferrer" data-copy="officialDocs"></a>
+      <a class="quick-start-link" href="?doc=zh-quick_start" data-doc="zh-quick_start" data-copy="quickStart"></a>
      <a class="github-link" href="${repositoryUrl}" target="_blank" rel="noreferrer">GitHub ↗</a>
      <button class="menu-button" type="button" aria-expanded="false" data-action="menu"></button>
    </nav>
@ -94,6 +138,7 @@ app.innerHTML = `
 `;

 const sidebar = app.querySelector(".sidebar");
+const docsShell = app.querySelector(".docs-shell");
 const documentNav = app.querySelector(".document-nav");
 const article = app.querySelector(".article");
 const toc = app.querySelector(".toc");
@ -172,7 +217,10 @@ function documentTitle(document) {
 function renderChrome() {
  const labels = copy[state.language];
  app.querySelector("[data-copy='docs']").textContent = labels.docs;
-  app.querySelector("[data-copy='officialDocs']").textContent = `${labels.officialDocs} ↗`;
+  const quickStartLink = app.querySelector("[data-copy='quickStart']");
+  quickStartLink.textContent = `${labels.quickStart} →`;
+  quickStartLink.href = `?doc=${state.language}-quick_start`;
+  quickStartLink.dataset.doc = `${state.language}-quick_start`;
  searchInput.placeholder = labels.search;
  menuButton.textContent = labels.menu;
  document.documentElement.lang = state.language === "zh" ? "zh-CN" : "en";
@ -190,11 +238,16 @@ function renderNavigation() {
  const groups = [...new Set(filtered.map((document) => document.group))];

  if (!filtered.length) {
-    documentNav.innerHTML = `<p class="empty-state">${labels.noResults}</p>`;
+    documentNav.innerHTML = `
+      <a href="${baseUrl}" data-home class="home-link ${state.activeDocument ? "" : "active"}">${labels.home}</a>
+      <p class="empty-state">${labels.noResults}</p>
+    `;
    return;
  }

-  documentNav.innerHTML = groups
+  documentNav.innerHTML = `
+    <a href="${baseUrl}" data-home class="home-link ${state.activeDocument ? "" : "active"}">${labels.home}</a>
+  ` + groups
    .map(
      (group) => `
        <section class="nav-group">
@ -213,6 +266,52 @@ function renderNavigation() {
    .join("");
 }

+function renderHome(pushHistory = true) {
+  const labels = homeCopy[state.language];
+  state.activeDocument = null;
+  docsShell.classList.add("home-view");
+  article.dataset.group = "home";
+  renderNavigation();
+  article.innerHTML = `
+    <section class="home-hero">
+      <p class="home-eyebrow">${labels.eyebrow}</p>
+      <h1>${labels.title.replace("\n", "<br>")}</h1>
+      <p class="home-lead">${labels.description}</p>
+      <div class="home-actions">
+        <a href="?doc=${state.language}-quick_start" data-doc="${state.language}-quick_start" class="primary-action">${labels.start} →</a>
+        <a href="?doc=readme-${state.language}" data-doc="readme-${state.language}" class="secondary-action">${labels.project}</a>
+      </div>
+    </section>
+    <section class="home-explore">
+      <p class="section-kicker">01 / PRODUCT & WORKFLOWS</p>
+      <h2>${labels.explore}</h2>
+      <p class="section-lead">${labels.exploreDescription}</p>
+      <div class="feature-grid">
+        ${labels.cards.map((card) => `
+          <a href="?doc=${card.id}" data-doc="${card.id}" class="feature-card ${card.tone}">
+            <span class="feature-icon">${card.icon}</span>
+            <span class="feature-label">${card.label}</span>
+            <strong>${card.title}</strong>
+            <span class="feature-description">${card.description}</span>
+            <span class="feature-arrow">→</span>
+          </a>`).join("")}
+      </div>
+    </section>
+    <section class="benchmark-callout">
+      <div>
+        <p class="section-kicker">02 / BENCHMARKS</p>
+        <h2>${labels.benchmark}</h2>
+        <p>${labels.benchmarkDescription}</p>
+      </div>
+      <a href="?doc=beam-${state.language}" data-doc="beam-${state.language}">${labels.benchmarkAction} →</a>
+    </section>
+  `;
+  toc.innerHTML = "";
+  closeMenu();
+  if (pushHistory) history.pushState({ home: true }, "", baseUrl);
+  window.scrollTo({ top: 0, behavior: "instant" });
+}
+
 function renderToc() {
  const headings = [...article.querySelectorAll("h2, h3")];
  if (!headings.length) {
@ -257,7 +356,13 @@ function rewriteRenderedUrls(document) {
 async function openDocument(id, pushHistory = true) {
  const fallbackId = state.language === "zh" ? "readme-zh" : "readme-en";
  const document = state.documents.find((item) => item.id === id) || state.documents.find((item) => item.id === fallbackId);
+  if (document.language !== "shared" && document.language !== state.language) {
+    state.language = document.language;
+    localStorage.setItem("reme-docs-language", state.language);
+    renderChrome();
+  }
  state.activeDocument = document;
+  docsShell.classList.remove("home-view");
  article.dataset.group = document.group;
  renderNavigation();
  article.innerHTML = `<div class="loading-line"></div>`;
@ -301,6 +406,12 @@ function toggleMenu() {
 }

 app.addEventListener("click", (event) => {
+  const homeLink = event.target.closest("[data-home]");
+  if (homeLink) {
+    event.preventDefault();
+    renderHome();
+    return;
+  }
  const documentLink = event.target.closest("[data-doc]");
  if (documentLink) {
    event.preventDefault();
@ -314,7 +425,7 @@ app.addEventListener("click", (event) => {
    state.query = "";
    searchInput.value = "";
    renderChrome();
-    openDocument(state.language === "zh" ? "readme-zh" : "readme-en");
+    renderHome();
  }
 });

@ -332,9 +443,15 @@ document.addEventListener("keydown", (event) => {
 });

 backdrop.addEventListener("click", closeMenu);
-window.addEventListener("popstate", (event) => openDocument(event.state?.doc || new URLSearchParams(location.search).get("doc"), false));
+window.addEventListener("popstate", (event) => {
+  const id = event.state?.doc || new URLSearchParams(location.search).get("doc");
+  if (id) openDocument(id, false);
+  else renderHome(false);
+});

 const manifest = await fetch(`${baseUrl}content/manifest.json`).then((response) => response.json());
 state.documents = manifest.documents;
 renderChrome();
-await openDocument(new URLSearchParams(location.search).get("doc"), false);
+const initialDocument = new URLSearchParams(location.search).get("doc");
+if (initialDocument) await openDocument(initialDocument, false);
+else renderHome(false);
--- a/github-pages/src/styles.css
+++ b/github-pages/src/styles.css
@ -56,21 +56,26 @@ a { color: inherit; }
 .brand-divider { width: 1px; height: 20px; background: var(--line); margin-left: 2px; }
 .brand-section { color: var(--muted); font-weight: 520; }
 .top-actions { display: flex; align-items: center; gap: 18px; }
-.github-link, .official-docs-link { color: #37443d; text-decoration: none; font-size: 13px; font-weight: 650; }
-.github-link:hover, .official-docs-link:hover { color: var(--green); }
-.official-docs-link { padding: 8px 12px; border: 1px solid #d7e5df; border-radius: 9px; background: rgba(255, 255, 255, 0.72); }
+.github-link, .quick-start-link { color: #37443d; text-decoration: none; font-size: 13px; font-weight: 650; }
+.github-link:hover, .quick-start-link:hover { color: var(--green); }
+.quick-start-link { padding: 8px 12px; border: 1px solid #d7e5df; border-radius: 9px; background: rgba(255, 255, 255, 0.72); }
 .language-switch { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: #f5f7f4; }
 .language-switch button { padding: 5px 9px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; cursor: pointer; font-size: 12px; font-weight: 700; }
 .language-switch button.active { color: var(--ink); background: white; box-shadow: 0 1px 3px rgba(20, 40, 30, 0.1); }
 .menu-button { display: none; border: 1px solid var(--line); border-radius: 8px; background: white; padding: 7px 10px; cursor: pointer; }

 .docs-shell { display: grid; grid-template-columns: 276px minmax(0, 1fr) 224px; max-width: 1540px; min-height: 100vh; margin: 0 auto; padding-top: 66px; }
+.docs-shell.home-view { grid-template-columns: 276px minmax(0, 1fr); }
+.docs-shell.home-view .toc-panel { display: none; }
 .sidebar { position: sticky; top: 66px; height: calc(100vh - 66px); padding: 25px 20px 18px; overflow-y: auto; border-right: 1px solid var(--line); background: rgba(247, 250, 248, 0.78); }
 .search-box { display: flex; align-items: center; gap: 8px; height: 41px; padding: 0 11px; border: 1px solid #d8e3dd; border-radius: 11px; color: #7a857e; background: rgba(255, 255, 255, 0.84); box-shadow: 0 5px 18px rgba(29, 65, 48, 0.035); }
 .search-box:focus-within { border-color: #78aa8e; box-shadow: 0 0 0 3px rgba(22, 120, 76, 0.1); }
 .search-box input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 13px; }
 .search-box kbd { padding: 2px 5px; border: 1px solid var(--line); border-radius: 4px; background: #f7f8f6; font-size: 10px; }
 .document-nav { padding: 12px 0 52px; }
+.home-link { position: relative; display: block; margin-top: 9px; padding: 9px 10px 9px 13px; border-radius: 8px; color: #536058; text-decoration: none; font-size: 13px; }
+.home-link:hover { color: var(--ink); background: #f0f3ef; }
+.home-link.active { color: #086b5a; background: linear-gradient(90deg, #dff3ec, #eaf6f2); font-weight: 700; }
 .nav-group { margin-top: 21px; }
 .nav-group h2 { margin: 0 10px 7px; color: #8a948e; font-size: 10px; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; }
 .nav-group a { position: relative; display: block; padding: 7px 10px 7px 13px; border-radius: 8px; color: #536058; text-decoration: none; font-size: 13px; line-height: 1.4; }
@ -83,6 +88,35 @@ a { color: inherit; }

 .article-wrap { min-width: 0; padding: 58px clamp(32px, 5.8vw, 86px) 100px; background: rgba(255, 255, 255, 0.94); }
 .article { width: 100%; max-width: 820px; margin: 0 auto; }
+.article[data-group="home"] { max-width: 980px; }
+.home-hero { padding: 34px 0 76px; }
+.home-eyebrow, .section-kicker { margin: 0 0 17px; color: #12806d; font: 750 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.13em; }
+.home-hero h1 { max-width: 800px; margin: 0; color: #102019; font-size: clamp(46px, 6.3vw, 76px); line-height: 0.99; letter-spacing: -0.055em; }
+.home-lead { max-width: 720px; margin: 27px 0 0; color: #526159; font-size: 18px; line-height: 1.72; }
+.home-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 31px; }
+.home-actions a { padding: 11px 17px; border-radius: 10px; text-decoration: none; font-size: 14px; font-weight: 720; }
+.primary-action { color: white; background: #087f6a; box-shadow: 0 8px 22px rgba(8, 127, 106, 0.2); }
+.secondary-action { border: 1px solid #d5e2dc; color: #34443c; background: white; }
+.home-explore { padding-top: 58px; border-top: 1px solid var(--line); }
+.home-explore h2, .benchmark-callout h2 { margin: 0; color: #15251d; font-size: 30px; letter-spacing: -0.025em; }
+.section-lead { max-width: 620px; margin: 10px 0 25px; color: var(--muted); line-height: 1.65; }
+.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
+.feature-card { position: relative; display: flex; min-height: 260px; flex-direction: column; padding: 23px; overflow: hidden; border: 1px solid #dce8e2; border-radius: 16px; color: var(--ink); background: linear-gradient(155deg, #fff, #f4faf7); text-decoration: none; transition: transform 160ms ease, box-shadow 160ms ease; }
+.feature-card:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(29, 68, 49, 0.1); }
+.feature-card.blue { background: linear-gradient(155deg, #fff, #f1f5ff); }
+.feature-card.amber { background: linear-gradient(155deg, #fff, #fbf7ec); }
+.feature-icon { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 32px; border-radius: 12px; color: #08705e; background: #dbf2ea; font-size: 22px; }
+.blue .feature-icon { color: #3156b8; background: #e5ebff; }
+.amber .feature-icon { color: #9b6818; background: #f8eac8; }
+.feature-label { margin-bottom: 7px; color: #718078; font: 700 10px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.08em; text-transform: uppercase; }
+.feature-card strong { font-size: 20px; }
+.feature-description { margin-top: 10px; color: #66736c; font-size: 13px; line-height: 1.6; }
+.feature-arrow { position: absolute; right: 22px; bottom: 18px; color: #6a7870; font-size: 19px; }
+.benchmark-callout { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-top: 62px; padding: 36px; border-radius: 17px; color: white; background: linear-gradient(125deg, #142a22, #1c473b); }
+.benchmark-callout .section-kicker { color: #74d4bb; }
+.benchmark-callout h2 { color: white; }
+.benchmark-callout p:not(.section-kicker) { max-width: 610px; margin: 10px 0 0; color: #c3d4cd; line-height: 1.65; }
+.benchmark-callout > a { flex: none; padding: 10px 14px; border: 1px solid rgba(255,255,255,.25); border-radius: 9px; color: white; text-decoration: none; font-size: 13px; font-weight: 700; }
 .article-meta { display: flex; gap: 8px; margin-bottom: 22px; color: #7d8d84; font: 600 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; }
 .article-meta span:first-child { padding: 3px 8px; border-radius: 999px; color: #08705e; background: #e6f5ef; }
 .markdown-body { color: #27332d; font-size: 16px; line-height: 1.78; }
@ -143,7 +177,7 @@ a { color: inherit; }
@media (max-width: 760px) {
  .topbar { height: 60px; padding: 0 16px; }
  .brand-section, .brand-divider, .github-link { display: none; }
-  .official-docs-link { font-size: 12px; }
+  .quick-start-link { font-size: 12px; }
  .menu-button { display: block; max-width: 112px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .top-actions { gap: 9px; }
  .docs-shell { display: block; padding-top: 60px; }
@ -157,4 +191,10 @@ a { color: inherit; }
  .markdown-body h1 { font-size: 34px; }
  .markdown-body h2 { margin-top: 46px; font-size: 24px; }
  .article[data-group="overview"] .markdown-body > p:first-child img { max-width: 84%; }
+  .home-hero { padding: 20px 0 54px; }
+  .home-hero h1 { font-size: 43px; }
+  .home-lead { font-size: 16px; }
+  .feature-grid { grid-template-columns: 1fr; }
+  .feature-card { min-height: 225px; }
+  .benchmark-callout { align-items: flex-start; flex-direction: column; padding: 28px 24px; }
 }