袁艺

袁艺 Alan Yuan

@LikeDreamwalker

前端 / 全栈 开发工程师
河北科技师范学院计算机科学与技术 学士北京 或 远程
前端 / 全栈 开发工程师 (2024.5 - 至今)
潞晨科技
负责Video Ocean的技术架构和方案设计，带领团队支持相关业务和需求开发
前端开发工程师 (2021.5 - 2024.5)
滴滴出行用户增长部(UT)
车主-商业化前端Owner，设计前端技术方案并完成需求开发工作
前端开发实习生 (2020.11 - 2021.3)
Worktile
支持PingCode和Worktile相关需求开发
Mirrorstone
Next.js
React
shadcn/ui
Tool Calling
Multi-Agents
Prompt Engineering
支持在线搜索和多种工具调用的多智能体应用。基于
DeepSeek
和
Vercel
。
无状态设计，所有信息存储本地，并支持生成信息的离线分享和存储。
多智能体
通过
DeepSeek R1
分析和拆解问题，将
DeepSeek V3
作为模型中间件完成具体问题回答和工具调用。
基于
Tool Calling
和
MCP
实现对多种工具的调用，支持在线搜索、相关信息获取等能力。
基于多
steps
实现多模型间的任务分配和协同工作，精准拆解和处理复杂问题
生成并渲染报告
Mirrorstone可以基于模型获取的信息生成报告，基于
MDX
实现报告的在线渲染
通过在
PDF
中嵌入原始数据实现报告的离线传递和在线阅读
无状态设计
Mirrorstone不需要登录即可使用，所有的对话记录和生成内容被保存在浏览器的
IndexedDB
中，用户可以通过离线分享这些数据实现传递。
开源并基于Vercel设计部署，任何人都可以部署一键部署自己专属的Mirrorstone应用。
Mirrorlake
Next.js
React
shadcn/ui
VS Code Extension
Python
Tool Calling
边缘服务
现代化的颜色分析和建议能力。包含 Mirrorlake Color Agent 和 Mirrorlake Color Highlighter 两个产品。
三层服务
实现优先。架构被划分为三层：Next.js 客户端、混合服务端（
Next.js
服务端与
Python
服务端）、推理引擎（
DeepSeek
）。
客户端快速响应用户交互并提供基础颜色转换，混合服务端提供进阶的颜色分析和建议能力，而推理引擎专注理解用户需求并通过
Tool Calling
完成任务。降低Agent产品中推理引擎的工作占比，减少运营成本并提高产品效率。
聚合部署
基于
Vercel 边缘服务
设计架构，实现在
Next.js
项目中聚合
Python
和
Next.js
服务端，混合计算并输出颜色分析和建议。
内嵌Webview
在插件中内嵌Webview，基于
PostMessage
实现与
Mirrorlake Color Agent
的同步交互。
Video Ocean
2024.6 - 至今
Next.js
React
shadcn/ui
Material UI
next-intl
MDX
边缘服务
潞晨科技
toC AIGC产品。聚合并允许业务自由配置多种生成组件，实现对包括视频、图片等内容的生成和编辑能力，同时包含一个LLM业务。
基于
RSC
和
Next.js 15
实现混合渲染和流式传输。基于边缘服务和
Next.js
服务端构建服务能力。
设计并实现 Video Ocean 的技术架构，带领并引导团队完成需求设计和开发，为产品运营和迭代设计提供建议和方案。
Next.js 和全栈架构
混合渲染
基于
RSC
设计整体架构，对组件进行极致拆分，最大程度提升渲染效率并。通过限制客户端组件的
context
以避免客户端运行时资源的滥用和不必要消耗（例如
zustand
等
store
，早期方案）。降低
SSR
水合压力并缓存部分关键数据以提供基础
PWA
支持。
服务端与边缘服务
我们将业务前端服务（
Next.js
）、业务后端服务和推理服务部署在相同集群，实现多服务间的内网访问；出于安全和性能考虑，仅在
Next.js
通过
Server Actions
和
Route Handlers
作为服务端API的唯一出口，结合混合渲染以最大程度降低不必要的数据传递。通过前端服务能力实现包括
OAuth
等功能，基于第三方边缘服务实现相关资源的缓存、转码和存储。
AI 生万物
原子化生成组件
拆解繁琐、复杂的AIGC输入参数，基于模型/模态维度原子化设计输入组件，实现任意输入参数的配置和排列组合，并聚合生成组件以快速复用。
"Feature List"
Video Ocean 的早期技术方案，也是大部分AIGC产品的技术方案。基于功能（比如文生视频、图生视频等）角度设计输入组件，实现功能维度的任意输入组件配置能力，并通过配置化实现对应功能的快速开发和上下线。
滴滴有车：车主商业化
2022.3 - 2024.5
MPX
Vue 2.x
滴滴出行
包含四个业务方向与十余个前端产品，前期致力于滴滴造车部门的营销和运营渠道探索，后期改为车主业务提供商业化能力并平衡方向预算收支。针对性能进行额外优化以提升业务转化效率，90分位数据稳定在
1.6
秒左右。
商业化的特点之一是所有子业务流程高度相符，通过对业务内核进行抽象可以极大程度复用已有业务逻辑，并降低开发成本，从而提高业务整体收益。
LikeDreamwalker.space
Nuxt 3
Vue 3.x
我的个人空间，包含我的经历、作品以及一些有趣的项目。
你现在正在阅读的简历就是由它在线生成的！
滴滴租车
2022.7 - 2023.10
MPX
Vue 2.x
滴滴出行
滴滴的战略新出行业务之一。基于
SPA
和
MPA
的大型商城类
CSR
产品。参与早期技术架构设计和迭代开发。联合其他部门完善集团在移动端支付和信用支付相关能力。
MaaS
2024.12 - 2025.3
Next.js
React
MDX
潞晨科技
昙花一现的MaaS服务类产品。基于配置化能力实现模型的快速变更，通过配置
MDX
渲染文档和
Playground
等内容。
因其他原因停止服务。