尧图网站建设 
Refly v0.4.1 版本解析多组件可视化、代码组件系统与画布体验升级【免费下载链接】reflyThe first open-source agent skills builder. Define skills by vibe workflow, run on Claude Code, Cursor, Codex more. Build Clawdbot · APIs for Lovable · Bots for Slack Lark/Feishu · Skills are infrastructure, not prompts.项目地址: https://gitcode.com/GitHub_Trending/re/reflyRefly v0.4.1 是该版本线中一次以AI 创作体验为核心的重要迭代它显著强化了 QA 能力引入了同一响应内多组件SVG / Mermaid / HTML可视化构建了可实时预览、可一键部署的代码组件系统完整替代 yourware.so 的定位并对画布的节点组织、复制与共享体验做了系统性增强。读完本文你将了解这一版本各功能点在前端渲染层与后端 API 层的真实落地位置便于在实际使用中理解其能力边界、定位相关源码并进行二次开发。一、版本概览根据官方更新日志 v0.4.1 发布说明本次发布的主线能力可以归纳为更聪明的 AI 交互全模式基础问答、联网搜索、知识库检索结果优化概念讲解附带可视化演示并移除了备忘录内容的截断限制以保留更完整的上下文可视化创新单次响应中支持 SVG、Mermaid、HTML 多组件混排并支持预览/代码视图切换代码组件革命实时预览修改后的代码组件一键部署网页、SVG 与 Mermaid 图整合 shadcn/ui 与 Tailwind 用于 React 组件场景画布体验增强新的 AI 问答卡片创建方式、拖拽卡片生成组件、右键/双击节点菜单、节点分组命名与背景色自定义等社交与共享AI 创作成果、代码组件、画布均可一键分享给社区性能与稳定性预览卡片滚动、连接线丢失、画布存在性校验等一系列底层问题修复。二、AI 问答体验增强v0.4.1 对问答链路做了三类优化基础 QA、Web Search、知识库检索结果优化同一问题在不同检索模式下返回的答案质量统一提升概念讲解可视化模型在解释概念时会生成可视化演示配合下一节的多组件渲染能力直接展示取消备忘录内容截断此前备忘录内容在送入上下文时存在长度截断移除该限制后模型能理解更完整的用户笔记内容。这几点属于服务端提示词与上下文组装层面的优化从源码结构看问答与知识库检索分别由 knowledge 模块 与 search 模块 承载可在其中追踪检索结果的拼装逻辑。三、多组件可视化一次响应内的 SVG、Mermaid 与 HTMLv0.4.1 允许 AI 在同一条响应中输出多个可视化组件而不是只能选其一。每个组件支持预览视图与源代码视图之间快速切换一键创建为独立组件便于二次开发或微调SVG 与 Mermaid 图支持一键下载或复制到剪贴板。Mermaid 渲染层的源码实现前端渲染入口位于 Mermaid 渲染组件其中几个设计细节与版本说明的能力直接对应渲染缓存组件内维护diagramCachekey 为 Mermaid 源码 主题避免重复渲染同一图这是多组件同屏场景下的性能关键预览/代码双视图通过viewMode: code | preview状态切换对应更新日志中预览与代码视图轻松切换下载与复制引入domToPng与copyText工具见 lazy-loader 工具库将 SVG DOM 转成 PNG 下载、将源码复制到剪贴板一键转代码组件组件中调用了useCreateCodeArtifactHook见 use-create-code-artifact即把当前 Mermaid/SVG 直接固化为可编辑、可共享的代码组件——这正是快速创建组件用于二次开发的实现路径。Mermaid 的懒加载模块位于 mermaid 懒加载封装保证首次用到图表时才加载依赖降低首屏成本。四、代码组件系统替代 yourware.so 的完整方案v0.4.1 将代码组件能力补齐为一套完整系统官方定位是完整替代 yourware.so的用法AI 生成 Web 页面或图形组件后不再只是给你一段代码而是可交互的工件。核心能力包括实时渲染修改组件代码后即时重新渲染预览一键部署Web 页面、SVG、Mermaid 图均可一键部署为可访问的成品画布多组件多个代码组件可放到同一画布中并支持共享技术栈整合React 组件场景整合 shadcn/ui 与 TailwindHTML 组件支持 Tailwind。前端Code Runner 渲染管线代码组件的渲染管线位于 artifacts/code-runner 目录按渲染类型拆分shadcn.ts 内置了 shadcn/ui 组件源码如 Accordion 等 Radix 基座组件与cn工具函数使 AI 生成的 React 组件在沙箱中可直接引用 shadcn 风格 UI 而无需手动安装依赖react.tsx 负责 React 组件的运行时渲染svg.tsx 与 html.tsx 分别处理 SVG 与纯 HTML 组件编辑器侧基于 Monaco见 monaco-editor 目录并提供 SimpleTextEditor 作为降级方案。后端Code Artifact 持久化 API代码组件在后端由 code-artifact 模块 提供 REST 接口路由前缀v1/codeArtifact均需要登录态接口方法说明newPOST创建代码组件对应一键创建组件updatePOST更新组件内容实时预览的数据来源detailGET按artifactId查询单个组件listGET按resultIdresultVersion分页列出某次 AI 响应产出的全部组件needContent控制是否返回正文默认 false默认page1、pageSize10从源码结构看list接口以resultId聚合同一响应版本下的多个组件与一次响应支持多组件、并可逐个固化为组件的设计一一对应请求/响应类型定义在 openapi-schema 中可查阅UpsertCodeArtifactRequest等类型了解完整字段。五、画布Canvas体验升级画布是 Refly 的核心工作区v0.4.1 的交互增强包括新的 AI 问答卡片创建方式可通过卡片拖拽在画布上直接生成组件节点菜单右键与双击节点弹出操作菜单支持快速创建 AI 问答卡片、网站卡片与备忘录全屏快捷键AI 响应与代码组件均支持全屏展示节点分组分组名称可自定义背景色可调整。画布 API复制、导入导出与版本管理这些交互背后的持久化与同步能力集中在 画布控制器路由前缀v1/canvas。其中与本次版本直接相关的接口包括画布复制POST v1/canvas/duplicateduplicateCanvas即更新日志中支持画布复制、高效批量复制节点做实验的服务端入口服务层执行时带有checkOwnership: true的属主校验导入/导出POST v1/canvas/import仅接受application/json且限制 10MB见 canvas.controller.ts#L121-L143GET v1/canvas/export返回下载 URL状态同步与版本getState/setState/getTx/syncState/createVersion系列接口由 canvas-sync 服务 提供支撑复杂画布加载性能与画布存在性校验类修复对应 Core Improvements 一节列表与检索GET v1/canvas/list支持keyword关键字、order排序默认updationDesc、以及scheduleStatus/hasSchedule定时任务相关过滤。画布数据模型与操作工具在 canvas-common 包 中实现并配有 data.test.ts、sync.test.ts 等测试用例可用来理解节点操作与同步协议的边界行为。六、其他新增能力订阅管理支持套餐升级如 Plus 升级到 Max。需要注意版本说明中给出的适用前提升级当时需联系开发者处理产品内自助升级即将上线请以当时官方渠道为准备忘录文本颜色支持自定义备忘录文本颜色并随共享内容一起分发。七、核心修复清单v0.4.1 的稳定性优化集中在画布渲染与状态一致性上修复项包括预览卡片的纵向滚动问题节点连接线丢失问题QA 或画布创建后画布存在性校验失败的问题复杂画布加载体验优化分组拖拽后节点连接线对齐异常落地页展示改进含社群入口。其中第 3、4 项与画布状态同步机制上文 canvas-sync 的syncState/getTx增量事务关系最密切从源码结构看修复大概率落在同步服务的状态一致性与加载流程中可在 canvas.processor.ts 与 canvas-sync 服务中进一步追踪。八、延伸阅读版本发布说明本文事实来源docs/en/changelog/v0.4.1.md画布后端 API 与同步canvas.controller.ts、canvas-sync 模块代码组件后端 APIcode-artifact.controller.ts多组件渲染前端mermaid 渲染器、code-runner 渲染管线画布数据/同步协议canvas-common 包后续版本演进可对照 v0.4.2 更新日志 查看该版本线在 v0.4.1 基础上继续演进的方向。【免费下载链接】reflyThe first open-source agent skills builder. Define skills by vibe workflow, run on Claude Code, Cursor, Codex more. Build Clawdbot · APIs for Lovable · Bots for Slack Lark/Feishu · Skills are infrastructure, not prompts.项目地址: https://gitcode.com/GitHub_Trending/re/refly创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Refly v0.4.1 版本解析：多组件可视化、代码组件系统与画布体验升级
Refly v0.4.1 版本解析多组件可视化、代码组件系统与画布体验升级【免费下载链接】reflyThe first open-source agent skills builder. Define skills by vibe workflow, run on Claude Code, Cursor, Codex more. Build Clawdbot · APIs for Lovable · Bots for Slack Lark/Feishu · Skills are infrastructure, not prompts.项目地址: https://gitcode.com/GitHub_Trending/re/reflyRefly v0.4.1 是该版本线中一次以AI 创作体验为核心的重要迭代它显著强化了 QA 能力引入了同一响应内多组件SVG / Mermaid / HTML可视化构建了可实时预览、可一键部署的代码组件系统完整替代 yourware.so 的定位并对画布的节点组织、复制与共享体验做了系统性增强。读完本文你将了解这一版本各功能点在前端渲染层与后端 API 层的真实落地位置便于在实际使用中理解其能力边界、定位相关源码并进行二次开发。一、版本概览根据官方更新日志 v0.4.1 发布说明本次发布的主线能力可以归纳为更聪明的 AI 交互全模式基础问答、联网搜索、知识库检索结果优化概念讲解附带可视化演示并移除了备忘录内容的截断限制以保留更完整的上下文可视化创新单次响应中支持 SVG、Mermaid、HTML 多组件混排并支持预览/代码视图切换代码组件革命实时预览修改后的代码组件一键部署网页、SVG 与 Mermaid 图整合 shadcn/ui 与 Tailwind 用于 React 组件场景画布体验增强新的 AI 问答卡片创建方式、拖拽卡片生成组件、右键/双击节点菜单、节点分组命名与背景色自定义等社交与共享AI 创作成果、代码组件、画布均可一键分享给社区性能与稳定性预览卡片滚动、连接线丢失、画布存在性校验等一系列底层问题修复。二、AI 问答体验增强v0.4.1 对问答链路做了三类优化基础 QA、Web Search、知识库检索结果优化同一问题在不同检索模式下返回的答案质量统一提升概念讲解可视化模型在解释概念时会生成可视化演示配合下一节的多组件渲染能力直接展示取消备忘录内容截断此前备忘录内容在送入上下文时存在长度截断移除该限制后模型能理解更完整的用户笔记内容。这几点属于服务端提示词与上下文组装层面的优化从源码结构看问答与知识库检索分别由 knowledge 模块 与 search 模块 承载可在其中追踪检索结果的拼装逻辑。三、多组件可视化一次响应内的 SVG、Mermaid 与 HTMLv0.4.1 允许 AI 在同一条响应中输出多个可视化组件而不是只能选其一。每个组件支持预览视图与源代码视图之间快速切换一键创建为独立组件便于二次开发或微调SVG 与 Mermaid 图支持一键下载或复制到剪贴板。Mermaid 渲染层的源码实现前端渲染入口位于 Mermaid 渲染组件其中几个设计细节与版本说明的能力直接对应渲染缓存组件内维护diagramCachekey 为 Mermaid 源码 主题避免重复渲染同一图这是多组件同屏场景下的性能关键预览/代码双视图通过viewMode: code | preview状态切换对应更新日志中预览与代码视图轻松切换下载与复制引入domToPng与copyText工具见 lazy-loader 工具库将 SVG DOM 转成 PNG 下载、将源码复制到剪贴板一键转代码组件组件中调用了useCreateCodeArtifactHook见 use-create-code-artifact即把当前 Mermaid/SVG 直接固化为可编辑、可共享的代码组件——这正是快速创建组件用于二次开发的实现路径。Mermaid 的懒加载模块位于 mermaid 懒加载封装保证首次用到图表时才加载依赖降低首屏成本。四、代码组件系统替代 yourware.so 的完整方案v0.4.1 将代码组件能力补齐为一套完整系统官方定位是完整替代 yourware.so的用法AI 生成 Web 页面或图形组件后不再只是给你一段代码而是可交互的工件。核心能力包括实时渲染修改组件代码后即时重新渲染预览一键部署Web 页面、SVG、Mermaid 图均可一键部署为可访问的成品画布多组件多个代码组件可放到同一画布中并支持共享技术栈整合React 组件场景整合 shadcn/ui 与 TailwindHTML 组件支持 Tailwind。前端Code Runner 渲染管线代码组件的渲染管线位于 artifacts/code-runner 目录按渲染类型拆分shadcn.ts 内置了 shadcn/ui 组件源码如 Accordion 等 Radix 基座组件与cn工具函数使 AI 生成的 React 组件在沙箱中可直接引用 shadcn 风格 UI 而无需手动安装依赖react.tsx 负责 React 组件的运行时渲染svg.tsx 与 html.tsx 分别处理 SVG 与纯 HTML 组件编辑器侧基于 Monaco见 monaco-editor 目录并提供 SimpleTextEditor 作为降级方案。后端Code Artifact 持久化 API代码组件在后端由 code-artifact 模块 提供 REST 接口路由前缀v1/codeArtifact均需要登录态接口方法说明newPOST创建代码组件对应一键创建组件updatePOST更新组件内容实时预览的数据来源detailGET按artifactId查询单个组件listGET按resultIdresultVersion分页列出某次 AI 响应产出的全部组件needContent控制是否返回正文默认 false默认page1、pageSize10从源码结构看list接口以resultId聚合同一响应版本下的多个组件与一次响应支持多组件、并可逐个固化为组件的设计一一对应请求/响应类型定义在 openapi-schema 中可查阅UpsertCodeArtifactRequest等类型了解完整字段。五、画布Canvas体验升级画布是 Refly 的核心工作区v0.4.1 的交互增强包括新的 AI 问答卡片创建方式可通过卡片拖拽在画布上直接生成组件节点菜单右键与双击节点弹出操作菜单支持快速创建 AI 问答卡片、网站卡片与备忘录全屏快捷键AI 响应与代码组件均支持全屏展示节点分组分组名称可自定义背景色可调整。画布 API复制、导入导出与版本管理这些交互背后的持久化与同步能力集中在 画布控制器路由前缀v1/canvas。其中与本次版本直接相关的接口包括画布复制POST v1/canvas/duplicateduplicateCanvas即更新日志中支持画布复制、高效批量复制节点做实验的服务端入口服务层执行时带有checkOwnership: true的属主校验导入/导出POST v1/canvas/import仅接受application/json且限制 10MB见 canvas.controller.ts#L121-L143GET v1/canvas/export返回下载 URL状态同步与版本getState/setState/getTx/syncState/createVersion系列接口由 canvas-sync 服务 提供支撑复杂画布加载性能与画布存在性校验类修复对应 Core Improvements 一节列表与检索GET v1/canvas/list支持keyword关键字、order排序默认updationDesc、以及scheduleStatus/hasSchedule定时任务相关过滤。画布数据模型与操作工具在 canvas-common 包 中实现并配有 data.test.ts、sync.test.ts 等测试用例可用来理解节点操作与同步协议的边界行为。六、其他新增能力订阅管理支持套餐升级如 Plus 升级到 Max。需要注意版本说明中给出的适用前提升级当时需联系开发者处理产品内自助升级即将上线请以当时官方渠道为准备忘录文本颜色支持自定义备忘录文本颜色并随共享内容一起分发。七、核心修复清单v0.4.1 的稳定性优化集中在画布渲染与状态一致性上修复项包括预览卡片的纵向滚动问题节点连接线丢失问题QA 或画布创建后画布存在性校验失败的问题复杂画布加载体验优化分组拖拽后节点连接线对齐异常落地页展示改进含社群入口。其中第 3、4 项与画布状态同步机制上文 canvas-sync 的syncState/getTx增量事务关系最密切从源码结构看修复大概率落在同步服务的状态一致性与加载流程中可在 canvas.processor.ts 与 canvas-sync 服务中进一步追踪。八、延伸阅读版本发布说明本文事实来源docs/en/changelog/v0.4.1.md画布后端 API 与同步canvas.controller.ts、canvas-sync 模块代码组件后端 APIcode-artifact.controller.ts多组件渲染前端mermaid 渲染器、code-runner 渲染管线画布数据/同步协议canvas-common 包后续版本演进可对照 v0.4.2 更新日志 查看该版本线在 v0.4.1 基础上继续演进的方向。【免费下载链接】reflyThe first open-source agent skills builder. Define skills by vibe workflow, run on Claude Code, Cursor, Codex more. Build Clawdbot · APIs for Lovable · Bots for Slack Lark/Feishu · Skills are infrastructure, not prompts.项目地址: https://gitcode.com/GitHub_Trending/re/refly创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考