- 博客(36)
- 收藏
- 关注
RSS订阅原创 最近开始补 Java，聊聊我对全栈的一点感受
现在学 Java，会开始多想一些工程化的问题：接口怎么设计更稳定，业务逻辑放在哪一层，异常怎么处理，数据结构后面会不会难扩展，服务之间怎么协作。Python 这块主要是用来做 AI 相关的东西，比如模型调用、Agent、RAG、数据处理、一些 AI 应用的快速验证之类的。不是为了追热点，而是为了在业务变化的时候，自己能跟得上，也能多承担一点完整的问题。对我自己来说，之前的前端经验让我更理解用户看到的东西，Python 让我能把 AI 能力快速验证和落地，现在学 Java 是在补更正式的后端工程能力。
2026-06-10 10:59:00
103
原创 Agent 实战的底层逻辑
文章摘要：当前Agent技术虽热，但生产实践经验稀缺。核心观点是Agent本质上是上下文工程（Context Engineering），能力上限取决于信息组织方式。文章指出应避免过度依赖框架、迷信长上下文，强调Benchmark优先、工具设计简洁、缓存优化等实践原则。同时提醒Memory技术尚未成熟，复杂编排可能适得其反，主张保持简单核心循环。随着模型进步，真正持久的Agent系统将是那些深刻理解模型本质而非堆砌功能的方案。（149字）
2026-05-30 21:56:36
385
原创 setState 更新流程：从 dispatchAction 到 Fiber 更新与 lane 调度
React19状态更新机制解析：从setState到渲染的全链路流程 本文基于React19源码剖析状态更新核心流程：1) dispatchAction创建update对象并入队；2) scheduleUpdateOnFiber调度更新并标记lane优先级；3) lane模型控制更新优先级与可中断性；4) workInProgress复用Fiber实现并发安全；5) 完整更新链路包含render阶段的状态计算、commit阶段的DOM操作及passive effect执行。重点解析了updateQueue管
2026-05-20 11:31:04
326
原创 useEffect 为什么延后执行：passive effects 的调度与刷新
React19中useEffect的执行机制：passive effect在commit阶段后异步执行。render阶段仅标记effect（通过Fiber.flags和subtreeFlags），不执行回调。commit阶段完成DOM更新后，通过微任务队列flushPassiveEffects依次执行cleanup和create回调。这种设计保证了：1）不阻塞渲染和主线程；2）执行顺序与hooks调用一致；3）cleanup先于create执行；4）并发渲染安全。与useLayoutEffect不同，use
2026-05-19 10:45:37
279
原创 commitRoot 三个阶段：beforeMutation、mutation 与 layout
React19的commit阶段将render结果应用到DOM，分为三个不可中断的子阶段：beforeMutation阶段捕获快照并执行getSnapshotBeforeUpdate；mutation阶段实际修改DOM，处理节点增删改和ref；layout阶段同步执行类组件生命周期和useLayoutEffect。整个过程依赖render阶段生成的flags和effectlist进行高效遍历，确保DOM操作原子性。与可中断的render阶段不同，commit阶段必须同步完成所有DOM修改和布局计算，保证页面
2026-05-18 13:50:47
344
原创 render 阶段如何结束：finishedWork、flags 与 commit 入口
本文分析了React 19中render阶段的完成机制。重点包括：1) render阶段结束标志是workInProgress为null，此时DOM已创建/更新完成，flags和subtreeFlags完成聚合；2) completeWork通过bubbleProperties向上汇总子树副作用；3) 生成的finishedWork作为commit阶段入口；4) 同步和并发渲染的区别在于是否可中断；5) commit阶段根据flags执行DOM操作。文章详细阐述了render到commit的过渡过程，包括状
2026-05-15 11:44:40
344
原创 completeWork：真实 DOM 是在哪里被创建的
本文详细解析了React的completeWork阶段，主要包含以下要点： render阶段分为beginWork和completeWork两个方向：beginWork向下创建子Fiber，completeWork向上完成当前Fiber并创建DOM。 真实DOM创建发生在completeWork阶段： HostText通过createTextInstance创建文本节点 HostComponent通过createInstance创建元素节点 使用appendAllChildren将子DOM附加到父DOM 函
2026-05-14 11:56:01
356
原创 reconcileChildren 深入：React 如何根据 ReactElement 构建子 Fiber
本文深入解析了React中函数组件在beginWork阶段的调和过程。核心流程包括：1）通过renderWithHooks执行组件函数获取ReactElement；2）调用reconcileChildren将ReactElement转换为子Fiber链表。重点分析了mountChildFibers和reconcileChildFibers的区别、数组children的diff算法、key和type的复用规则，以及React19新增的Thenable处理等特性。文章详细阐述了从组件返回值到Fiber子树的完整
2026-05-13 14:16:26
436
原创 FunctionComponent 如何执行：renderWithHooks 与 Hooks 链表
本文深入解析了React函数组件的执行机制，重点阐述了Hooks的实现原理。主要内容包括：1. 函数组件在updateFunctionComponent阶段执行，通过renderWithHooks接管执行；2. Hooks状态存储在Fiber节点的memoizedState链表中，而非组件闭包；3. 初次渲染时mountState创建Hook节点，更新时updateState复用旧Hook；4. Hooks依赖调用顺序匹配，因此不能写在条件语句中；5. useEffect在render阶段只登记effect
2026-05-12 13:57:21
310
原创 beginWork 的第一站：HostRoot 如何把 App 接入 Fiber 树
本文深入解析了React初次渲染过程中HostRootFiber的关键作用。当调用root.render(<App/>)时，React并不会立即创建App Fiber，而是将更新存入HostRootFiber的updateQueue。在render阶段，beginWork处理HostRootFiber时会执行updateHostRoot，该过程主要完成：1) 通过processUpdateQueue从updateQueue中取出<App/>元素；2) 将元素作为children传递给
2026-05-11 10:14:36
360
原创 从 performWorkOnRoot 到 workInProgress tree：React 真正开始 render 的地方
本文深入解析了React 19中render阶段的执行流程。从performWorkOnRoot入口开始，详细阐述了同步渲染(renderRootSync)和并发渲染(renderRootConcurrent)的区别，重点分析了prepareFreshStack如何创建workInProgress树，以及beginWork和completeWork的分工协作机制。特别指出初次渲染时App组件是在beginWork阶段通过reconcileChildren转换为Fiber节点的过程，而非在root.rende
2026-05-09 17:37:38
464
原创 从 scheduleUpdateOnFiber 到 Root 微任务调度：React 如何把更新交给调度系统
React 18与19调度机制差异解析：从更新到渲染的核心链路变化 React 18与19在调度机制上存在显著差异。React 18中，ensureRootIsScheduled直接进行完整的调度决策，同步任务进入内部队列，并发任务通过Scheduler注册。而React 19引入Root微任务调度模型：先将Root加入全局链表，延后到微任务中统一处理。关键变化在于，React 19将调度决策点后移，通过processRootScheduleInMicrotask批量处理所有Root，同步任务在微任务末尾统
2026-05-08 14:32:36
341
原创 从 createRoot 到 root.render：React 更新链路的起点到底做了什么
React 18 引入 createRoot API 取代传统的 ReactDOM.render，这一改变体现了 React 内部模型的重大升级。新 API 通过显式创建 Root 对象（FiberRootNode 和 HostRootFiber），建立了更清晰的更新机制：createRoot 初始化应用根结构，root.render 则创建更新任务。这种分离使 React 能够更好地管理更新优先级、调度和并发渲染。关键改进包括将 ReactElement 封装为 update 对象、引入 lane 优先级
2026-05-07 11:25:17
336
原创 createRoot 到底创建了什么：FiberRootNode 和 HostRootFiber 的初始化过程
React 18中，createRoot(container)初始化了React应用的核心结构：创建了FiberRootNode管理根状态，包括容器引用、调度信息等；同时生成HostRootFiber作为Fiber树的根节点，两者通过current和stateNode相互引用。此时尚未渲染用户组件，仅初始化了更新队列，为后续root.render()做准备。这一改动不仅是API变更，更明确了并发模式的根结构创建过程。
2026-05-06 11:32:37
362
原创 为什么 React 18 之后使用 createRoot，而不是 ReactDOM.render
React 18 引入了新的应用入口 API createRoot()，取代了原有的 ReactDOM.render()。这一变化不仅是语法调整，更是模型层面的重大改进。新 API 显式暴露了 Root 概念，将创建根容器和提交更新明确分离：createRoot() 创建长期存在的根容器对象，root.render() 则提交更新。这种设计更符合 React 18 并发渲染的架构，支持优先级调度、中断恢复等新特性，同时也统一了首次渲染和后续更新的处理模型。新 API 强调 Root 作为 React 运行时
2026-05-05 14:07:14
386
原创 Fiber 到底是什么：从数据结构到 React 运行时执行单元
React Fiber架构解析 Fiber是React的核心执行单元，不同于仅描述UI结构的ReactElement，Fiber是一个完整的运行时数据结构。它主要承担六大功能：1）保存组件状态（如Hooks状态存储在memoizedState）；2）维护组件树结构关系（通过child/sibling/return指针）；3）管理更新队列（updateQueue）；4）标记副作用（flags）；5）记录调度优先级（lanes）；6）实现双缓存机制（alternate）。 Fiber架构的关键创新在于将递归渲染
2026-04-27 15:09:28
367
原创 React 是如何从 ReactElement 进入 Fiber 体系的？
ReactElement作为静态描述，在更新过程中并非直接转换为Fiber结构。当调用root.render()时，ReactElement被封装为update对象进入HostRootFiber的updateQueue。真正的转换发生在render阶段，通过createFiberFromElement将ReactElement转换为具备调度能力的Fiber节点。这一过程实现了从描述系统到执行系统的关键跨越，其中元素type决定Fiber的tag类型，进而影响后续执行路径。整个转换过程体现了React更新机制
2026-04-24 14:36:30
394
原创 JSX 到 ReactElement：React 的“UI描述层”到底在解决什么问题？
React通过JSX生成不可变的ReactElement对象来描述UI结构，而非直接操作DOM。ReactElement作为UI的快照描述，包含type、props等字段，支持跨平台渲染和并发更新。其不可变性确保了渲染阶段的纯净性，并为后续Fiber架构的diff计算提供基础。ReactElement仅描述UI，实际DOM操作由Fiber执行结构完成，形成"描述-计算-执行"的分层架构，解决了直接操作DOM带来的性能问题和平台限制。
2026-04-17 10:49:16
397
原创 React 源码该从哪里开始看？先别急着啃 Fiber（工业级避坑指南）
《React源码阅读的正确路径：从宏观模型到微观实现》摘要：阅读React源码失败的主因在于缺乏整体认知框架。React本质是一个UI异步调度操作系统，核心包含描述UI、计算变化和执行更新三个环节。理解源码必须建立五大核心模型：ReactElement静态说明书、Fiber执行单元、Lane优先级控制、双缓存机制及Effect标签系统。源码阅读应聚焦react、react-reconciler和scheduler三个核心包，重点把握主流程而非细节优化。Fiber链表结构实现了可中断渲染，Hooks依赖Fib
2026-04-15 09:11:12
368
原创 告别人肉 i18n：我做了一个 VS Code 插件，把国际化拉回“人类”的工作流
《I18nWorkflowHelper：解决前端国际化开发痛点的智能工具》摘要 该工具针对前端国际化(i18n)开发中的核心痛点，提出了一种工程化解决方案。不同于传统i18n框架，它专注于开发流程优化，主要解决三个关键问题：1)通过智能提取和自动同步功能消除人工维护JSON文件的繁琐；2)提供工作区扫描功能，检测遗漏文案和冗余Key；3)实现安全的翻译文件差异预览与导入。工具刻意避免自动翻译，强调流程严谨性，保持开发者对翻译内容的控制权。支持React/Vue/TS项目，以开源形式持续优化，旨在将国际化从&
2026-03-18 10:26:35
320
原创 OpenClaw 深度技术指南：从原理、使用技巧到架构分析
OpenClaw 不是一个“必须马上掌握”的工具。AI 不只是聊天工具，而是可以成为一个长期运行的系统。消息入口↓AI Gateway↓↓自动化执行OpenClaw 只是这个方向上的一个早期探索。与其焦虑是否“落后”，不如把它当作一个观察 AI 系统架构的窗口。
2026-03-10 16:08:15
466
原创 信号崛起：为什么 2026 年的前端框架都在“背叛”虚拟 DOM？
Signals 的回归标志着前端工程化从**“声明式渲染的粗放管理”向“精细化性能控制”**的演进。它让开发者能写出既符合直觉、又具备原生性能的代码。2026 年，掌握 Signals 已经不再是可选项，而是构建下一代高性能 Web 应用的必修课。
2026-03-06 14:29:39
329
原创 别再只当“提示词工程师”了：Claude Code 才是开发者的“数字外骨骼”
ClaudeCode让AI编程进入"自动驾驶"时代：1）从建议者变为执行者，自动完成从代码修改到测试的全流程；2）通过LSP协议实现全项目代码感知；3）支持多子代理并行处理复杂任务；4）具备规划模式避免盲目修改；5）深度集成终端工具链。这种闭环式开发体验让开发者从执行者转变为任务调度者，显著提升效率，使用后难以回归传统AI编程工具。
2026-03-03 14:18:06
424
原创 Vibe Coding 幸存者指南：从“盲目对话”到“意图掌控”
很多人以为 Vibe Coding 就是给 AI 发个指令然后躺平。错！真实的反馈告诉我们：Vibe Coding 是指挥官艺术。AI 是那个力大无穷但没脑子的铁憨憨，你则是那个指哪打哪的导航员。以下是我们在无数次项目崩溃和深夜调优中总结出的7 条铁律。Vibe Coding 不是让编程消失了，而是让编程变得更有趣了。它把我们从繁琐的括号和分号中解放出来，让我们去思考我要做一个什么样的东西。AI 是你的笔，你才是那个写诗的人。
2026-02-28 22:41:58
537
原创 别再各写各的了！聊聊跨端项目里“逻辑共享”的正确姿势
本文提出一种"逻辑上提，UI下沉"的跨端开发架构方案，核心思路是将业务逻辑与UI展示分离。建议将接口请求、数据格式化等核心逻辑抽离为共享层，各端只需实现视图层。通过"翻译官模式"解决环境差异，定义统一接口适配不同端API。同时将安全链路、容错机制内置在共享层，实现请求签名、断网重试等功能的自动处理。推荐采用配置驱动方式实现动态页面，通过JSON配置自动生成多端UI，真正实现"一次开发，多端复用"。该方案能有效减少重复开发，确保多端一致性。
2026-02-24 15:11:52
58
原创 别再做 Demo 了！手把手带你撸一个生产级的多人协同编辑器（Next.js + Tiptap + Yjs）
本文分享了基于Next.js+Tiptap+Yjs构建实时协同编辑器的实战经验。通过Monorepo架构整合前后端，利用Tiptap实现富文本编辑功能，Yjs处理CRDT协同算法，Next.js提供全栈支持。文章重点解析了WebSocket通信、状态管理、图片缩放优化等核心实现，并针对在线用户统计、代码高亮CSS隔离等常见坑点提出解决方案。该方案支持多人实时协作，经压测验证性能稳定，为开发类Notion编辑器提供了可复用的工程实践。
2026-02-18 21:05:42
383
1
原创 别再被 localStorage 坑了！企业级前端如何搞定“离线保存”这块硬骨头
文章摘要：本文探讨了企业级系统中表单数据丢失问题的解决方案。针对传统localStorage存储的缺陷（容量小、同步阻塞、多标签冲突），提出了一套"两阶段暂存机制"：1）使用IndexedDB异步存储大容量数据；2）结合BroadcastChannel实现多标签页同步。该方案实现了断网自动暂存、无感性能优化和重启后自动同步等功能，显著提升了用户体验和系统可靠性。作者强调，将本地存储作为缓存层、网络请求作为最终同步动作的设计思路，是构建工业级前端应用的关键。
2026-02-15 11:02:58
407
原创 符合 Promises/A+ 规范的完整版 MyPromise 深度拆解
本文详细讲解了如何从零实现一个符合规范的Promise类。首先构建核心状态机，处理pending/fulfilled/rejected三种状态转换；然后实现链式调用的then方法，使用queueMicrotask模拟微任务调度；接着设计resolvePromise处理各种返回值类型；最后补充catch、finally等实例方法和all、race等静态方法。通过这个实现过程，开发者可以深入理解Promise的异步机制、微任务调度、值穿透等核心原理，为处理复杂异步场景打下坚实基础。
2026-02-13 12:27:39
288
原创 别再“写”代码了：2026 年 Vibe Coding 实战全指南
摘要：2026年兴起的VibeCoding标志着编程范式从语法编写转向意图管理。开发者通过自然语言描述需求并提供约束规则，由AI代理完成具体实现。该模式消除了技术栈切换障碍，保持开发心流，但也面临上下文偏移、代码冗余等问题。实践中需搭配.rules约束文件规范AI行为，采用多模型协同审计，并通过"计划模式+微提交"确保质量。未来开发者核心竞争力将转向需求拆解、方案判断和规则制定能力，从"打字员"转变为"架构师"。
2026-02-10 17:12:45
5039
原创 企业级 Flask JWT 登录实践：Access Token 与 Refresh Token 的使用
本文介绍了企业级系统中使用JWT实现安全登录鉴权的实践方案。重点阐述了AccessToken和RefreshToken的核心概念与典型流程：AccessToken用于短期业务接口访问(15-30分钟)，RefreshToken用于长期刷新(7-30天)。通过Flask代码示例展示了登录接口和Token刷新接口的实现方法，并提出了企业级优化建议，包括Token存储策略、安全防护措施等。该方案通过双Token机制平衡了系统安全性和用户体验，实现了可控的访问授权管理。
2026-02-10 00:09:08
400
原创 Docker 全栈进阶指南：从“背后的原理”到“企业级硬核实战”
Docker作为革命性的容器技术，通过镜像封装解决了环境一致性问题，实现"一次构建，到处运行"。其核心概念包括镜像（静态模板）、容器（运行实例）、仓库（镜像存储）和Dockerfile（构建指令）。Docker提供了环境隔离、资源限制和安全加固等企业级功能，并通过多阶段构建优化镜像体积。配合Docker Compose可实现微服务编排，同时需注意敏感信息处理、时区配置等生产环境问题。掌握Docker是从单机部署迈向云原生（如Kubernetes）的重要基础。
2026-02-07 23:08:41
648
原创 前端性能优化：从原理到落地的深度实践指南
前端性能优化系统工程 前端性能优化是一个涉及网络层、渲染层和逻辑层的系统工程。网络层优化包括采用HTTP/3协议、Brotli压缩和智能CDN应用；渲染层关注核心Web指标治理，如优化LCP、降低INP和控制布局偏移；逻辑层则着重代码执行效率，通过异步调度、减少重排重绘来提升性能。文章还展示了基于MessageChannel的长任务优化方案，并展望了Server Components、WebAssembly等未来趋势。性能优化的核心是"先测量，再优化，最后验证"的闭环过程。
2026-02-04 13:55:29
580
原创 拒绝 If-Else 堆砌：复杂分账业务下的 Python 工业级接口设计
写业务代码最忌讳“面向过程”。如果你发现你的if-else该抽象了。这套方案已经在我们的生产环境平稳运行了很久。虽然前期多写了几个类，但在面对后期需求变动（比如新增分账方、修改费率逻辑）时，那种“只改一个配置文件”的优雅，才是开发者真正的尊严。
2026-02-01 22:23:21
309
原创 Python 开发规范实践：从“野路子”到“正力军”的进化之路
本文探讨了规范化开发的重要性，通过Flask项目实例展示了如何实施代码规范。文章指出，规范能提升代码可维护性（清晰命名）、可扩展性（分层架构）和质量（静态检查+单元测试）。实战部分演示了标准化目录结构、自动化质量检查工具（Black/Flake8/Mypy/Pytest）和CI/CD流程。建议分三阶段引入规范：从基础格式化到类型提示，最终建立完整质量体系。规范虽增加初期成本，但能显著降低长期维护风险，适用于各类规模项目。
2026-01-28 23:07:12
523
原创 重新认识 RAG：从原理到生产级架构实现
RAG（检索增强生成）系统的工作流程包括索引、检索和生成三个阶段：索引阶段将非结构化数据分块并向量化存储；检索阶段将用户问题转化为向量匹配相关知识块；生成阶段结合检索结果生成回答。文章详细解释了分块和向量化的必要性，并提供了基于LangChain框架的RAG系统实现代码，涵盖文档加载、分块处理、向量存储到问答链构建的全流程。最后提出多级索引、查询重写和自我纠错等进阶优化方向，强调数据质量和检索算法调优是提升RAG性能的关键。
2026-01-21 10:55:16
327
原创 为什么企业级 AI Agent 必须像“状态机”一样思考？
构建企业级 Python Agent 的过程，本质上是在做**“不确定性管理”**。解决逻辑的可预测性。解决数据的一致性。解决业务的连续性。在 AI 时代，Python 开发者不仅要会写 Prompt，更要学会如何用严谨的异步逻辑、状态管理和类型校验，为 AI 的“发散思维”修筑一条坚固的代码河床。
2026-01-19 16:45:38
429
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人