- 博客(408)
- 资源 (7)
- 收藏
- 关注
RSS订阅原创 AI 应用工程：企业 Agent 为什么不能止于 Demo？——从一次任务跑通到可恢复、可评测的生产系统
本文探讨了从Demo到生产级Agent实施的关键差异，提出了判断Agent是否具备生产可用性的四问框架：恢复：任务中断后能否继续同一Run，确保审批与证据链一致；信息边界：区分Run State（本次任务状态）、Memory（跨任务偏好）和Knowledge（外部事实源）；控制：通过Guardrail和Approval机制约束高风险动作；观测与评测：建立Trace定位问题、Outcome验证结果、Eval回归保障改进。
2026-08-04 16:55:06
383
原创 AI 应用工程：Tool、MCP、Skill 与 Workflow 如何接入 Agent？——搭建一个可运行的需求影响面分析 Agent
本文通过一个需求影响面分析任务Demo，清晰区分了Agent开发中的四类能力接入方式。
2026-07-29 17:19:01
458
原创 AI应用工程：Agent 的能力是如何扩展的？——Tool、Skill、Workflow 与 MCP 的职责边界
本文系统梳理了Agent能力扩展的四个关键概念——Tool、MCP、Skill和Workflow，并澄清了它们之间的实际关系。文章指出：Tool让Agent能执行动作但不形成任务方法；MCP解决多个Agent接入同一能力的标准化问题；Skill封装可复用的任务过程知识；Workflow则强制执行不可跳过的业务门禁。四者并非固定层级关系，而是根据"缺动作、缺连接复用、缺任务方法、缺强制门禁"四个问题缺口来选择相应解决方案。能力扩展应基于实际需求缺口，而非盲目堆砌技术组件。
2026-07-23 20:23:48
468
原创 AI应用工程：Agent 是如何工作的？——从一次模型调用到可运行的执行循环
本文探讨了AI助手在执行任务时的闭环流程，重点分析了模型调用（Tool Calling）与完整业务动作执行之间的关键差异。文章指出，模型仅负责生成结构化请求（如取消订单指令），而实际执行需要经过权限验证、业务校验、审批流程等环节。通过订单取消案例，详细拆解了从Tool Call到Agent Run的完整循环流程，包括模型决策、工具执行、环境反馈等关键步骤。最后强调，模型输出必须与实际业务系统对接才能形成闭环，仅靠模型调用无法保证任务完成，需要Runtime进行状态管理、异常处理和流程控制。
2026-07-21 15:45:58
417
原创 AI应用工程：从模型能力到企业生产力，AI应用正在进入工程化时代
本文探讨了AI模型在代码生成任务中从能力到实际交付的差距。虽然模型能生成代码片段，但真实项目开发涉及需求理解、组件复用、规范遵循、测试验证等多环节闭环。作者提出三层架构分析：模型能力层决定理解上限，任务闭环层通过工具调用和环境反馈推进任务，工程保障层确保过程可观测、可约束和可恢复。文章比较了单次调用、Workflow和Agent三种形态的适用场景，指出Agent适合动态决策任务但成本更高。最终强调，从模型响应到生产交付需要构建完整的执行闭环和工程保障体系，而不仅是优化Prompt或模型性能。
2026-07-16 17:22:20
393
原创 Agent系列：从 grill-me 学写 Skill——先找默认错误，再写最小约束
以 grill-me 为例，拆解 Agent 为何容易在需求未对齐时直接开工，并给出一套从默认错误反推 Skill 行为约束的方法。
2026-07-13 21:36:30
472
原创 AI Coding：从个人玩具到组织能力——AiDD 2026 公开实践拆解
在AI Coding实践中的核心经验是：先建立度量体系与过程控制，再将个人经验转化为组织能力。通过L0-L5等级划分明确团队能力阶段，利用Harness（触发、约束、隔离、审查）确保AI参与研发的可控性，遵循工具引入→基建接入→平台编排→数据闭环的递进路径，最终将重复性工作沉淀为可复用的Skills资产。关键在于平衡个人提效与组织交付，避免单纯追求出码率而忽视质量风险。
2026-07-08 11:02:03
430
原创 从 Prompt 到 Agent：LangChain 究竟解决了什么问题
如果系统只有 1-2 个固定步骤，直接调 API；如果步骤超过 3 个且需要频繁切换模型/Tool/RAG，用 LangChain 组件；如果出现分支、回退、人工审批，上 LangGraph。但每一步引入都要评估：框架省下的胶水代码，是否 worth 它带来的抽象复杂度。
2026-06-16 10:55:07
505
原创 Agent 系列：Skill 之上，编排为王
本文探讨了Agent技能协作的核心挑战，指出单纯增加Skill数量并不能提升Agent能力，关键在于解决技能间的协作问题。文章通过三个层级（Tool、Skill、Workflow）厘清了概念关系，指出Workflow的核心价值在于组织、协调和编排多个Skill的执行流程。通过三个真实场景（无效执行、数据断裂、无限重试）揭示了缺乏有效编排的后果，并提出了Workflow编排器的四个关键功能：状态管理、条件路由、容错机制和可视化调试。最终结论是：复杂场景下，Workflow能显著提升多技能协作效率
2026-06-12 10:30:58
1506
原创 反向拆解 skill-creator：一个好 skill 是怎么写出来的
以 skill-creator 为例，梳理三大设计原则：一是三层加载机制，分为触发层、执行层、工具层，规避信息过载；二是描述即触发器，精准撰写描述字段，平衡触发精准度，减少漏触发与误触发；三是采用结构化指引，精简主手册内容，拆分细节至辅助文档，搭建清晰层级调用关系。
2026-06-10 19:57:10
513
原创 微前端系列：基于Qiankun搭建企业级微前端项目
本文介绍了基于Qiankun框架搭建跨技术栈微前端项目的实践方案。项目采用"1主2子"架构：React主应用负责路由分发、全局状态管理；Vue3和React子应用独立开发业务功能。文章详细阐述了架构优势、职责划分、技术选型理由，并提供了初始化三个应用的具体步骤（端口配置、跨域处理等）。该方案实现了技术栈无关性、独立部署和渐进式迁移，适用于企业级复杂业务场景。
2026-03-09 19:57:09
907
原创 从 Webhook 到 OpenClaw：一个钉钉周报提醒机器人的进化史
本文以团队周五周报提醒这一常见场景，讲述自动化从人肉、Webhook 脚本到 OpenClaw+LobsterAI 的三代演进。2026 年爆红的开源 AI 代理框架 OpenClaw，实现了从工具到数字员工的突破，LobsterAI 则是其本土化中文增强版。借助 NLP、持久记忆与定时能力，用户可通过自然语言快速配置钉钉提醒，无需编写代码与部署维护，大幅降低成本。文章揭示 AI Agent 带来的范式转移：技术人员从编写胶水代码，转向定义业务意图、设计数字员工工作流，真正实现效率与价值的双重升级。
2026-02-28 23:50:24
1599
原创 微前端系列：主流前端框架选型与对比
聚焦微前端落地关键的框架选型，先明确易用性、兼容性、性能等五大核心选型维度，再深度解析Single-Spa、Qiankun等五大主流方案。Single-Spa灵活但需自研上层能力；Qiankun开箱即用，是中后台首选；EMP主打模块复用；Micro App轻量易用；wujie零侵入、强隔离。文章还提供各框架Hello World示例，帮助快速上手。明确选型后，后续将基于Qiankun搭建企业级跨框架实战项目，覆盖核心落地流程。
2026-01-26 20:53:16
2369
原创 微前端系列：隔离与通信机制
微前端核心原理探究：隔离与通信机制 本文深入探讨微前端的隔离与通信机制。隔离机制解决子应用间的JS全局变量和CSS样式污染问题，包含三种JS沙箱方案（快照沙箱、代理沙箱、ShadowRealm沙箱）和四种CSS隔离方案（样式前缀、CSS Modules、Shadow DOM、Scoped CSS）。通信机制则处理主应用与子应用间的数据交互需求。文章详细分析了各方案的实现原理、优缺点及适用场景，为微前端架构设计提供技术参考，确保子应用既能独立运行又能高效协同。
2026-01-12 18:18:50
1089
原创 微前端系列：路由分发与应用加载机制
本文深入探讨微前端架构中路由分发与应用加载的核心流程。主应用作为调度中心，负责全局布局、路由分发、子应用管理；子应用专注业务实现，暴露标准生命周期。文章详细解析了hash和history两种路由模式的实现机制及选择考量，并阐述了子应用从注册、匹配到加载、挂载的全流程。重点分析了基于HTML入口的资源加载方案，为微前端实践提供了关键技术路径。
2026-01-04 17:18:48
1324
原创 微前端系列：核心概念、价值与应用场景
微前端是一种将大型Web应用拆分为多个独立子应用的技术架构，核心思想是"分而治之"。它允许不同团队使用不同技术栈（如Vue、React）独立开发、测试和部署子应用，通过主应用进行整合，为用户提供统一体验。微前端主要解决团队协作阻塞、技术栈锁定、系统升级困难等问题，适用于大型中后台系统、多团队协作项目和遗留系统重构等场景。其核心能力包括子应用的动态加载/卸载、独立运行隔离、路由状态保持以及应用间通信机制。微前端通过JS/CSS隔离、沙箱技术等手段确保系统稳定性，同时支持渐进式重构，是复杂前端系统的有效架构方案
2025-12-30 14:34:59
1056
原创 monorepo系列：落地时的关键决策与常见错误
本文探讨了monorepo在实际落地中的关键决策和常见问题。在前期决策中，项目划分方式（按业务领域、功能角色、应用类型或技术栈）和工具选型（原生方案、专用工具或全家桶式）是成败关键。落地过程中需特别注意构建缓存策略、代码权限控制和依赖管理三大问题，建议采用增量构建、目录级权限控制和统一依赖版本等解决方案。文章强调monorepo并非银弹，应遵循"先简单后复杂"原则逐步推进，最终目标是提升团队协作效率而非盲目跟风技术潮流。
2025-12-08 16:37:21
997
原创 Monorepo系列：构建加速引擎 -- Turborepo
Turborepo 用最小侵入性解决了 Monorepo 的最大痛点——重复构建。它不提供代码生成、不做版本管理，只聚焦“任务调度 + 内容缓存”，因此能无缝嵌入任何现有仓库。核心特性：① 远程缓存 - 团队间共享构建缓存②任务管道- 定义任务间的依赖关系③并行执行 - 同时运行多个任务④增量构建 - 只重建发生变化的部分
2025-11-19 21:45:17
1604
原创 Monorepo系列：Pnpm Workspace 搭建 Monorepo
pnpm workspace 搭建 monorepo 的方式来管理前端业务代码，多个项目使用统一 git 仓库，具备依赖共享、构建统一等优势。①整个仓库使用统一的工具和配置，如构建工具、代码风格、测试框架等；一次修改，所有相关项目都能受益。②所有项目使用同一套依赖版本，便于管理，减少因版本不一致导致的问题【借助 pnpm Catalog 特性】③内部依赖可以直接通过工作空间链接，而不需要发布到包管理器【借助 pnpm workspace 工作空间协议】。
2025-10-23 15:20:26
1807
原创 React水合技术：优化SSR和CSR的完美结合
摘要： 水合（Hydration）结合了服务端渲染（SSR）和客户端渲染（CSR）的优势，将静态HTML转为动态可交互页面。传统CSR存在首屏空白和SEO问题，而SSR可能增加服务器负载。水合通过绑定事件、同步DOM和重建状态实现平滑过渡。常见方式包括： 完全水合：简单但可能阻塞主线程； 渐进式水合：按需加载，优化性能； 选择性水合（React 18+）：优先处理用户交互部分； 流式水合：分块传输提高响应速度。不同方案在性能、实现复杂度间权衡，适用于不同场景。
2025-10-13 21:05:17
1144
原创 在 UmiJS 中“全局注入”这件事：从编译时到运行时，一次说透
在 UmiJS 中，如果想全局注入属性，有几种常见的方式：编译期、HTML 期、React 运行时、首屏数据。本文将结合几个真实场景，给出“可直接粘贴”到项目里的代码片段，并彻底搞懂背后的“设计哲学”。
2025-09-26 16:46:55
1235
原创 深入理解 React 单向数据流：构建高效、可维护的组件架构
在 React 开发中，单向数据流是核心概念之一。它确保了数据的流向清晰且可预测，从而让组件之间的交互更加稳定和易于维护。本文将深入探讨 React 的单向数据流机制，从数据传递方式、更新机制，到优化技巧和高阶用法，帮助你构建更加高效和可维护的 React 应用。
2025-07-07 16:23:58
996
原创 TypeScript系列：第六篇 - 编写高质量的TS类型
在当今快速发展的软件开发领域，代码的可读性、可维护性和安全性是重中之重。TypeScript作为一种强大的编程语言，其类型系统为实现这些目标提供了强大的支持。掌握TypeScript的类型编写，不仅能让你的代码更加清晰、健壮，还能显著提升开发效率和团队协作能力。本文将深入探讨TypeScript类型编写示例，掌握这些，事半功倍。
2025-07-01 19:55:28
981
原创 性能：React 实战优化技巧 之 函数闭包
🚧 示例：点击子组件中按钮，获取 input 数据进行提交（常见于表单）React 中：组件内的每个函数都是一个闭包，因为组件本身只是一个函数。组件就被重新渲染一次【prop onClick 发生了变化】！借助 ref 每次渲染间存储信息及修改不会触发渲染的特性；函数虽然在整个组件生命周期中保持不变，但它通过调用。，在 props 没有改变的情况下跳过重新渲染！动态更新引用的函数，避免了闭包问题。函数会被重新创建，从而捕获最新的。，避免传递给组件的 props。：这个参数在首次渲染后被忽略。
2025-02-20 21:28:20
1177
原创 TypeScript系列：第五篇 - 断言&守卫（as、satisfies、is、as const）
类型断言是一种编译时的机制，它不会在运行时检查类型，而是告诉编译器按照指定的类型处理变量。类型守卫是一种运行时的机制，它通过检查来确保变量的类型，并根据检查结果改变类型信息。类型确认是一种更加灵活的机制，它指定一个对象必须满足某种类型的结构，但不会改变该对象的类型。在编写 TypeScript 代码时，推荐尽可能使用类型守卫，因为它们提供了运行时的安全性。类型断言应该谨慎使用，只在你完全确定变量类型的情况下使用，以避免运行时错误。
2024-10-17 11:46:12
1712
原创 TypeScript系列：第四篇 - typeof 与 keyof
本文将详细介绍keyof和typeof运算符的基本概念、应用场景以及如何结合使用它们来提高代码的类型安全性。keyof运算符用于获取一个类型的所有键名（属性名）。typeof运算符用于获取一个变量的类型。
2024-09-24 20:19:28
1569
原创 TypeScript系列：第三篇 - 泛型
泛型（Generics）本质上是一种参数化类型。在定义时不指定具体数据类型，用一个或多个占位符（通常用字母「如TUV」）来表示类型参数；而在使用时指定具体的数据类型。return arg;上述函数返回值的类型与参数类型相关；可以接收任何类型的参数，并返回相同类型的值。指类型参数，可以将其理解为类型声明需要的变量，在调用时传入具体的参数类型。调用时提供具体类型string省略不写，TypeScript 通常可以在泛型调用中推断出预期的类型参数。
2024-09-24 20:12:47
1458
原创 TypeScript系列：续篇 - 对象类型（含数组、元数组、函数）
在 TypeScript 中，对象类型用于定义对象的形状（shape），即对象包含哪些属性以及这些属性的类型。对象类型可以是具体的，也可以是抽象的，用于类型检查和类型推断。或。🚎 接口interface：适合定义对象的形状，并且可以被扩展和实现，这使得它在面向对象编程中非常有用。🚃 类型别名type：更灵活，可以定义更复杂的类型，包括联合类型、交叉类型、字面量类型和映射类型。
2024-09-12 21:45:33
1100
原创 TypeScript系列：初篇 - 类型系统
TypeScript 是 JavaScript 的一个超集，添加了类型系统和编译期错误检查等功能 => 静态类型检查。类型指的是一组具有相同特征的值。静态类型系统描述了运行程序时的值的形状和行为。TypeScript 支持块级类型声明，即类型可以声明在代码块（用大括号表示）里面，只在当前代码块有效。
2024-09-12 21:18:11
1578
2
原创 Git 仓库间代码迁移 | merge & cherry-pick
工作中遇到了这样场景：原工程 A 由于业务发展，衍生出了 B 工程，至此两个工程独立迭代。A 工程近期上线了一个功能，B 工程也希望具备该功能，需要研发同学做代码的同步。merge将两个或多个分支的历史合并在一起；cherry-pick允许开发者精确地选择和应用特定的提交到不同的分支。
2024-09-03 20:03:28
1232
2
原创 Immutable-持久化数据结构：助力 React 性能提升
如果组件的属性和状态是不可变的数据结构，可以显著简化Diff算法的复杂性：引用比较：每次更新都会产生一个完全新的对象，而不是修改原有对象，React可以简单地通过比较对象的引用，来确定数据是否发生了变化。如果两个对象的引用不同，那么肯定不同，这比深度比较数据结构的每个部分要快得多；结构共享：Immutable数据结构在进行更新时，只创建变动部分的新实例，而保留未变部分的引用。这意味着在Diff算法中，React能够迅速识别出哪些部分是完全相同的，从而跳过这些部分的比较，直接关注那些确实发生了变化的部分。
2024-08-14 21:32:20
1196
1
原创 npm vs pnpm 之幽灵依赖
项目使用 npm 安装依赖可以正常运行，而使用 pnpm 安装依赖运行报错！使用 npm 安装，所有依赖都被提升到了 node_modules 下（npm@3之后的依赖扁平化，解决路径地狱）；使用 pnpm 安装，只有直接依赖（package.json dependences 中声明）安装在 node_modules 下，其他在 .pnpm（扁平化） 目录下。
2024-08-07 11:15:53
1767
原创 Thinking--在应用中添加动态水印，且不可删除
水印是一种用于保护版权和识别内容的技术，通常用于图像、视频或文档中。它可以是文本、图像或两者的组合，通常半透明或以某种方式嵌入到内容中，使其不易被移除或篡改。静态水印易于实现，且不会影响页面的加载和渲染性能；但容易被移除，且不能动态调整文案（在应用系统中，水印往往是登录者信息）。动态水印可以根据用户行为或特定条件动态显示或隐藏水印
2024-07-09 20:16:50
754
原创 Thinking--Promise解决动态挂载静态资源重复问题
循环过程会产生多个 `` 组件实例，进而产生多个获取资源 `loadResources()` 的调用。加载资源是异步过程，`window.videojs` 资源加载完才会追加。解决思路：1. 将实例创建改成串行，确保第二个初始化时，第一个已经处理完毕（存在），这样 `window.videojs` 的判断可以生效。=> 可以解决，但不是最佳方案，整体页面渲染效率下降 2. 初始化多个 `` 实例（并行加载），确保资源只加载一份。=> 资源全局单例
2024-07-02 19:05:37
1204
原创 React 通信：深层传递（Props、Context、Children Jsx）
当需要在组件树中深层传递参数以及需要在组件间复用相同的参数时，传递 props 就会变得很麻烦。Context 使组件向其下方的整个树提供信息，会穿过中间的任何组件。子组件可以通过某种方式“访问”到组件树中某处在其上层的数据。无需逐层透传，直接广播形式！需要的组件直接获取。
2024-06-19 14:39:05
1601
4
原创 useTransition：开启React并发模式
并发模式（Concurrent Mode）的一个关键特性是渲染可中断。React 18 之前，更新内容渲染的方式是通过一个单一的且不可中断的同步事务进行处理。同步渲染意味着，一旦开始渲染就无法中断，直到用户可以在屏幕上看到渲染结果。在并发渲染中，React 可以开始渲染一个更新，然后中途挂起，稍后又继续；甚至可能完全放弃一个正在进行的渲染。整个过程 UI 会保持一致。为了实现这一点，它会在整个 DOM 树被计算完毕前一直等待，完毕后再执行 DOM 变更。
2024-05-24 11:07:01
1823
原创 性能：React 实战优化技巧
性能优化的主要点：①减少DOM的渲染频次；②减少DOM的渲染范围；③非必要的内容延后处理。避免不必要的组件重新渲染，是提高程序性能的重要方式之一。
2024-05-07 10:53:57
1047
2
原创 Reducer：让代码更灵活&简洁
对于拥有许多状态更新逻辑的组件来说，过于分散的事件处理程序可能会令人不知所措。对于这种情况，可以将组件的所有状态更新逻辑整合到一个外部 Reducer 函数中。
2024-04-29 14:47:31
1000
原创 Fiber：React 的性能保障
在React 16之前，React使用虚拟DOM和基于递归的协调算法（称为Stack Reconciler）。递归过程一旦开始就不能中断，如果组件树层级很深，递归会占用线程很多时间，造成卡顿。Fiber架构重新实现了协调过程，将原来的递归不可中断的更新过程，改为基于循环和链表的**异步的可中断更新**。用于递归的**虚拟DOM**数据结构已经无法满足需要，Fiber树应运而生。Fiber节点比传统的虚拟DOM节点包含更多的信息（如副作用、优先级、指向兄弟节点和父节点的指针等）。
2024-04-22 16:03:34
1167
2
程序员面试宝典-前端-2023最新
2023-02-23
aes加密&解密算法前端实现
2023-02-23
毕业论文-办公自动化系统的设计和实现
2023-02-20
jquery插件
2014-11-15
yuicompressor-2.4.jar
2014-11-10
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人