---
title: "从 AI Suggestion 迁移到 AI Toolkit"
description: "了解如何从 AI Suggestion 扩展迁移到 AI Toolkit。"
canonical_url: "https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/advanced-guides/migration-guides/ai-suggestion"
---

# 从 AI Suggestion 迁移到 AI Toolkit

了解如何从 AI Suggestion 扩展迁移到 AI Toolkit。

AI Suggestion 扩展允许您让 AI 审核文档并展示用户可以接受或拒绝的建议。

您可以通过遵循[校对器指南](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/advanced-guides/proofreader.md)使用 AI Toolkit 实现相同的功能。

## 审核文档

在[校对器指南](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/workflows/proofreader.md)中，`proofreaderWorkflow` 方法被用来展示一个建议列表，用户可以接受或拒绝，这些建议来源于 AI 模型生成的 HTML 内容。

建议查看 `proofreaderWorkflow` 方法的[API 参考](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/api-reference/workflows.md)，以了解其参数和定制选项。

## 接受和拒绝建议

要了解更多关于建议如何存储和管理的信息，请查看[建议指南](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/agents/review-changes.md)。

特别地，使用 `applySuggestion` 方法来接受一个建议。

## 自定义建议的外观

建议的外观可以通过 AI Toolkit 的选项完全自定义。请参阅[建议样式指南](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/agents/review-changes/style-suggestions.md)。

您还可以使用 `renderDecorations` 选项在建议中[渲染 React 和 Vue 组件](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/agents/review-changes/style-suggestions.md#render-react-components-inside-a-suggestion)。请[查看 API 参考](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/api-reference/suggestions.md)。此选项可以配置为在选中建议时渲染弹出框或工具提示。

## 提升速度与性能

AI Toolkit 的建议工具比 AI Suggestion 扩展快得多，因为它支持流式加载建议（示例见[校对器指南](https://tiptap.zhcndoc.com/content-ai/capabilities/ai-toolkit/advanced-guides/proofreader.md)）。这是 AI Suggestion 扩展的一大改进，后者一次性加载所有建议，当建议数量多时可能导致性能问题。

AI Toolkit 还提供了将文档拆分成多个块的方法，每个块可以单独发送到 AI 并独立处理。对块的并行处理可以显著提升响应速度。

```ts
import { proofreaderApi } from './api'

// 获取 AI Toolkit
const toolkit = getAiToolkit(editor)

// 将文档拆分成默认大小的块
const chunks = toolkit.getHtmlChunks()

// 遍历每个块
for (const chunk of chunks) {
  // 读取该块内容
  const { content } = toolkit.tiptapRead({ range: chunk.range })
  // 调用 AI 生成应应用于该块的更改
  const operations = await proofreaderApi({ content })
  // 使用 `proofreaderWorkflow` 方法仅在该块的范围内设置建议
  toolkit.proofreaderWorkflow({
    range: chunk.range,
    operations,
  })
}
```