- 博客(413)
- 收藏
- 关注
RSS订阅原创 Agent常见范式
构建 Agent（可与 LangChain.js 无缝搭配），ReAct/Plan&Execute 在 LangChain 里仍可用，但建议在新项目里考虑上图式编排（LangGraph）以获得更强的可控性与状态持久化。把多个 Agent 节点（例如“产品经理👩💼/架构师🧑💻/测试🧪”）连成图，角色消息通过边传递。把“分支推理/回溯”的过程画成状态图节点（分支评估→选择→继续/回溯）。：把企业内 API / RAG / 搜索 / 报表 等封装成 Tool，挂到 Agent 或直接让模型进行。
2025-09-24 16:39:36
893
原创 不写单元测试的程序员，就像光脚跑在野外——迟早要被Bug扎脚！
其实程序员的世界和生活一样，你永远不知道明天和 Bug 哪个先来。单元测试就是你的安全垫它帮你在重构时不至于心惊胆战；它让你敢于对老旧代码动刀子；它能在面试时，让你轻松拿下“你平时写测试吗？”这种问题。别再说“写测试浪费时间”了。你写的是信心，是底气，是长期的效率提升。从今天开始，哪怕只给关键函数写几个简单的测试，你都会发现，自己写代码的心态都不一样了。程序员的幸福生活，从单元测试开始。🎉。
2025-09-24 16:39:06
287
原创 React Native 入门实战：样式、状态管理与网络请求全解析 （二）
样式编写：遵循 React Native 的样式规范，使用提高性能状态管理：使用useState管理组件状态，实现交互功能数据渲染：通过map方法动态渲染列表数据网络请求：使用 Fetch API 与后端接口交互副作用处理：利用useEffect在适当时机执行数据获取React Native 的学习曲线相对平缓，特别是对于有 React 基础的开发者。掌握这些核心概念后，你已经具备了开发基本 React Native 应用的能力。下一步可以探索导航、动画、原生模块等进阶主题。
2025-09-24 16:38:31
268
原创 3 分钟掌握前端 IndexedDB 高效用法，告别本地存储焦虑
IndexedDB 是浏览器提供的客户端数据库，可以存储大量结构化数据，支持事务操作，是 Web 应用离线存储的重要技术。
2025-09-24 16:37:53
351
原创 Web Animation性能优化：从EffectTiming到动画合成
【代码】Web Animation性能优化：从EffectTiming到动画合成。
2025-09-24 16:37:19
352
原创 JS场景应用
将 JavaScript 值转换为 JSON 字符串的内置方法，对象放入一个数组中，然后转换为格式化的 JSON 字符串，最终结果会是一个包含原对象的 JSON 数组字符串。关键字用于实现类的继承，是 ES6（ECMAScript 2015）引入的面向对象编程特性，用于创建一个子类并继承父类的属性和方法。是 JavaScript 中将 JSON 字符串 "还原" 为可操作的数据结构的关键方法，是前后端数据交互和数据存储时的常用工具。2.子类可以在父类基础上添加新的属性和方法，或重写（覆盖）父类的方法。
2025-09-24 16:31:52
724
原创 Canvas 的基本使用及动画效果
的问题是，它们都不精确。它们的内在运行机制决定了时间间隔，参数实际上只是指定了把动画代码添加到浏览器。如果队列前面已经加入了其他任务，那动画代码就要等前面的任务完成后再执行。使用定时器动画干活，实际上是可以的，但是存在一个最大的问题，就是。能够做到，精准严格的卡住显示器刷新的时间，比如普通显示器。只会执行一次，想要使其多次执行，要写成递归的形式。的间隔时间是由浏览器自身决定的，大约是。去做动画，就不会出现抖动的现象。就是解决了定时器不精准的问题的。平移（Translate）旋转（Rotate）
2025-09-24 16:31:22
428
原创 基于 UniApp 的弹出层选择器单选、多选组件，支持单选、多选、搜索、数量输入等功能。专为移动端优化，提供丰富的交互体验。
组件期望的数据格式为对象数组，每个对象至少包含 和 对应的字段：组件通过 事件返回选中的数据，格式如下：返回单个选中的对象，如果未选中则返回空对象：返回选中的对象数组：组件使用 SCSS 编写样式，提供完整的主题色配置：可以通过覆盖这些变量来自定义样式：组件提供了多种智能交互：功能增强技术改进初始版本发布A: 使用 事件监听滚动到底部，在回调中加载更多数据：A: 可以通过覆盖 和 类来自定义：A: 目前支持模
2025-09-24 16:23:49
1197
原创 功能按钮权限控制（使用自定义指令控制权限）
之前做功能权限按钮控制使用v-if进行控制，功能上没有问题，就是传入的参数需要判断代码比较冗余。使用自定义指令，对每一个权限按钮设置权限时比较方便，绑定自定义指令传入权限值就好，但是对于有些组件库元素是无法删除掉的还是要使用v-if，要需要注意避免遗留。总的来讲，自定义指令控制权限还是很方便的，维护起来也能很方便的看见哪个元素绑定了自定义指令代表权限按钮。
2025-09-24 16:23:14
372
原创 解构赋值中的默认值坑点记录
解构赋值的默认值只会在属性值为undefined时生效。如果接口返回null或空字符串，默认值不会触发。业务中常见的兜底需求，应该配合??（nullish 合并运算符）或 ||（逻辑或）来实现。
2025-09-22 21:55:18
183
原创 前端面试：无感刷新Token的深度解析与异常处理
现在想来当时面试官提问的"同时10个异常提示"问题，本质考察的是并发请求的队列管理能力。我的原始理解有误——并发请求不会导致10次独立提示，而是通过统一队列机制合并处理。所有401请求会被收集到同一个刷新流程中，刷新失败后仅触发一次错误提示。
2025-09-22 21:54:34
410
原创 Python小神器：lambda函数，让你的代码瞬间变优雅！
排序是编程常客，但默认排序有时不给力。比如按字符串长度排序，而不是字母顺序。这时，sorted的key参数就派上用场，lambda来定义key。words = ['python', 'is', 'awesome'] sorted_words = sorted(words, key=lambda x: len(x)) print(sorted_words) # 输出：['is', 'python', 'awesome']从短到长，完美！这在处理日志文件或排名榜单时，超级方便。
2025-09-22 21:53:56
811
原创 hooks、mixin、hoc、普通函数封装之间的简单对比
加载用户数据管理加载状态（加载中 / 加载完成 / 加载失败）提供重新加载方法组件卸载时取消未完成的请求我们将用四种不同方案实现相同功能，以便直观对比。
2025-09-22 21:53:36
543
原创 消失的 body | 诡异 BUG 侦查纪实
然而分析结果表明，这些异常的分布非常“均匀”，涵盖了各种主流的浏览器品牌、操作系统，Chrome、Edge、Safari、Yandex 浏览器，Apple、Windows、Android 设备，浏览器版本号也跨度极大。这种调用栈的形式，基本彻底否定了浏览器扩展的可能性，毕竟浏览器扩展也在操作页面 DOM 时，也必须通过注入的代码执行来实现，一定会留下指向特定代码的痕迹，而不会出现源头是 html 文件这种奇怪的记录。而项目依赖，也秉持宁缺毋滥的原则，只挑高质量且必需的库。这与通常的黑灰产特点背道而驰。
2025-09-22 21:51:55
884
原创 React Context真的能替代Redux/Zustand吗？
当成状态管理器，偶尔也能用，但大多数时候，会把事情搞得一塌糊涂，结果不是很理想。的问题，它的目标是让组件树深处的子孙组件，能够轻松地拿到顶层组件的数据，从而。在一个大型应用里，这种不必要的渲染，会迅速累积，最终导致严重的性能问题。能共享数据的特性，就想当然地用它来做所有全局状态管理的工作，尤其是那些。你会发现，控制台里，UserInfo re-rendered!作为web开发者，知道什么时候该用哪个，才是专业的体现。函数，函数地址不变，通常只在初始化时渲染一次）。，到底是为了解决什么问题。
2025-09-22 21:51:11
539
原创 Next.js + AI-SDK + DeepSeek：3 分钟建设属于你的 AI 问答 Demo
用于处理前端发来的消息，实现流式 AI 响应。实现问答 UI，支持流式显示 AI 回复。
2025-09-22 21:50:10
351
原创 【TS 设计模式完全指南】重构利器：用策略模式解耦你 TypeScript 项目中复杂的分支逻辑
策略模式（Strategy Pattern）是一种行为设计模式，它定义了一系列算法，并将每个算法封装起来，使它们可以互相替换。策略模式让算法的变化独立于使用它的客户端。简单来说，就是将不同的处理“策略”（算法）抽象出来，放到各自独立的类中。使用这些策略的“上下文”（Context）对象，可以在运行时根据需要，动态地选择并使用其中任何一个策略。所有验证规则都必须遵循这个接口。
2025-09-22 21:49:27
324
原创 如何完美测试 AI 摘要通过 SSE 输出的打字效果？
前面两篇文章简单介绍了如何只用Nextjs在本地模拟 SSE 实现打字效果和通过Streamdown优雅地解析输出 AI 返回的Markdown文本，接下来就是如何测试了。
2025-09-22 21:48:58
736
原创 基于 SocketIO 消息协议设计报文规范，构建FastAPI上的SocketIO 应用
最近在研究Python下整合FastAPI的Socket.IO 应用，对于其WebSocket的消息报文协议进行了深入了解，并整理了相关的协议内容，整合到FastAPI的WebSocket通讯处理中，用作多端的消息通讯，如聊天，系统信息通知等。例子：系统类消息由系统发送，用于通知客户端或服务端状态变化。聊天类消息由用户发送，用于聊天。房间操作类消息用于创建、加入或离开房间。ACK / 状态反馈消息用于确认客户端或服务端收到消息。命令类消息用于向服务端发送指令。
2025-09-22 21:48:08
928
原创 前端必懂！BFC 的 5 大特性 + 3 种创建方法，Margin 重叠不再愁
想象一下，你正在建造一栋房子，每个房间（元素）都有自己的边界和规则。但有些时候，你可能需要一个特殊的“区域”，在这个区域里，所有的建筑规则都变得不一样，它能独立地管理内部的房间，并且不让内部的房间影响到外面的结构。在CSS的世界里，这个“特殊区域”就是，中文名叫“块级格式化上下文”。简单来说，BFC是一个独立的渲染区域，它规定了内部块级盒子的布局方式，并且这个区域的内部元素不会影响到外部元素，反之亦然。它就像一个“结界”，把内部和外部世界隔离开来。
2025-09-21 21:57:35
876
原创 从“高级”到“资深”，我卡了两年和我的思考
还是你花一半的时间，让团队里其他5个人，每个人都能写出和你一样80%水平的代码，对公司的价值大？那时候我挺自豪的，觉得自己技术不错，能独立负责复杂的业务，也能搞定线上疑难杂症，再往上走，应该也只是时间问题。这篇，就是想复盘一下我卡住的那两年，我是如何迷茫，又是如何最终想明白，从高级到资深（或者叫专家、Staff），真正需要跨越的到底是什么。我的价值，不再是我自己写了多少行牛逼的代码，而是。我的工作重心，需要从关注事，转变为关注人；当我开始做这些转变之后，大概又过了一年，我的晋升，就成了水到渠成的事。
2025-09-21 21:57:11
321
原创 Next.js + AI-SDK + DeepSeek：3 分钟建设属于你的 AI 问答 Demo
三分钟，Next.js + AI-SDK + DeepSeek，自己的 AI 问答 Demo“闪现”上线。愿你在代码的世界里，既能仰望星空，也能脚踏实地，偶尔还能和 AI 一起吐槽生活！
2025-09-21 21:57:00
356
原创 [特殊字符] Web 图片优化实践：通过 AVIF/WebP 将 12MB 图片降至 4MB
是由 Google 推出的一种现代图片格式，提供有损和无损压缩两种模式。相比 PNG，WebP 无损压缩可减少 26% 的文件大小；相比 JPG，WebP 有损压缩可减少 25-34% 的文件大小。Next.js + AI-SDK + DeepSeek：3 分钟建设属于你的 AI 问答 DemoWebP 还支持动画和透明通道，是 GIF 和 PNG 的理想替代方案。目前，WebP 已得到所有现代浏览器的支持（IE 浏览器和部分旧版本移动端浏览器除外）。
2025-09-21 21:55:24
724
原创 【TS 设计模式完全指南】重构利器：用策略模式解耦你 TypeScript 项目中复杂的分支逻辑
策略模式（Strategy Pattern）是一种行为设计模式，它定义了一系列算法，并将每个算法封装起来，使它们可以互相替换。策略模式让算法的变化独立于使用它的客户端。简单来说，就是将不同的处理“策略”（算法）抽象出来，放到各自独立的类中。使用这些策略的“上下文”（Context）对象，可以在运行时根据需要，动态地选择并使用其中任何一个策略。所有验证规则都必须遵循这个接口。
2025-09-21 21:55:01
151
原创 【野蛮成长01】为什么react需要fiber架构，而vue不需要？
答：因为 Vue 的响应式系统在组件级别进行更精确的依赖追踪，无需递归整个组件树来比对变化，而 React 需要 Fiber 来调度和拆分大型虚拟 DOM 树的递归diff任务，以避免阻塞主线程。为啥React 引入 Fiber 架构，但是 Vue 不需要类似架构？
2025-09-21 21:54:01
710
原创 async/await 到底要不要加 try catch？我来给你整明白！
现在写异步代码，基本上就是Promise和两种写法。虽然这俩都能干同样的活，但 async/await 写起来更像同步代码，读起来更顺眼，所以很多人都说它是"异步编程的终极方案"。不过有个问题挺让人纠结的：用 async/await 的时候，到底要不要加 try catch 来抓错误？我看了好多项目代码，发现大家做法都不一样，有的加有的不加，甚至有的连 catch 都不写，这就很迷了。
2025-09-19 16:35:52
321
原创 [特殊字符] 1.30 分！我的 JS 库 Mettle.js 杀入全球性能榜，紧追 Vue
时隔一年，我终于带着新的思考成果回来了。这段时间潜心于寻找前端开发中用户体验与性能的最佳平衡点，取得了突破性进展 —— 全新 JavaScript 库Mettle.js正式亮相！有人或许会问："为什么不在Strve.js上优化，而选择从头开发？" 原因有二：第一，Strve.js的核心定位（名字蕴含的Str）强调了其在 模板字符串中书写类 HTML 的开发模式。我们希望新库能突破这种语法层面的限制，拥抱更广阔的可能性（如 JSX）。
2025-09-19 16:35:21
342
原创 性能提升60%：前端性能优化终极指南
一直是前端绕不开的话题。页面加载慢、交互卡顿，不仅影响用户体验，还可能直接流失用户。本文将从四个环节，系统梳理前端能想到的各种性能优化手段，帮助我们尽可能的提升前端页面性能。
2025-09-19 16:34:42
428
原创 吃透前端项目优化系列（二）：首屏渲染优化 + 性能指标拆解
前端首屏优化的核心逻辑是：页面渲染优化：减少回流重绘，利用 GPU 加速，让渲染过程更 “轻量”；资源加载优化：减小资源体积，优化加载顺序，利用缓存和网络特性，让资源更快 “到达” 浏览器。实际优化中需结合性能监测工具（Lighthouse、WebPageTest）定位瓶颈，优先解决影响最大的问题（如大体积未压缩的图片、阻塞渲染的 JS），再逐步细化细节。核心 Web 指标（LCP、FID/INP、CLS）是用户体验的 “门面”，必须掌握其定义、达标标准和 Vue3 优化手段。
2025-09-19 16:33:52
346
原创 从零到一打造 Vue3 响应式系统 Day 8 - Effect：深入剖析嵌套 effect
今天我们来探讨一个棘手的边界情况：嵌套 effect。当一个effect内部又定义了另一个effect时，我们的系统会如何运作呢？在这种情况下，我们预期内外层都有输出，但是我们得到的结果如下：官方不建议使用嵌套effect，你可能会想：“既然官方不建议，我只要不这么写就好了。但是遇到这种“嵌套执行”的场景比想象中更常见。比方说，当一个effect依赖了一个computed属性时，就会隐式触发嵌套执行：因此，为了处理这种隐式触发的问题，我们就需要解决嵌套effect的触发机制。
2025-09-19 16:33:22
344
原创 作为前端Team Leader，我是如何做技术选型、项目排期和新人培养的？
硬要上React，那我得先掂量掂量，有没有时间搞培训，大家愿不愿意学，项目等不等得起。一个冷门的技术，可能文档都找不到几篇，遇到问题，谷歌都搜不到，那真是叫天天不应。但看的目的不是为了批评他，而是借着他的代码，告诉他我们团队的编码规范是什么样的，为什么要这么写。我刚工作时就遇到过这种，一个人对着一堆过期的文档，两眼一抹黑，连个问题都不知道该问谁，那种无助感现在还记得。以前自己写代码，好坏都是自己的事，代码烂了，加班补上就行。当老板找我谈话，说想让我带前端团队的时候，说实话，我第一反应是“完了”。
2025-09-19 16:32:41
274
原创 如何给Three.js中ExtrudeGeometry的不同面设置不同材质
Three.js有很多基础的几何体，对于一些简单的图形形状，可以不用每次都劳烦建模的同学去提供一个模型，常常这些基础几何体就可以绘制了。ExtrudeGeometry是在开发中非常常用的一种几何体，它非常灵活，可以先用一系列二维顶点绘制一个二维图形，然后沿着一定的方向将这个二维图形拉成一个三维几何体，这在很多场景下非常有用，比如隧道、建筑大楼，都可以用这种方式生成一个简单的示意性的几何体。但是，如果需要给这个几何体设置材质时，又会感觉不够灵活了，要么只能全部表面都用一直材质；
2025-09-18 21:58:47
1105
原创 【js篇】如何准确获取对象自身的属性？hasOwnProperty深度解析
自身属性：直接定义在对象实例上的属性，如；继承属性：通过原型链从父级继承来的属性或方法，如sayHello。方法是否包含原型是否包含不可枚举是否包含 Symbol推荐场景❌ 否❌ 否❌ 否兼容旧环境❌ 否❌ 否❌ 否日常开发，简洁❌ 否✅ 是❌ 否需要不可枚举属性❌ 否✅ 是✅ 是全面获取所有键“遍历对象时，for...in是‘广撒网’，是‘精准捕捞’。掌握如何区分自身属性与继承属性，是写出高质量 JavaScript 代码的基本功。
2025-09-18 21:54:20
439
原创 【js篇】call() 与 apply()深度对比
方法语法说明call()第一个参数指定this，其余参数逐个传入apply()第一个参数指定this，第二个参数是数组或类数组✅共同点立即执行函数；改变this指向；参数都会传递给目标函数。callcall和apply是一对孪生兄弟，选择谁取决于你手里的‘食材’。如果你有独立的参数，用call；如果你有一个数组，用apply或...；在现代开发中，优先使用扩展运算符...来替代apply的常见用法。📌记住掌握它们的区别，能让你写出更优雅、更高效的代码！
2025-09-18 21:49:41
397
原创 AIGC 模型部署到 Web 端的技术选型：TensorFlow.js vs 「PyTorch.js」[特殊字符]️[特殊字符]
如果你前端优先，想快速跑 Demo：直接选，生态和文档不用愁。如果你训练全靠 PyTorch，又懒得切换框架：只能走 “” 的路线，虽然绕，但能保证训练-推理链条一致。如果你在意未来趋势：WebGPU、WebNN 规范逐渐成熟，PyTorch 社区可能会形成更统一的 Web 解决方案，值得观望。：像速溶咖啡，方便，口味稳定。PyTorch.js 路线：像手冲咖啡，步骤繁琐，但风味原始、专业感强。两者都是 “AIGC 上 Web” 的魔法钥匙，只是打开的方式不太一样。
2025-09-18 21:48:42
899
1
原创 javascript基础- 函数中 this 指向、call、apply、bind
本文简单讲解函数中this的指向问题，及涉及主动改变 this 指向的callapplybind三个方法的实现原理。
2025-09-18 21:47:31
324
原创 React Native DApp 开发全栈实战·从 0 到 1 系列（兑换-前端部分）
三步跑通移动端 swap一键启动，私钥导入 MetaMask 即可秒连。合约地址注入：通过拿到三个核心地址，前端直接引用。前端调用：借助 ethers.js 的把 MetaMask 变成签名器，完成合约实例化，完成 swap。关键路径拆解预言机读价 → 预铸流动性 → 用户输入 1 ETH → 合约按价放 BTK → 余额实时回显，整条链路在 10 秒内闭环。下一步优化把换成并加价格过期校验，满足生产级安全。用监听Swap事件，实现“交易成功即弹 Toast + 自动刷新余额”。
2025-09-18 21:46:21
230
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人