diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts
index 9a9228d..2915d39 100644
--- a/docs/.vitepress/config.ts
+++ b/docs/.vitepress/config.ts
@@ -3,6 +3,7 @@ import { withMermaid } from 'vitepress-plugin-mermaid'
 import llmstxt from 'vitepress-plugin-llms'
 import footnote from 'markdown-it-footnote'
 import mark from 'markdown-it-mark'
+import { buildNav, buildSidebar } from './data/site-content.mjs'
 
 const rawBase = process.env.VITEPRESS_BASE
 const base = rawBase
@@ -11,151 +12,6 @@ const base = rawBase
     : `/${rawBase}/`
   : '/'
 
-// Shared sidebar configuration
-const sharedSidebar = {
-  '/en/': [
-    {
-      text: 'Getting Started',
-      items: [
-        { text: 'Introduction', link: '/en/' },
-        { text: 'Quick Start', link: '/en/guide/getting-started' },
-        { text: 'Architecture', link: '/en/guide/architecture' },
-        { text: 'Project Structure', link: '/en/guide/project-structure' },
-      ],
-    },
-    {
-      text: 'Academy',
-      items: [
-        { text: 'Algorithm Academy', link: '/en/academy/' },
-        { text: 'Huffman Coding', link: '/en/academy/huffman' },
-        { text: 'State Machine Design', link: '/en/academy/state-machine' },
-      ],
-    },
-    {
-      text: 'Algorithms',
-      items: [
-        { text: 'Overview', link: '/en/guide/algorithms' },
-        { text: 'Huffman Coding', link: '/en/algorithms/huffman' },
-        { text: 'Arithmetic Coding', link: '/en/algorithms/arithmetic' },
-        { text: 'Range Coder', link: '/en/algorithms/range' },
-        { text: 'Run-Length Encoding', link: '/en/algorithms/rle' },
-      ],
-    },
-    {
-      text: 'API Reference',
-      items: [
-        { text: 'Streaming API', link: '/en/api/streaming' },
-        { text: 'Go Library', link: '/en/api/go' },
-        { text: 'Rust Crate', link: '/en/api/rust' },
-        { text: 'C++ Header', link: '/en/api/cpp' },
-      ],
-    },
-    {
-      text: 'Benchmarks & Testing',
-      items: [
-        { text: 'Performance Results', link: '/en/benchmarks/results' },
-        { text: 'How to Run', link: '/en/benchmarks/how-to-run' },
-        { text: 'Cross-Language Testing', link: '/en/testing/cross-language' },
-      ],
-    },
-    {
-      text: 'Reference',
-      items: [
-        { text: 'Architecture Design', link: '/en/architecture/' },
-        { text: 'Bibliography', link: '/en/reference/bibliography' },
-        { text: 'OpenSpec Specs', link: 'https://github.com/LessUp/compress-kit/tree/master/openspec/specs' },
-        { text: 'Contributing', link: '/en/guide/contributing' },
-        { text: 'Changelog', link: '/en/release-notes/changelog' },
-      ],
-    },
-  ],
-  '/zh/': [
-    {
-      text: '开始使用',
-      items: [
-        { text: '项目介绍', link: '/zh/' },
-        { text: '快速开始', link: '/zh/guide/getting-started' },
-        { text: '架构设计', link: '/zh/guide/architecture' },
-        { text: '项目结构', link: '/zh/guide/project-structure' },
-      ],
-    },
-    {
-      text: '学院',
-      items: [
-        { text: '算法学院', link: '/zh/academy/' },
-        { text: '霍夫曼编码深度解析', link: '/zh/academy/huffman' },
-        { text: '状态机设计哲学', link: '/zh/academy/state-machine' },
-      ],
-    },
-    {
-      text: '算法详解',
-      items: [
-        { text: '算法综述', link: '/zh/guide/algorithms' },
-        { text: '霍夫曼编码', link: '/zh/algorithms/huffman' },
-        { text: '算术编码', link: '/zh/algorithms/arithmetic' },
-        { text: '区间编码', link: '/zh/algorithms/range' },
-        { text: '行程编码', link: '/zh/algorithms/rle' },
-      ],
-    },
-    {
-      text: 'API 参考',
-      items: [
-        { text: 'Streaming API', link: '/zh/api/streaming' },
-        { text: 'Go 库', link: '/zh/api/go' },
-        { text: 'Rust 包', link: '/zh/api/rust' },
-        { text: 'C++ 头文件', link: '/zh/api/cpp' },
-      ],
-    },
-    {
-      text: '基准测试',
-      items: [
-        { text: '性能结果', link: '/zh/benchmarks/results' },
-        { text: '如何运行', link: '/zh/benchmarks/how-to-run' },
-        { text: '跨语言测试', link: '/zh/testing/cross-language' },
-      ],
-    },
-    {
-      text: '参考',
-      items: [
-        { text: '系统架构设计', link: '/zh/architecture/' },
-        { text: '参考文献', link: '/zh/reference/bibliography' },
-        { text: 'OpenSpec 规范', link: 'https://github.com/LessUp/compress-kit/tree/master/openspec/specs' },
-        { text: '参与贡献', link: '/zh/guide/contributing' },
-        { text: '更新日志', link: '/zh/release-notes/changelog' },
-      ],
-    },
-  ],
-}
-
-// Shared nav configuration
-const sharedNav = (lang: string) => [
-  {
-    text: lang === 'zh' ? '首页' : 'Home',
-    link: lang === 'zh' ? '/zh/' : '/en/',
-    activeMatch: lang === 'zh' ? '^/zh/$' : '^/en/$'
-  },
-  {
-    text: lang === 'zh' ? '开始' : 'Get Started',
-    link: lang === 'zh' ? '/zh/guide/getting-started' : '/en/guide/getting-started',
-    activeMatch: lang === 'zh' ? '/zh/guide/' : '/en/guide/'
-  },
-  {
-    text: lang === 'zh' ? '算法' : 'Algorithms',
-    link: lang === 'zh' ? '/zh/guide/algorithms' : '/en/guide/algorithms',
-    activeMatch: lang === 'zh' ? '/zh/algorithms/' : '/en/algorithms/'
-  },
-  {
-    text: 'API',
-    link: lang === 'zh' ? '/zh/api/go' : '/en/api/go',
-    activeMatch: lang === 'zh' ? '/zh/api/' : '/en/api/'
-  },
-  {
-    text: lang === 'zh' ? '基准' : 'Benchmarks',
-    link: lang === 'zh' ? '/zh/benchmarks/results' : '/en/benchmarks/results',
-    activeMatch: lang === 'zh' ? '/zh/benchmarks/' : '/en/benchmarks/'
-  },
-]
-
 export default withMermaid(defineConfig({
   base,
   title: 'CompressKit',
@@ -175,8 +31,8 @@ export default withMermaid(defineConfig({
       lang: 'en-US',
       link: '/en/',
       themeConfig: {
-        nav: sharedNav('en'),
-        sidebar: sharedSidebar['/en/'],
+        nav: buildNav('en'),
+        sidebar: buildSidebar('en'),
         editLink: {
           pattern: 'https://github.com/LessUp/compress-kit/edit/master/docs/:path',
           text: 'Edit this page on GitHub',
@@ -223,8 +79,8 @@ export default withMermaid(defineConfig({
       lang: 'zh-CN',
       link: '/zh/',
       themeConfig: {
-        nav: sharedNav('zh'),
-        sidebar: sharedSidebar['/zh/'],
+        nav: buildNav('zh'),
+        sidebar: buildSidebar('zh'),
         editLink: {
           pattern: 'https://github.com/LessUp/compress-kit/edit/master/docs/:path',
           text: '在 GitHub 上编辑此页',
diff --git a/docs/.vitepress/data/site-content.mjs b/docs/.vitepress/data/site-content.mjs
new file mode 100644
index 0000000..7904bcb
--- /dev/null
+++ b/docs/.vitepress/data/site-content.mjs
@@ -0,0 +1,366 @@
+const localeOrEnglish = locale => (locale === 'zh' ? 'zh' : 'en')
+
+const localize = (value, locale) => value[localeOrEnglish(locale)] ?? value.en
+
+const withLocale = (locale, link) => {
+  if (/^https?:\/\//.test(link)) {
+    return link
+  }
+
+  const normalized = link === '/' ? '/' : `/${link.replace(/^\/+/, '')}`
+  const prefix = `/${localeOrEnglish(locale)}`
+  return normalized === '/' ? `${prefix}/` : `${prefix}${normalized}`
+}
+
+export const algorithmCatalog = [
+  {
+    id: 'huffman',
+    slug: 'huffman',
+    icon: '🌳',
+    name: { en: 'Huffman Coding', zh: '霍夫曼编码' },
+    chartLabel: { en: 'Huffman', zh: 'Huffman' },
+    description: {
+      en: 'Optimal prefix codes based on symbol frequency. The classic approach to lossless compression.',
+      zh: '基于符号频率的最优前缀码。经典的无损压缩方法。',
+    },
+    compression: { en: 'Medium', zh: '中等' },
+    speed: { en: 'Fast', zh: '快速' },
+    compressionTag: { en: 'Fast Speed', zh: '速度快' },
+    speedLevel: 'fast',
+    compressionLevel: 'medium',
+    bestFor: {
+      en: ['Text files', 'General data', 'Natural language'],
+      zh: ['文本文件', '通用数据', '自然语言'],
+    },
+  },
+  {
+    id: 'arithmetic',
+    slug: 'arithmetic',
+    icon: '🧮',
+    name: { en: 'Arithmetic Coding', zh: '算术编码' },
+    chartLabel: { en: 'Arithmetic', zh: 'Arithmetic' },
+    description: {
+      en: 'Entire message encoded as a single number. Achieves entropy limit for maximum compression.',
+      zh: '整个消息编码为单个数字。达到熵极限，实现最大压缩率。',
+    },
+    compression: { en: 'High', zh: '高' },
+    speed: { en: 'Medium', zh: '中速' },
+    compressionTag: { en: 'High Compression', zh: '高压缩率' },
+    speedLevel: 'medium',
+    compressionLevel: 'high',
+    bestFor: {
+      en: ['Maximum compression', 'Statistical data', 'Archival storage'],
+      zh: ['最大压缩率', '统计型数据', '归档存储'],
+    },
+  },
+  {
+    id: 'range',
+    slug: 'range',
+    icon: '🎯',
+    name: { en: 'Range Coder', zh: '区间编码' },
+    chartLabel: { en: 'Range', zh: 'Range' },
+    description: {
+      en: 'Integer-based arithmetic coding. Production-ready balance of speed and compression.',
+      zh: '基于整数的算术编码。生产级的速度与压缩率平衡。',
+    },
+    compression: { en: 'High', zh: '高' },
+    speed: { en: 'Fast', zh: '快速' },
+    compressionTag: { en: 'Fast + High', zh: '快 + 高压缩' },
+    speedLevel: 'fast',
+    compressionLevel: 'high',
+    bestFor: {
+      en: ['Production systems', 'Real-time compression', 'Balanced workloads'],
+      zh: ['生产系统', '实时压缩', '平衡型负载'],
+    },
+  },
+  {
+    id: 'rle',
+    slug: 'rle',
+    icon: '📏',
+    name: { en: 'Run-Length Encoding', zh: '行程编码' },
+    chartLabel: { en: 'RLE', zh: 'RLE' },
+    description: {
+      en: 'Simple and fast compression for repetitive data. Often used as preprocessing.',
+      zh: '针对重复数据的简单快速压缩。常作为预处理步骤使用。',
+    },
+    compression: { en: 'Variable', zh: '可变' },
+    speed: { en: 'Very Fast', zh: '极快' },
+    compressionTag: { en: 'Very Fast', zh: '极快' },
+    speedLevel: 'very-fast',
+    compressionLevel: 'variable',
+    bestFor: {
+      en: ['Bitmap images', 'Log files', 'Preprocessing step'],
+      zh: ['位图图像', '日志文件', '预处理步骤'],
+    },
+  },
+]
+
+export const benchmarkCatalog = {
+  algorithms: algorithmCatalog.map(entry => ({
+    id: entry.id,
+    label: entry.chartLabel,
+  })),
+  languages: [
+    { id: 'cpp', color: '#667eea', label: { en: 'C++', zh: 'C++' } },
+    { id: 'go', color: '#00add8', label: { en: 'Go', zh: 'Go' } },
+    { id: 'rust', color: '#de6e4b', label: { en: 'Rust', zh: 'Rust' } },
+  ],
+  datasets: [
+    { id: 'textlike_10MiB', label: { en: 'Text-like (10 MiB)', zh: '类文本 (10 MiB)' } },
+    { id: 'repetitive_10MiB', label: { en: 'Repetitive (10 MiB)', zh: '重复数据 (10 MiB)' } },
+    { id: 'small_dictionary_like', label: { en: 'Small dictionary-like sample', zh: '小型词典型样本' } },
+  ],
+  metrics: [
+    { id: 'encodeSpeed', label: { en: 'Encode Speed (MiB/s)', zh: '编码速度 (MiB/s)' } },
+    { id: 'decodeSpeed', label: { en: 'Decode Speed (MiB/s)', zh: '解码速度 (MiB/s)' } },
+    { id: 'compressionRatio', label: { en: 'Size Saved Relative to Input', zh: '相对输入节省的体积' } },
+  ],
+  metricOptions: [
+    { id: 'encodeSpeed', label: { en: 'Encode Speed', zh: '编码速度' } },
+    { id: 'decodeSpeed', label: { en: 'Decode Speed', zh: '解码速度' } },
+    { id: 'compressionRatio', label: { en: 'Compression Ratio', zh: '压缩比' } },
+  ],
+}
+
+export const homepageFeatureCatalog = [
+  ...algorithmCatalog.map(entry => ({
+    id: entry.id,
+    kind: 'algorithm',
+    algorithmId: entry.id,
+    title: entry.name,
+    description: entry.description,
+    tags: [
+      { label: { en: 'Learn More', zh: '了解更多' }, link: `/algorithms/${entry.slug}` },
+      { label: entry.compressionTag },
+    ],
+  })),
+  {
+    id: 'cross-language',
+    kind: 'guide',
+    title: { en: '🔄 Cross-Language', zh: '🔄 跨语言兼容' },
+    description: {
+      en: 'Encode in one language, decode in another. All implementations produce identical binary output.',
+      zh: '一种语言编码，另一种语言解码。所有实现产生完全相同的二进制输出。',
+    },
+    tags: [
+      { label: { en: 'Get Started', zh: '快速开始' }, link: '/guide/getting-started' },
+      { label: { en: 'Testing', zh: '测试' }, link: '/testing/cross-language' },
+    ],
+  },
+  {
+    id: 'benchmarks',
+    kind: 'guide',
+    title: { en: '📊 Benchmarks', zh: '📊 性能基准' },
+    description: {
+      en: 'Performance benchmarks across all algorithms and languages. Compare speed and compression.',
+      zh: '跨所有算法和语言的性能基准测试。比较速度和压缩率。',
+    },
+    tags: [
+      { label: { en: 'View Results', zh: '查看结果' }, link: '/benchmarks/results' },
+      { label: { en: 'Run Tests', zh: '运行测试' }, link: '/benchmarks/how-to-run' },
+    ],
+  },
+]
+
+const navCatalog = [
+  {
+    id: 'home',
+    text: { en: 'Home', zh: '首页' },
+    link: '/',
+    activeMatch: { en: '^/en/$', zh: '^/zh/$' },
+  },
+  {
+    id: 'guide',
+    text: { en: 'Get Started', zh: '开始' },
+    link: '/guide/getting-started',
+    activeMatch: { en: '/en/guide/', zh: '/zh/guide/' },
+  },
+  {
+    id: 'algorithms',
+    text: { en: 'Algorithms', zh: '算法' },
+    link: '/guide/algorithms',
+    activeMatch: { en: '/en/algorithms/', zh: '/zh/algorithms/' },
+  },
+  {
+    id: 'api',
+    text: { en: 'API', zh: 'API' },
+    link: '/api/go',
+    activeMatch: { en: '/en/api/', zh: '/zh/api/' },
+  },
+  {
+    id: 'benchmarks',
+    text: { en: 'Benchmarks', zh: '基准' },
+    link: '/benchmarks/results',
+    activeMatch: { en: '/en/benchmarks/', zh: '/zh/benchmarks/' },
+  },
+]
+
+const sidebarCatalog = [
+  {
+    title: { en: 'Getting Started', zh: '开始使用' },
+    items: [
+      { text: { en: 'Introduction', zh: '项目介绍' }, link: '/' },
+      { text: { en: 'Quick Start', zh: '快速开始' }, link: '/guide/getting-started' },
+      { text: { en: 'Architecture', zh: '架构设计' }, link: '/guide/architecture' },
+      { text: { en: 'Project Structure', zh: '项目结构' }, link: '/guide/project-structure' },
+    ],
+  },
+  {
+    title: { en: 'Academy', zh: '学院' },
+    items: [
+      { text: { en: 'Algorithm Academy', zh: '算法学院' }, link: '/academy/' },
+      { text: { en: 'Huffman Coding', zh: '霍夫曼编码深度解析' }, link: '/academy/huffman' },
+      { text: { en: 'State Machine Design', zh: '状态机设计哲学' }, link: '/academy/state-machine' },
+    ],
+  },
+  {
+    title: { en: 'Algorithms', zh: '算法详解' },
+    items: [
+      { text: { en: 'Overview', zh: '算法综述' }, link: '/guide/algorithms' },
+      { text: { en: 'Huffman Coding', zh: '霍夫曼编码' }, link: '/algorithms/huffman' },
+      { text: { en: 'Arithmetic Coding', zh: '算术编码' }, link: '/algorithms/arithmetic' },
+      { text: { en: 'Range Coder', zh: '区间编码' }, link: '/algorithms/range' },
+      { text: { en: 'Run-Length Encoding', zh: '行程编码' }, link: '/algorithms/rle' },
+    ],
+  },
+  {
+    title: { en: 'API Reference', zh: 'API 参考' },
+    items: [
+      { text: { en: 'Streaming API', zh: 'Streaming API' }, link: '/api/streaming' },
+      { text: { en: 'Go Library', zh: 'Go 库' }, link: '/api/go' },
+      { text: { en: 'Rust Crate', zh: 'Rust 包' }, link: '/api/rust' },
+      { text: { en: 'C++ Header', zh: 'C++ 头文件' }, link: '/api/cpp' },
+    ],
+  },
+  {
+    title: { en: 'Benchmarks & Testing', zh: '基准测试' },
+    items: [
+      { text: { en: 'Performance Results', zh: '性能结果' }, link: '/benchmarks/results' },
+      { text: { en: 'How to Run', zh: '如何运行' }, link: '/benchmarks/how-to-run' },
+      { text: { en: 'Cross-Language Testing', zh: '跨语言测试' }, link: '/testing/cross-language' },
+    ],
+  },
+  {
+    title: { en: 'Reference', zh: '参考' },
+    items: [
+      { text: { en: 'Architecture Design', zh: '系统架构设计' }, link: '/architecture/' },
+      { text: { en: 'Bibliography', zh: '参考文献' }, link: '/reference/bibliography' },
+      { text: { en: 'OpenSpec Specs', zh: 'OpenSpec 规范' }, link: 'https://github.com/LessUp/compress-kit/tree/master/openspec/specs' },
+      { text: { en: 'Contributing', zh: '参与贡献' }, link: '/guide/contributing' },
+      { text: { en: 'Changelog', zh: '更新日志' }, link: '/release-notes/changelog' },
+    ],
+  },
+]
+
+export function buildNav(locale) {
+  return navCatalog.map(item => ({
+    text: localize(item.text, locale),
+    link: withLocale(locale, item.link),
+    activeMatch: localize(item.activeMatch, locale),
+  }))
+}
+
+export function buildSidebar(locale) {
+  return sidebarCatalog.map(section => ({
+    text: localize(section.title, locale),
+    items: section.items.map(item => ({
+      text: localize(item.text, locale),
+      link: withLocale(locale, item.link),
+    })),
+  }))
+}
+
+export function getAlgorithmCards(locale) {
+  return algorithmCatalog.map(entry => ({
+    id: entry.id,
+    slug: entry.slug,
+    icon: entry.icon,
+    name: localize(entry.name, locale),
+    description: localize(entry.description, locale),
+    compression: localize(entry.compression, locale),
+    speed: localize(entry.speed, locale),
+    bestFor: localize(entry.bestFor, locale),
+    compressionLevel: entry.compressionLevel,
+    speedLevel: entry.speedLevel,
+    bestForLabel: localize({ en: 'Best for:', zh: '适合场景：' }, locale),
+    learnMoreLabel: localize({ en: 'Learn more', zh: '了解更多' }, locale),
+    compressionSuffix: localize({ en: 'Compression', zh: '压缩' }, locale),
+    speedSuffix: localize({ en: 'Speed', zh: '速度' }, locale),
+  }))
+}
+
+export function getBenchmarkContent(locale) {
+  return {
+    algorithms: benchmarkCatalog.algorithms.map(entry => ({
+      id: entry.id,
+      label: localize(entry.label, locale),
+    })),
+    languages: benchmarkCatalog.languages.map(entry => ({
+      id: entry.id,
+      label: localize(entry.label, locale),
+      color: entry.color,
+    })),
+    datasets: benchmarkCatalog.datasets.map(entry => ({
+      id: entry.id,
+      label: localize(entry.label, locale),
+    })),
+    metrics: benchmarkCatalog.metrics.map(entry => ({
+      id: entry.id,
+      label: localize(entry.label, locale),
+    })),
+    metricOptions: benchmarkCatalog.metricOptions.map(entry => ({
+      id: entry.id,
+      label: localize(entry.label, locale),
+    })),
+    title: localize({ en: 'Performance Comparison', zh: '性能对比' }, locale),
+    datasetLabel: localize({ en: 'Dataset:', zh: '数据集：' }, locale),
+    metricLabel: localize({ en: 'Metric:', zh: '指标：' }, locale),
+    compressionNote: localize(
+      {
+        en: 'Bars show size saved relative to input; labels show the actual output/input ratio, and the best ratio is highlighted.',
+        zh: '柱状图展示相对输入节省的体积，标签显示实际输出/输入比值，最佳压缩比会被高亮。',
+      },
+      locale
+    ),
+  }
+}
+
+export function getHomepageContent(locale) {
+  const currentLocale = localeOrEnglish(locale)
+  const alternateLocale = currentLocale === 'en' ? 'zh' : 'en'
+  const alternateLabel = currentLocale === 'en' ? '中文' : 'English'
+
+  return {
+    subtitle: localize(
+      { en: 'Lossless Compression Library', zh: '无损压缩算法库' },
+      currentLocale
+    ),
+    intro: localize(
+      {
+        en: 'CompressKit provides classic lossless compression algorithms with cross-language compatibility. Encode in C++, decode in Go. Encode in Rust, decode in C++. All implementations produce identical binary output.',
+        zh: 'CompressKit 提供经典的无损压缩算法，支持跨语言兼容。C++ 编码，Go 解码。Rust 编码，C++ 解码。所有实现产生完全相同的二进制输出。',
+      },
+      currentLocale
+    ),
+    sections: {
+      algorithms: localize({ en: 'Algorithms', zh: '算法' }, currentLocale),
+      quickStart: localize({ en: 'Quick Start', zh: '快速开始' }, currentLocale),
+    },
+    quickStartCommand: 'git clone https://github.com/LessUp/compress-kit.git && cd compress-kit && make build && make test',
+    stats: ['C++17', 'Go', 'Rust'],
+    navLinks: [
+      { text: localize({ en: 'Get Started', zh: '快速开始' }, currentLocale), link: withLocale(currentLocale, '/guide/getting-started') },
+      { text: 'GitHub', link: 'https://github.com/LessUp/compress-kit' },
+      { text: alternateLabel, link: withLocale(alternateLocale, '/') },
+    ],
+    featureCards: homepageFeatureCatalog.map(entry => ({
+      id: entry.id,
+      title: localize(entry.title, currentLocale),
+      description: localize(entry.description, currentLocale),
+      tags: entry.tags.map(tag => ({
+        label: localize(tag.label, currentLocale),
+        link: tag.link ? withLocale(currentLocale, tag.link) : null,
+      })),
+    })),
+  }
+}
diff --git a/docs/.vitepress/theme/components/AlgorithmGrid.vue b/docs/.vitepress/theme/components/AlgorithmGrid.vue
index bfffa73..0bae1e8 100644
--- a/docs/.vitepress/theme/components/AlgorithmGrid.vue
+++ b/docs/.vitepress/theme/components/AlgorithmGrid.vue
@@ -1,75 +1,13 @@
 <script setup lang="ts">
 import { useData, withBase } from 'vitepress'
 import { computed } from 'vue'
+import { getAlgorithmCards } from '../../data/site-content.mjs'
 
 const { localeIndex } = useData()
 const lang = computed(() => localeIndex.value === 'root' ? 'en' : localeIndex.value)
+const algorithms = computed(() => getAlgorithmCards(lang.value))
 const algoLink = (slug: string) => withBase(`/${lang.value}/algorithms/${slug}`)
 
-interface Algorithm {
-  id: string
-  name: string
-  slug: string
-  icon: string
-  description: string
-  compression: 'Medium' | 'High' | 'Variable' | 'Low'
-  speed: 'Fast' | 'Medium' | 'Slow' | 'Very Fast'
-  bestFor: string[]
-  compressionLevel: 'medium' | 'high' | 'variable'
-  speedLevel: 'fast' | 'medium' | 'slow' | 'very-fast'
-}
-
-const algorithms: Algorithm[] = [
-  {
-    id: 'huffman',
-    name: 'Huffman Coding',
-    slug: 'huffman',
-    icon: '🌳',
-    description: 'Optimal prefix codes based on symbol frequency. The classic approach to lossless compression.',
-    compression: 'Medium',
-    speed: 'Fast',
-    bestFor: ['Text files', 'General data', 'Natural language'],
-    compressionLevel: 'medium',
-    speedLevel: 'fast'
-  },
-  {
-    id: 'arithmetic',
-    name: 'Arithmetic Coding',
-    slug: 'arithmetic',
-    icon: '🧮',
-    description: 'Entire message encoded as a single number. Achieves entropy limit for maximum compression.',
-    compression: 'High',
-    speed: 'Medium',
-    bestFor: ['Maximum compression', 'Statistical data', 'Archival storage'],
-    compressionLevel: 'high',
-    speedLevel: 'medium'
-  },
-  {
-    id: 'range',
-    name: 'Range Coder',
-    slug: 'range',
-    icon: '🎯',
-    description: 'Integer-based arithmetic coding. Production-ready balance of speed and compression.',
-    compression: 'High',
-    speed: 'Fast',
-    bestFor: ['Production systems', 'Real-time compression', 'Balanced workloads'],
-    compressionLevel: 'high',
-    speedLevel: 'fast'
-  },
-  {
-    id: 'rle',
-    name: 'Run-Length Encoding',
-    slug: 'rle',
-    icon: '📏',
-    description: 'Simple and fast compression for repetitive data. Often used as preprocessing.',
-    compression: 'Variable',
-    speed: 'Very Fast',
-    bestFor: ['Bitmap images', 'Log files', 'Preprocessing step'],
-    compressionLevel: 'variable',
-    speedLevel: 'very-fast'
-  }
-]
-
 const getCompressionBadgeClass = (level: string) => {
   switch (level) {
     case 'high': return 'ck-badge-compression-high'
@@ -103,10 +41,10 @@ const getSpeedBadgeClass = (level: string) => {
           <h3>{{ algo.name }}</h3>
           <div class="badges">
             <span :class="['badge', getCompressionBadgeClass(algo.compressionLevel)]">
-              {{ algo.compression }} Compression
+            {{ algo.compression }} {{ algo.compressionSuffix }}
             </span>
             <span :class="['badge', getSpeedBadgeClass(algo.speedLevel)]">
-              {{ algo.speed }} Speed
+            {{ algo.speed }} {{ algo.speedSuffix }}
             </span>
           </div>
         </div>
@@ -115,14 +53,14 @@ const getSpeedBadgeClass = (level: string) => {
       <p class="algorithm-description">{{ algo.description }}</p>
       
       <div class="best-for">
-        <span class="label">Best for:</span>
+        <span class="label">{{ algo.bestForLabel }}</span>
         <div class="tags">
           <span v-for="use in algo.bestFor" :key="use" class="tag">{{ use }}</span>
         </div>
       </div>
       
       <div class="card-footer">
-        <span class="learn-more">Learn more →</span>
+        <span class="learn-more">{{ algo.learnMoreLabel }} →</span>
       </div>
     </a>
   </div>
diff --git a/docs/.vitepress/theme/components/BenchmarkChart.vue b/docs/.vitepress/theme/components/BenchmarkChart.vue
index f63e8a4..aba81a3 100644
--- a/docs/.vitepress/theme/components/BenchmarkChart.vue
+++ b/docs/.vitepress/theme/components/BenchmarkChart.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { ref, computed, watchEffect } from 'vue'
+import { useData } from 'vitepress'
 import benchmarkData from '../../data/benchmarks.json'
+import { getBenchmarkContent } from '../../data/site-content.mjs'
 import { getBarHeight as getMetricBarHeight, isBestCompressionRatio } from './benchmarkChartMetrics.js'
 
 interface BenchmarkResult {
@@ -16,35 +18,28 @@ interface BenchmarkResult {
 }
 
 const results = ref<BenchmarkResult[]>(benchmarkData.results)
+const { localeIndex } = useData()
+const locale = computed(() => (localeIndex.value === 'root' ? 'en' : localeIndex.value))
+const content = computed(() => getBenchmarkContent(locale.value))
 
-const algorithms = ['huffman', 'arithmetic', 'range', 'rle']
-const languages = ['cpp', 'go', 'rust']
+const algorithms = computed(() => content.value.algorithms.map(entry => entry.id))
+const languages = computed(() => content.value.languages.map(entry => entry.id))
 const datasetOrder = ['textlike_10MiB', 'repetitive_10MiB', 'small_dictionary_like']
-
-const languageColors: Record<string, string> = {
-  cpp: '#667eea',
-  go: '#00add8',
-  rust: '#de6e4b'
-}
-
-const languageNames: Record<string, string> = {
-  cpp: 'C++',
-  go: 'Go',
-  rust: 'Rust'
-}
-
-const algorithmNames: Record<string, string> = {
-  huffman: 'Huffman',
-  arithmetic: 'Arithmetic',
-  range: 'Range',
-  rle: 'RLE'
-}
-
-const datasetNames: Record<string, string> = {
-  textlike_10MiB: 'Text-like (10 MiB)',
-  repetitive_10MiB: 'Repetitive (10 MiB)',
-  small_dictionary_like: 'Small dictionary-like sample'
-}
+const languageColors = computed(() =>
+  Object.fromEntries(content.value.languages.map(entry => [entry.id, entry.color]))
+)
+const languageNames = computed(() =>
+  Object.fromEntries(content.value.languages.map(entry => [entry.id, entry.label]))
+)
+const algorithmNames = computed(() =>
+  Object.fromEntries(content.value.algorithms.map(entry => [entry.id, entry.label]))
+)
+const datasetNames = computed(() =>
+  Object.fromEntries(content.value.datasets.map(entry => [entry.id, entry.label]))
+)
+const metricNames = computed(() =>
+  Object.fromEntries(content.value.metrics.map(entry => [entry.id, entry.label]))
+)
 
 const selectedMetric = ref<'encodeSpeed' | 'decodeSpeed' | 'compressionRatio'>('encodeSpeed')
 const selectedDataset = ref('')
@@ -74,7 +69,7 @@ const filteredResults = computed(() => {
 
 const groupedByAlgorithm = computed(() => {
   const grouped: Record<string, BenchmarkResult[]> = {}
-  algorithms.forEach(algo => {
+  algorithms.value.forEach(algo => {
     grouped[algo] = filteredResults.value.filter(r => r.algorithm === algo)
   })
   return grouped
@@ -88,12 +83,7 @@ const maxValue = computed(() => {
 const compressionRatios = computed(() => filteredResults.value.map(r => r.compressionRatio))
 
 const formatMetricName = (metric: string): string => {
-  const names: Record<string, string> = {
-    encodeSpeed: 'Encode Speed (MiB/s)',
-    decodeSpeed: 'Decode Speed (MiB/s)',
-    compressionRatio: 'Size Saved Relative to Input'
-  }
-  return names[metric] || metric
+  return metricNames.value[metric] || metric
 }
 
 const getBarHeight = (value: number): number => {
@@ -115,10 +105,10 @@ const formatMetricValue = (value: number): string => {
 <template>
   <div class="benchmark-chart-container">
     <div class="chart-header">
-      <h3 class="chart-title">Performance Comparison</h3>
+      <h3 class="chart-title">{{ content.title }}</h3>
       <div class="chart-controls">
         <div class="control-group">
-          <label>Dataset:</label>
+          <label>{{ content.datasetLabel }}</label>
           <select v-model="selectedDataset">
             <option v-for="dataset in datasetOptions" :key="dataset" :value="dataset">
               {{ datasetNames[dataset] || dataset }}
@@ -126,11 +116,15 @@ const formatMetricValue = (value: number): string => {
           </select>
         </div>
         <div class="control-group">
-          <label>Metric:</label>
+          <label>{{ content.metricLabel }}</label>
           <select v-model="selectedMetric">
-            <option value="encodeSpeed">Encode Speed</option>
-            <option value="decodeSpeed">Decode Speed</option>
-            <option value="compressionRatio">Compression Ratio</option>
+            <option
+              v-for="metric in content.metricOptions"
+              :key="metric.id"
+              :value="metric.id"
+            >
+              {{ metric.label }}
+            </option>
           </select>
         </div>
       </div>
@@ -169,7 +163,7 @@ const formatMetricValue = (value: number): string => {
     </div>
 
     <div v-if="selectedMetric === 'compressionRatio'" class="metric-note">
-      Bars show size saved relative to input; labels show the actual output/input ratio, and the best ratio is highlighted.
+      {{ content.compressionNote }}
     </div>
     <div class="metric-label">{{ formatMetricName(selectedMetric) }}</div>
   </div>
diff --git a/docs/.vitepress/theme/components/HomeLanding.vue b/docs/.vitepress/theme/components/HomeLanding.vue
new file mode 100644
index 0000000..e164c21
--- /dev/null
+++ b/docs/.vitepress/theme/components/HomeLanding.vue
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { withBase } from 'vitepress'
+import { getHomepageContent } from '../../data/site-content.mjs'
+
+const props = defineProps<{
+  locale: 'en' | 'zh'
+}>()
+
+const content = computed(() => getHomepageContent(props.locale))
+</script>
+
+<template>
+  <div class="home-header">
+    <div class="home-header-left">
+      <div class="home-logo">CK</div>
+      <div>
+        <span class="home-title">CompressKit</span>
+        <span class="home-subtitle">{{ content.subtitle }}</span>
+      </div>
+    </div>
+    <div class="home-nav">
+      <a v-for="link in content.navLinks" :key="link.text" :href="withBase(link.link)">{{ link.text }}</a>
+    </div>
+  </div>
+
+  <div class="home-intro-row">
+    <div class="home-intro">{{ content.intro }}</div>
+    <div class="home-stats">
+      <span v-for="stat in content.stats" :key="stat"><strong>{{ stat }}</strong></span>
+    </div>
+  </div>
+
+  <h2>{{ content.sections.algorithms }}</h2>
+
+  <div class="feature-map">
+    <div v-for="feature in content.featureCards" :key="feature.id" class="feature-card">
+      <div class="feature-card-title">{{ feature.title }}</div>
+      <div class="feature-card-desc">{{ feature.description }}</div>
+      <div class="feature-tags">
+        <template v-for="tag in feature.tags" :key="`${feature.id}-${tag.label}`">
+          <a v-if="tag.link" :href="withBase(tag.link)" class="feature-tag">{{ tag.label }}</a>
+          <span v-else class="feature-tag">{{ tag.label }}</span>
+        </template>
+      </div>
+    </div>
+  </div>
+
+  <div class="quick-start">
+    <div class="quick-start-title">{{ content.sections.quickStart }}</div>
+    <div class="quick-start-content">
+      <div class="command-block">
+        <code>{{ content.quickStartCommand }}</code>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/docs/.vitepress/theme/components/LanguageDetector.vue b/docs/.vitepress/theme/components/LanguageDetector.vue
deleted file mode 100644
index 2273ca0..0000000
--- a/docs/.vitepress/theme/components/LanguageDetector.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<script setup lang="ts">
-import { onMounted } from 'vue'
-
-onMounted(() => {
-  // Only run on root path (landing page)
-  const pathname = window.location.pathname
-  if (pathname !== '/compress-kit/' && pathname !== '/compress-kit') {
-    return
-  }
-
-  // Check if user has already made a language choice
-  const savedLang = localStorage.getItem('compresskit-lang')
-  if (savedLang) {
-    return
-  }
-
-  // Detect browser language
-  const browserLang = navigator.language || (navigator as any).userLanguage
-  const preferredLang = browserLang?.toLowerCase().startsWith('zh') ? 'zh' : 'en'
-
-  // Save preference
-  localStorage.setItem('compresskit-lang', preferredLang)
-
-  // Redirect to appropriate language
-  window.location.href = `/compress-kit/${preferredLang}/`
-})
-</script>
-
-<template>
-  <!-- This component doesn't render anything visible -->
-</template>
diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
index f72126d..1a7637a 100644
--- a/docs/.vitepress/theme/index.ts
+++ b/docs/.vitepress/theme/index.ts
@@ -1,6 +1,6 @@
 import type { Theme } from 'vitepress'
 import DefaultTheme from 'vitepress/theme'
-import { h, onMounted, watch, nextTick } from 'vue'
+import { onMounted, watch, nextTick } from 'vue'
 import { useData } from 'vitepress'
 import './styles/vars.css'
 
@@ -8,15 +8,9 @@ import './styles/vars.css'
 import AlgorithmGrid from './components/AlgorithmGrid.vue'
 import BenchmarkChart from './components/BenchmarkChart.vue'
 import CodeComparison from './components/CodeComparison.vue'
-import LanguageDetector from './components/LanguageDetector.vue'
 
 export default {
   extends: DefaultTheme,
-  Layout: () => {
-    return h(DefaultTheme.Layout, null, {
-      'layout-bottom': () => h(LanguageDetector),
-    })
-  },
   enhanceApp({ app }) {
     // Register custom components globally
     app.component('AlgorithmGrid', AlgorithmGrid)
diff --git a/docs/.vitepress/theme/utils/language-preference.mjs b/docs/.vitepress/theme/utils/language-preference.mjs
new file mode 100644
index 0000000..3d86d90
--- /dev/null
+++ b/docs/.vitepress/theme/utils/language-preference.mjs
@@ -0,0 +1,64 @@
+export const LOCALE_STORAGE_KEY = 'compresskit-lang'
+
+export function normalizeBase(base = '/') {
+  if (!base || base === '/') {
+    return '/'
+  }
+
+  const rooted = base.startsWith('/') ? base : `/${base}`
+  return rooted.endsWith('/') ? rooted : `${rooted}/`
+}
+
+export function normalizeLocale(locale) {
+  if (!locale) {
+    return null
+  }
+
+  const normalized = String(locale).trim().toLowerCase()
+  if (normalized.startsWith('zh')) {
+    return 'zh'
+  }
+  if (normalized.startsWith('en')) {
+    return 'en'
+  }
+  return null
+}
+
+export function buildLocalePath(base, locale) {
+  return `${normalizeBase(base)}${locale}/`
+}
+
+export function readSavedLocale(storage) {
+  if (!storage?.getItem) {
+    return null
+  }
+  return normalizeLocale(storage.getItem(LOCALE_STORAGE_KEY))
+}
+
+export function persistLocale(storage, locale) {
+  const normalized = normalizeLocale(locale)
+  if (!normalized || !storage?.setItem) {
+    return null
+  }
+  storage.setItem(LOCALE_STORAGE_KEY, normalized)
+  return normalized
+}
+
+export function getPreferredLocale({ savedLocale, browserLanguage }) {
+  return normalizeLocale(savedLocale) ?? normalizeLocale(browserLanguage) ?? 'en'
+}
+
+function isRootLandingPath(pathname, base) {
+  const normalizedBase = normalizeBase(base)
+  const trimmedBase = normalizedBase === '/' ? '/' : normalizedBase.slice(0, -1)
+  return pathname === normalizedBase || pathname === trimmedBase
+}
+
+export function getLandingRedirectTarget({ pathname, base = '/', savedLocale, browserLanguage }) {
+  if (!isRootLandingPath(pathname, base)) {
+    return null
+  }
+
+  const locale = getPreferredLocale({ savedLocale, browserLanguage })
+  return buildLocalePath(base, locale)
+}
diff --git a/docs/en/index.md b/docs/en/index.md
index 7c6951e..5b39f57 100644
--- a/docs/en/index.md
+++ b/docs/en/index.md
@@ -4,115 +4,14 @@ layout: home
 
 <script setup>
 import { onBeforeMount } from 'vue'
+import HomeLanding from '../.vitepress/theme/components/HomeLanding.vue'
+import { persistLocale } from '../.vitepress/theme/utils/language-preference.mjs'
 
 onBeforeMount(() => {
   if (typeof window !== 'undefined') {
-    localStorage.setItem('docs-lang-preference', `${import.meta.env.BASE_URL}en/`)
+    persistLocale(window.localStorage, 'en')
   }
 })
 </script>
 
-<div class="home-header">
-  <div class="home-header-left">
-    <div class="home-logo">CK</div>
-    <div>
-      <span class="home-title">CompressKit</span>
-      <span class="home-subtitle">Lossless Compression Library</span>
-    </div>
-  </div>
-  <div class="home-nav">
-    <a href="./guide/getting-started">Get Started</a>
-    <a href="https://github.com/LessUp/compress-kit">GitHub</a>
-    <a href="../zh/">中文</a>
-  </div>
-</div>
-
-<div class="home-intro-row">
-  <div class="home-intro">
-    CompressKit provides classic lossless compression algorithms with cross-language compatibility. Encode in C++, decode in Go. Encode in Rust, decode in C++. All implementations produce identical binary output.
-  </div>
-  <div class="home-stats">
-    <span><strong>C++17</strong></span>
-    <span><strong>Go</strong></span>
-    <span><strong>Rust</strong></span>
-  </div>
-</div>
-
-## Algorithms
-
-<div class="feature-map">
-  <div class="feature-card">
-    <div class="feature-card-title">🌳 Huffman Coding</div>
-    <div class="feature-card-desc">
-      Optimal prefix codes based on symbol frequency. The classic approach to lossless compression.
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/huffman" class="feature-tag">Learn More</a>
-      <span class="feature-tag">Fast Speed</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">🧮 Arithmetic Coding</div>
-    <div class="feature-card-desc">
-      Entire message encoded as a single number. Achieves entropy limit for maximum compression.
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/arithmetic" class="feature-tag">Learn More</a>
-      <span class="feature-tag">High Compression</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">🎯 Range Coder</div>
-    <div class="feature-card-desc">
-      Integer-based arithmetic coding. Production-ready balance of speed and compression.
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/range" class="feature-tag">Learn More</a>
-      <span class="feature-tag">Fast + High</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">📏 Run-Length Encoding</div>
-    <div class="feature-card-desc">
-      Simple and fast compression for repetitive data. Often used as preprocessing.
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/rle" class="feature-tag">Learn More</a>
-      <span class="feature-tag">Very Fast</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">🔄 Cross-Language</div>
-    <div class="feature-card-desc">
-      Encode in one language, decode in another. All implementations produce identical binary output.
-    </div>
-    <div class="feature-tags">
-      <a href="./guide/getting-started" class="feature-tag">Get Started</a>
-      <a href="./testing/cross-language" class="feature-tag">Testing</a>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">📊 Benchmarks</div>
-    <div class="feature-card-desc">
-      Performance benchmarks across all algorithms and languages. Compare speed and compression.
-    </div>
-    <div class="feature-tags">
-      <a href="./benchmarks/results" class="feature-tag">View Results</a>
-      <a href="./benchmarks/how-to-run" class="feature-tag">Run Tests</a>
-    </div>
-  </div>
-</div>
-
-<div class="quick-start">
-  <div class="quick-start-title">Quick Start</div>
-  <div class="quick-start-content">
-    <div class="command-block">
-      <code>git clone https://github.com/LessUp/compress-kit.git && cd compress-kit && make build && make test</code>
-    </div>
-  </div>
-</div>
+<HomeLanding locale="en" />
diff --git a/docs/index.md b/docs/index.md
index 3877e71..41a7322 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -15,24 +15,21 @@ hero:
 
 <script setup>
 import { onBeforeMount } from 'vue'
+import { getLandingRedirectTarget, readSavedLocale } from './.vitepress/theme/utils/language-preference.mjs'
 
 // Client-only execution for SSR compatibility
 onBeforeMount(() => {
   if (typeof window === 'undefined') return
 
-  const base = import.meta.env.BASE_URL
-  const userLang = navigator.language || navigator.userLanguage || ''
-  const savedLang = localStorage.getItem('docs-lang-preference')
+  const target = getLandingRedirectTarget({
+    pathname: window.location.pathname,
+    base: import.meta.env.BASE_URL,
+    savedLocale: readSavedLocale(window.localStorage),
+    browserLanguage: navigator.language || navigator.userLanguage || '',
+  })
 
-  // Use saved preference if exists, otherwise use browser language
-  const targetLang = savedLang || (userLang.startsWith('zh') ? `${base}zh/` : `${base}en/`)
-  const currentPath = window.location.pathname
-
-  // Only redirect if not already on correct language path
-  if (targetLang.endsWith('/zh/') && !currentPath.includes('/zh/')) {
-    window.location.replace(`${base}zh/`)
-  } else if (targetLang.endsWith('/en/') && !currentPath.includes('/en/')) {
-    window.location.replace(`${base}en/`)
+  if (target && target !== window.location.pathname) {
+    window.location.replace(target)
   }
 })
 </script>
diff --git a/docs/tests/language-preference.test.mjs b/docs/tests/language-preference.test.mjs
new file mode 100644
index 0000000..fb2473e
--- /dev/null
+++ b/docs/tests/language-preference.test.mjs
@@ -0,0 +1,69 @@
+import test from 'node:test'
+import assert from 'node:assert/strict'
+
+import {
+  LOCALE_STORAGE_KEY,
+  getLandingRedirectTarget,
+  normalizeBase,
+  normalizeLocale,
+} from '../.vitepress/theme/utils/language-preference.mjs'
+
+test('normalizeBase produces rooted trailing-slash paths', () => {
+  assert.equal(normalizeBase('/compress-kit'), '/compress-kit/')
+  assert.equal(normalizeBase('compress-kit'), '/compress-kit/')
+  assert.equal(normalizeBase('/'), '/')
+})
+
+test('saved locale wins on root landing redirect', () => {
+  assert.equal(
+    getLandingRedirectTarget({
+      pathname: '/compress-kit/',
+      base: '/compress-kit',
+      savedLocale: 'zh',
+      browserLanguage: 'en-US',
+    }),
+    '/compress-kit/zh/'
+  )
+})
+
+test('browser language drives redirect when no saved locale exists', () => {
+  assert.equal(
+    getLandingRedirectTarget({
+      pathname: '/compress-kit/',
+      base: '/compress-kit/',
+      savedLocale: null,
+      browserLanguage: 'zh-CN',
+    }),
+    '/compress-kit/zh/'
+  )
+
+  assert.equal(
+    getLandingRedirectTarget({
+      pathname: '/compress-kit/',
+      base: '/compress-kit/',
+      savedLocale: null,
+      browserLanguage: 'fr-FR',
+    }),
+    '/compress-kit/en/'
+  )
+})
+
+test('non-root pages do not trigger landing redirect', () => {
+  assert.equal(
+    getLandingRedirectTarget({
+      pathname: '/compress-kit/en/guide/getting-started',
+      base: '/compress-kit/',
+      savedLocale: 'zh',
+      browserLanguage: 'zh-CN',
+    }),
+    null
+  )
+})
+
+test('normalizeLocale accepts only shipped locales', () => {
+  assert.equal(LOCALE_STORAGE_KEY, 'compresskit-lang')
+  assert.equal(normalizeLocale('zh'), 'zh')
+  assert.equal(normalizeLocale('en-US'), 'en')
+  assert.equal(normalizeLocale('jp'), null)
+  assert.equal(normalizeLocale(''), null)
+})
diff --git a/docs/tests/site-content.test.mjs b/docs/tests/site-content.test.mjs
new file mode 100644
index 0000000..f832d65
--- /dev/null
+++ b/docs/tests/site-content.test.mjs
@@ -0,0 +1,61 @@
+import test from 'node:test'
+import assert from 'node:assert/strict'
+
+import {
+  algorithmCatalog,
+  benchmarkCatalog,
+  buildNav,
+  buildSidebar,
+  homepageFeatureCatalog,
+} from '../.vitepress/data/site-content.mjs'
+
+const stripLocalePrefix = link => link.replace(/^\/(en|zh)\//, '/')
+
+test('sidebar keeps one canonical link graph across locales', () => {
+  const english = buildSidebar('en')
+  const chinese = buildSidebar('zh')
+
+  assert.equal(english.length, chinese.length, 'both locales should expose same sidebar sections')
+
+  for (let index = 0; index < english.length; index += 1) {
+    const left = english[index]
+    const right = chinese[index]
+    assert.equal(left.items.length, right.items.length, `section ${index} should keep same item count`)
+    assert.deepEqual(
+      left.items.map(item => stripLocalePrefix(item.link)),
+      right.items.map(item => stripLocalePrefix(item.link)),
+      `section ${index} should map to same canonical destinations`
+    )
+  }
+})
+
+test('top nav keeps one canonical destination set across locales', () => {
+  const english = buildNav('en')
+  const chinese = buildNav('zh')
+
+  assert.deepEqual(
+    english.map(item => stripLocalePrefix(item.link)),
+    chinese.map(item => stripLocalePrefix(item.link)),
+    'both locales should keep same nav destination order'
+  )
+})
+
+test('homepage and benchmark metadata share one canonical algorithm catalog', () => {
+  const canonicalAlgorithms = algorithmCatalog.map(entry => entry.id).sort()
+  const homepageAlgorithms = homepageFeatureCatalog
+    .filter(entry => entry.kind === 'algorithm')
+    .map(entry => entry.algorithmId)
+    .sort()
+  const benchmarkAlgorithms = benchmarkCatalog.algorithms.map(entry => entry.id).sort()
+
+  assert.deepEqual(homepageAlgorithms, canonicalAlgorithms, 'homepage algorithm cards should derive from canonical catalog')
+  assert.deepEqual(benchmarkAlgorithms, canonicalAlgorithms, 'benchmark labels should derive from canonical catalog')
+})
+
+test('benchmark catalog preserves shipped language order', () => {
+  assert.deepEqual(
+    benchmarkCatalog.languages.map(entry => entry.id),
+    ['cpp', 'go', 'rust'],
+    'benchmark legend should stay aligned with shipped languages'
+  )
+})
diff --git a/docs/zh/index.md b/docs/zh/index.md
index 150f4f8..c81de11 100644
--- a/docs/zh/index.md
+++ b/docs/zh/index.md
@@ -4,115 +4,14 @@ layout: home
 
 <script setup>
 import { onBeforeMount } from 'vue'
+import HomeLanding from '../.vitepress/theme/components/HomeLanding.vue'
+import { persistLocale } from '../.vitepress/theme/utils/language-preference.mjs'
 
 onBeforeMount(() => {
   if (typeof window !== 'undefined') {
-    localStorage.setItem('docs-lang-preference', `${import.meta.env.BASE_URL}zh/`)
+    persistLocale(window.localStorage, 'zh')
   }
 })
 </script>
 
-<div class="home-header">
-  <div class="home-header-left">
-    <div class="home-logo">CK</div>
-    <div>
-      <span class="home-title">CompressKit</span>
-      <span class="home-subtitle">无损压缩算法库</span>
-    </div>
-  </div>
-  <div class="home-nav">
-    <a href="./guide/getting-started">快速开始</a>
-    <a href="https://github.com/LessUp/compress-kit">GitHub</a>
-    <a href="../en/">English</a>
-  </div>
-</div>
-
-<div class="home-intro-row">
-  <div class="home-intro">
-    CompressKit 提供经典的无损压缩算法，支持跨语言兼容。C++ 编码，Go 解码。Rust 编码，C++ 解码。所有实现产生完全相同的二进制输出。
-  </div>
-  <div class="home-stats">
-    <span><strong>C++17</strong></span>
-    <span><strong>Go</strong></span>
-    <span><strong>Rust</strong></span>
-  </div>
-</div>
-
-## 算法
-
-<div class="feature-map">
-  <div class="feature-card">
-    <div class="feature-card-title">🌳 霍夫曼编码</div>
-    <div class="feature-card-desc">
-      基于符号频率的最优前缀码。经典的无损压缩方法。
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/huffman" class="feature-tag">了解更多</a>
-      <span class="feature-tag">速度快</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">🧮 算术编码</div>
-    <div class="feature-card-desc">
-      整个消息编码为单个数字。达到熵极限，实现最大压缩率。
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/arithmetic" class="feature-tag">了解更多</a>
-      <span class="feature-tag">高压缩率</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">🎯 区间编码</div>
-    <div class="feature-card-desc">
-      基于整数的算术编码。生产级的速度与压缩率平衡。
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/range" class="feature-tag">了解更多</a>
-      <span class="feature-tag">快 + 高压缩</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">📏 行程编码</div>
-    <div class="feature-card-desc">
-      针对重复数据的简单快速压缩。常作为预处理步骤使用。
-    </div>
-    <div class="feature-tags">
-      <a href="./algorithms/rle" class="feature-tag">了解更多</a>
-      <span class="feature-tag">极快</span>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">🔄 跨语言兼容</div>
-    <div class="feature-card-desc">
-      一种语言编码，另一种语言解码。所有实现产生完全相同的二进制输出。
-    </div>
-    <div class="feature-tags">
-      <a href="./guide/getting-started" class="feature-tag">快速开始</a>
-      <a href="./testing/cross-language" class="feature-tag">测试</a>
-    </div>
-  </div>
-
-  <div class="feature-card">
-    <div class="feature-card-title">📊 性能基准</div>
-    <div class="feature-card-desc">
-      跨所有算法和语言的性能基准测试。比较速度和压缩率。
-    </div>
-    <div class="feature-tags">
-      <a href="./benchmarks/results" class="feature-tag">查看结果</a>
-      <a href="./benchmarks/how-to-run" class="feature-tag">运行测试</a>
-    </div>
-  </div>
-</div>
-
-<div class="quick-start">
-  <div class="quick-start-title">快速开始</div>
-  <div class="quick-start-content">
-    <div class="command-block">
-      <code>git clone https://github.com/LessUp/compress-kit.git && cd compress-kit && make build && make test</code>
-    </div>
-  </div>
-</div>
+<HomeLanding locale="zh" />