写作
写作
关于 software、AI、systems、learning 与 inner practice 的文章和笔记。
工程
工程
Workspace V2 Tab System 性能优化：让热切换、冷启动和后台任务各走各的路
背景和目标Tab system 引入后，工作台不再只有一个前台页面。用户可以同时打开多个 workstream、子应用和对象页，系统背后也会同时存在更多 route、runtime、iframe、SDK 和后台任务。性能问题因此不再是“某个页面慢”，而是三条用户路径分别要守住。 图 0：一个通用工作台里的 tab system...
Workspace V2 Tab System：把浏览器标签页带进工作空间
TL;DR：Workspace v2 需要在单页工作空间里做出接近浏览器的 tab 体验：多个业务对象同时保持打开，刷新和分享链接仍然能回到正确页面，hidden runtime 不能抢当前 tab 的 URL、弹层、事件和前台 CPU。它不是一排 tab UI，而是一套围绕 intent、URL、持久化 tab 状态、runtime...
使用 Error Boundary 构建容错 React 应用（Error Boundary 最佳实践）
本文将展示如何利用 error boundary 的最佳实践来构建一个健壮且容错的 React 应用，包括：何时使用 Error Boundary、构建带有错误处理和错误上报功能的 Error Boundary HOC。...
React 运行时性能优化
优化 React 应用的性能，主要有两个方向： 渲染（Rendering）：渲染过程是 React 应用中开销最大的部分之一（包含 Diff 计算）。 计算（Calculation）：受限于浏览器的有限资源，浏览器并不适合执行重计算任务。 渲染React.memo当一个组件重新渲染时，无论父组件传给子组件的 props...
React 服务器组件内部原理（源码解析）
什么是 React 服务器组件（RSC）？React 服务器组件是 React 的一项新特性，它允许服务端与客户端（浏览器）协同渲染 React 应用。简而言之，它将部分渲染工作移交给服务端，以提升整体性能。 React 元素树的典型构建流程为了更好地理解为什么需要将渲染工作移到服务端，让我们先看看客户端渲染是如何构建 React 元素树（JSX）的：...
通过实现一个简易版 useState 来学习 React Hooks 的工作原理
一道面试题你在面试中有没有被问到过这样的问题？ 为什么 React Hook 不能写在条件语句或循环语句中？ （这是一道典型的中国风面试题，我们称之为”八股文”——这类问题太过经典，大家背下来就能答出来。） 在这篇文章中，我们将深入了解其背后的软件工程原理。学完这些原理后，你将很容易理解其他状态管理工具（如 Redux、Jotai）的工作方式。 Hook...
AI 与 Agent
AI 与 Agent
全自动 AI 性能优化：Harness、Goal-Driven Loop 与 Skill 设计
TL;DR: 我做了一个性能优化 skill，让 AI Agent 执行真正的优化闭环，而不是只给出“可以试试懒加载”这类建议。核心是可度量的 harness、goal-driven loop，以及记录每个 baseline、修改点、严格对比和失败 round 的 ledger。在一次 Workspace 优化中，严格 profile 看到...
Agent Skills 探索实录 — AI Agent 时代的函数式蓝图
TL;DR: Skill 就是跑在大模型上的函数——封装固定流程、定义输入输出、支持跨 Agent 复用。本文从第一性原理出发，拆解 Skill 的本质、设计原则和工程实践，帮你把零散的 Prompt 经验沉淀为可复用的能力单元。 背景 Agentic AI 领域概念层出不穷，而 Skills 是近几个月讨论最多、我认为也最重要的一个。本文记录了我探索...
Vibe Coding vs Spec-Driven Coding — AI Coding 的演化之路
TL;DR: Vibe Coding（氛围编码）让 AI 自由发挥，速度快但不可控；Spec-Driven Coding 通过持久化的规范文件约束 AI 行为，实现可预测、可追溯的输出。本文用 OpenSpec + Claude Code 的实践经验，拆解两种模式的差异和适用场景。 背景与目标 我目前主要用 Claude Code...
从第一性原理理解 SEO —— 一次博客全面改造的深度复盘
大多数 SEO 指南都是清单式的：加这个 meta 标签、装那个插件、改这个配置。但清单无法帮你理解 为什么 ——不理解为什么，你永远不知道自己遗漏了什么。 最近我对这个博客做了一次全面的 SEO 改造。比起逐条记录”发现了什么、修了什么”，我更想分享的是背后的思维模型。一旦用这个视角看 SEO，所有优化都变得显而易见。...
从零到一打造基于 GPT 的客服聊天机器人 — 算法篇
摘要本文介绍如何运用 OpenAI 的多种技术，打造一个能够回答用户问题并与其进行交互的智能 GPT 客服聊天机器人。 我们主要使用的技术包括： Embeddings（嵌入）：该技术将我们的知识库（如 FAQ 和产品设计等文档）转化为一组向量，从而可以通过比较文本向量来轻松检索与问题相关的上下文。了解更多关于嵌入的信息，请参阅 OpenAI API。...
使用模块化设计与 ChatGPT 生成代码
你可以在这个 codesandbox 中找到本文的所有代码。 很多人没有意识到，如今 AI 真的可以帮助我们写代码！相信我，我一直在使用 chatGPT 帮助我写了数千行代码。让我来告诉你怎么做。我将以一个前端组件为例，向你展示如何构建一个生产就绪的组件。我们使用 React 来帮助我们模块化代码，这样 chatGPT...
系统与学习
系统与学习
SICPJS 第二章：用数据构建抽象
词汇表问题笔记 复合数据（Compound data）：就像复合函数一样，我们增强了语言的表达能力，并提升了设计程序时所处的概念层次。 将数据粘合在一起（Glue data together）：复合数据将数据粘合在一起，从而降低系统的复杂度。 数据抽象（Data...
SICPJS 第一章：用函数构建抽象
词汇表 计算过程（computational process，巫师脑中的精灵）：一种思想，看不见也摸不到，但能解决问题并驱动现实世界。 程序（program，巫师的咒语）：通过编程语言规定计算过程，操纵另一种抽象事物——数据。 程序员（programmer，巫师的学徒）：构思想法并施展咒语的人。 数据（data）：...
SICPJS——我的思考与学习计划 / 目录
心灵在对简单观念发挥其能力时，主要有以下三种行为： 将几个简单观念组合成一个复合观念，由此构成所有复杂观念。 其次，将两个观念——无论简单还是复杂——并列在一起，同时审视，而不将其合并为一，由此获得所有关系的观念。 第三，将这些观念与现实存在中伴随它们的所有其他观念分离：这被称为抽象，所有一般观念由此而生。
心智与实践
心智与实践
即将补充。
生活
生活
即将补充。
归档