阿珊和她的猫-CSDN博客

原创 2025，我的人生双系统：工作以 Deep Focus 攻坚，生活以 Recharge Time 续航

2025年复盘：在烟火与诗意间舒展生长✨ 这一年以温泉疗愈开启，在潮汕年味与广府节奏间自如切换。健身轨迹贯穿始终（瑜伽/普拉提/拳击/游泳），身体与心灵同步升级。用livehouse音乐、IMAX电影和密室探险滋养灵魂，以簪花、卡丁车等新体验拓展边界。在代码与UI设计之外，更珍视茶艺馆静坐、艾灸调理等慢时光。从带娃吃酒楼到独自K歌，从禅柔课到九价疫苗，每个具体而微的日常都成为生命经纬。2025，没有宏大叙事，只有认真泡汤、举铁、吃烧烤的每一刻，在热气腾腾的生活里长成更丰盈的自己。🌿

2025-12-30 06:30:00 1826 1

原创 AIGC 与 Agentic AI：生成式智能与代理式智能的技术分野与协同演进

AIGC与Agentic AI并非对立的技术路线，而是人工智能向“内容”与“行动”两个维度的延伸。前者构建数字世界的“素材库”后者搭建自动化的“执行引擎”两者共同推动AI从“工具”向“伙伴”的角色转变。随着技术的成熟，未来的智能系统将呈现“感知-生成-决策-执行”的全链条融合，而人类将更多聚焦于创造性思考与战略决策，在人与AI的协作中开启新的生产力革命。

2025-03-30 17:01:26 1270 1

原创 DeepSeek R1与V3：混合架构下的推理革命与效率破局

DeepSeek R1与V3的组合，标志着大模型从**“参数竞赛"转向"能力深耕”**的新阶段。当V3的高效架构遇见R1的推理革命，AI正在从"概率匹配机器"进化为"逻辑引擎"。随着开源生态的完善和硬件适配的深入，这场由DeepSeek开启的推理革命，或将重新定义AI在科研、开发、决策等领域的价值创造方式。

2025-03-28 00:08:27 1424 1

原创 Manus：通用智能体的架构革命与产业破局

Manus的意义远超一款产品的诞生，它标志着AI从"辅助工具"向"数字劳动力"的跃迁。当多智能体架构能驾驭复杂任务流程，当工具链整合形成行业专属解决方案，人工智能正在重塑人类的生产方式。正如其名字所喻，这场革命不仅需要"脑力"的突破，更依赖"手力"的深耕——在算法与工程的共振中，一个由智能体驱动的新时代正在到来。

2025-03-28 00:06:02 1587 1

原创 OWL与技术文档工程：语义时代的知识结构化革命

当OWL从实验室走向工程实践，其意义早已超越技术本身——它标志着人类知识管理从信息罗列迈向智慧互联。正如万维网之父蒂姆·伯纳斯-李所言：“语义网的终极目标，是让机器像人类一样理解世界。”而OWL，正是这场革命中不可或缺的数字基因。在技术文档领域，它正在书写的，不仅是更清晰的说明书，更是一个能自我进化的智能知识体。

2025-03-28 00:02:14 1164 1

原创 Claude 3.7：混合推理架构如何重塑AI编程范式

Claude 3.7的意义远超模型迭代本身，它标志着AI从“工具”向“协作者”的进化。当混合推理架构能同时驾驭快速响应与深度思考，当代码生成工具能理解业务逻辑的前世今生，软件开发正从“人力密集型”转向“智力密集型”。随着Gartner预测2026年75%企业将采用AI开发范式，Claude 3.7不仅是一个技术里程碑，更是开启智能开发时代的钥匙。

2025-03-28 00:00:30 1390 1

原创 MCP：一种用于将大型语言模型（LLM）与外部工具和数据源集成的开放协议

Figma-MCP 是连接设计与 AI 的桥梁，通过标准化协议实现设计流程的智能化。虽然目前仍有局限，但其在自动化、一致性和协作效率方面的潜力已逐步显现。随着 AI 技术的发展，MCP 有望成为设计团队不可或缺的工具。

2025-03-27 23:53:51 1609

原创 2024：在生活与 CSDN 中探寻成长密码

🤍前端开发工程师、技术日更博主、已过CET6🍨、23年度博客之星前端领域TOP1🕠高级专题作者、打造专栏🍚签约作者、上架课程。

2025-01-20 08:00:00 4088

原创腾讯云AI代码助手评测：智能编程新时代，你准备好了吗？

在本次开发案例中，我使用的是Windows 10操作系统，开发IDE为，编程语言为JavaScript，前端框架为Vue.js。腾讯云AI代码助手是基于混元代码大模型的辅助编码工具技术对话代码补全代码诊断代码优化它不仅支持100多种编程语言，还兼容和JetBrains等系列的主流IDE，为前端开发者提供全方位的支持，为开发之旅保驾护航。为了测试腾讯云AI代码助手，我们可以在中安装相应的插件。1️⃣打开，点击左侧的扩展图标2️⃣在搜索框中输入“” 或者 “腾讯云AI代码助手。

2024-08-01 08:00:00 2320 2

原创【前后端实战项目】带你从入门到实战全面掌握 uni-app

uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架，具备"编写一次代码可发布到多个平台"的特点，大大的节省了开发成本，极速提升了开发效率。

2022-03-23 22:09:46 5165 4

原创【前后端实战项目】Vue.js 和 Egg.js 开发企业级健康管理项目

选择 vue-cli3 ，是为了让开发者能够开箱即用快速地进行应用开发而开发的，它们秉承的是思想，简单说就是能不配置的就不配置，你就按照我的方式来，也不要去争论这个好不好，快速进行业务开发才是正经事。它们不建议你去配置，但也不会拦着你去配置。

2020-10-16 15:05:44 3221 17

原创深入理解 Vuex 中的this.$store.dispatch方法

🤍 前端开发工程师（主业）、技术博主（副业）、已过CET6🍨🕠 牛客高级专题作者、在牛客打造高质量专栏🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程。

2020-04-24 22:22:29 106800 6

原创面试官：请你说一说vuex的五个属性，分别是什么，区别和用途说一下

今天面试的时候，有被问到vuex的五个属性，分别是什么，区别和用途说一下这个地方回答的不是很好，思路有点混乱所以就打算整理一下查了一下官网，关于vuex的五个属性还是有很多知识点的官网：https://vuex.vuejs.org/zh/guide/01 前言当我们用 Vue.js 开发一个中到大型的单页应用时，经常会遇到如下问题：如何让多个 Vue 组件共享状态？？V...

2020-04-08 22:14:50 17013 13

原创 React 路由：构建单页面应用的导航系统

本文介绍了React路由的核心概念与实现方式。作为SPA开发的关键工具，React路由通过URL变化控制组件切换，无需页面重载。主要内容包括：1）路由基础概念如Route、Router、Link和Params；2）使用react-router-dom库的安装与配置方法；3）路由参数传递和嵌套路由的实现技巧。文章提供了完整的代码示例，涵盖路由配置、参数处理和子路由定义，帮助开发者掌握React应用的高效导航方案。

2026-01-26 05:30:00 18

原创简述 React 的性能优化

摘要 React性能优化是构建高效Web应用的关键。本文介绍了React的核心优化机制，包括虚拟DOM和Diffing算法的高效实现，通过组件拆分、React.memo和shouldComponentUpdate减少不必要的渲染。同时探讨了代码分割与懒加载技术优化初始加载速度，以及状态管理和CSS优化的实用技巧。这些策略共同帮助开发者提升React应用的响应速度和用户体验。

2026-01-25 06:00:00 375

原创简述 React 的错误处理

摘要 React错误处理机制是保证应用稳定性的关键。本文介绍了传统try-catch方式处理同步错误和事件错误，重点讲解了React 16引入的错误边界(Error Boundaries)技术，通过类组件的componentDidCatch和getDerivedStateFromError方法捕获子组件错误并展示备用UI。同时针对异步场景，详细说明了Promise的.catch处理和async/await的try-catch方案。这些方法共同构成了React应用的完整错误处理体系，能有效预防应用崩溃，提升用

2026-01-25 05:30:00 818

原创 React 组件通信：构建高效协作的组件生态

本文全面介绍了React组件通信的多种方式，包括props、事件回调、Context API、Redux和自定义Hooks。通过代码示例详细展示了父子组件间的数据传递、跨层级组件通信以及全局状态管理的实现方法。文章对比了不同方案的适用场景，帮助开发者根据项目需求选择最合适的通信方式。这些技术涵盖了从简单数据共享到复杂状态管理的各种场景，为构建高效、可维护的React应用提供了实用指南。

2026-01-24 06:00:00 527

原创 React 生命周期详解：从挂载到卸载

React 组件的生命周期分为挂载、更新和卸载三个阶段。挂载阶段包括 constructor、getDerivedStateFromProps、render 和 componentDidMount 方法，用于初始化状态和DOM操作。更新阶段涉及 getDerivedStateFromProps、shouldComponentUpdate、render、getSnapshotBeforeUpdate 和 componentDidUpdate 方法，用于处理状态变化和优化性能。卸载阶段通过 componentW

2026-01-24 05:30:00 1047

原创简述 React 的虚拟 DOM 机制

React 虚拟 DOM 机制解析：性能优化与实现原理摘要：本文深入解析 React 虚拟 DOM 的工作原理及其性能优势。虚拟 DOM 作为轻量级 JavaScript 对象，通过 diffing 算法比较新旧 DOM 差异并批量更新真实 DOM，有效减少重绘回流。文章从基本概念、工作流程（生成→比较→更新）展开，分析了虚拟 DOM 在性能优化、跨平台兼容性和可测试性方面的优势，同时指出其内存占用和首次渲染性能的局限。通过理解这一机制，开发者能更好地运用 React 构建高效应用。

2026-01-23 06:00:00 684

原创解析 React 的单向数据流原则

本文深入解析了React框架的核心特性——单向数据流原则。文章首先阐述了该原则的内涵，包括数据的单一来源和单向流动特性，通过代码示例展示了父组件通过props传递数据、子组件通过回调函数触发更新的典型模式。然后分析了单向数据流的三大优势：增强应用可预测性、提高代码可维护性以及优化渲染性能。在实现方式部分，详细说明了如何利用React的状态管理和属性传递机制，以及回调函数的应用模式。最后探讨了该原则在大型应用开发中的实践价值，并提及了与Redux等状态管理库的结合使用。全文系统性地介绍了单向数据流原则的理论基

2026-01-23 05:30:00 1181

原创 React 单元测试框架选型与应用

摘要本文对比分析了三种主流React单元测试框架：Jest、Mocha和Jasmine。Jest以其零配置、快照测试和并行执行优势成为React官方推荐方案；Mocha凭借高度灵活性支持自定义断言库组合；Jasmine则提供开箱即用的一体化解决方案。通过实际代码示例展示了各框架的测试语法特点，建议开发者根据项目规模（Jest适合大中型项目）、定制需求（Mocha支持深度定制）和易用性（Jasmine适合小型项目）进行选择，强调单元测试对保障React应用质量的重要性。

2026-01-22 06:00:00 1245

原创聚焦关键：解析单元测试的重点

摘要单元测试是保障代码质量的重要手段，其核心在于明确测试重点。本文从测试目标、范围、方法、断言设计及测试管理五个维度系统阐述了单元测试的关键要素：1.验证功能正确性，包括边界条件与异常处理；2.聚焦独立代码单元，避免过度测试；3.结合白盒与黑盒测试方法；4.编写精确多样的断言语句；5.确保测试独立性和可维护性。通过结构化方法论指导开发者构建高效测试体系，最终提升软件可靠性与开发效率。

2026-01-22 05:30:00 1470

原创 React 中的状态管理：方法与最佳实践

本文介绍了React中常见的状态管理方法及其适用场景。首先概述了本地状态、全局状态和异步状态的概念，然后详细讲解了useState和useReducer这两种本地状态管理工具的使用方法和特点。对于全局状态管理，重点介绍了Context API和Redux：Context API适合简单的全局状态传递，而Redux则提供了更强大的可预测状态管理能力，通过Store、Actions和Reducers实现集中式状态管理。文章为开发者选择合适的状态管理方案提供了清晰指导，帮助应对不同复杂度的应用开发需求。

2026-01-21 06:00:00 743

原创 React 中跨组件数据共享的多种方式

React跨组件数据共享方法总结本文介绍了React中实现跨组件数据共享的多种方式： props传递：适用于父子组件间的简单数据传递，父组件通过props传数据给子组件，子组件通过回调函数传数据给父组件。 Context API：React内置的全局状态管理工具，适合跨层级组件共享数据，避免props层层传递的问题。通过Provider提供数据，useContext获取数据。 Redux：独立的状态管理库，适合复杂应用的全局状态管理。通过定义actions和reducers来管理状态变更，使用Provid

2026-01-21 05:30:00 569

原创深入理解 Redux：状态管理的核心框架

Redux是一个基于Flux架构的JavaScript状态管理库，通过单一不可变的状态树（Store）实现可预测的状态管理。其核心包括：Store存储状态，Actions描述状态变更，Reducers处理状态更新，Middleware扩展功能（如异步操作）。Redux适用于复杂前端应用，与React结合使用时需安装react-redux库。最佳实践包括合理拆分Reducer、使用中间件处理副作用、避免直接修改状态等。Redux的严格数据流机制虽增加一定复杂性，但为大型应用提供了可靠的状态管理方案。

2026-01-20 06:00:00 1341

原创 Redux Thunk：解锁 Redux 异步操作的钥匙

摘要： Redux Thunk 是 Redux 的中间件，用于处理异步操作。它允许 action creator 返回函数（thunk）而非直接返回 action，通过接收 dispatch 和 getState 参数实现异步逻辑。安装后需配置到 Redux Store 中，通过定义 thunk action creator（如封装 API 请求）管理异步流程。最佳实践包括保持 thunk 简洁、使用 Promise/async-await、结合 Redux DevTools 调试及合理拆分 action。

2026-01-20 05:30:00 1335

原创深入探究 React 中 setState 的同步与异步特性

摘要： React 中的 setState 方法更新状态时，默认表现为异步执行，这是 React 的批量更新和事务机制优化性能的结果。但在原生事件、setTimeout 等场景下会同步执行。开发者需注意：避免依赖更新前的状态（推荐使用函数形式 setState），合理利用回调函数确保状态更新后的操作。理解其同步/异步特性对避免 Bug 和性能优化至关重要。

2026-01-19 06:00:00 748

原创为何 React 的 useState 使用数组而非对象

React Hooks 中的 useState 采用数组而非对象形式返回状态值和更新函数，主要基于以下几点考量：首先，数组解构赋值使代码更简洁直观，便于快速提取状态和更新方法；其次，数组索引访问比对象属性查找性能更优，减少内存占用；再者，数组形式支持灵活重命名和多个状态管理，提升开发体验；最后，这种设计保持了与其他Hooks的一致性，便于组合使用。这种设计选择充分体现了React团队对开发者体验和性能优化的双重考量。

2026-01-19 05:30:00 1406

原创深入解析 React 事件系统的实现原理

React 事件系统通过合成事件（SyntheticEvent）和事件委托机制，实现了高效、跨浏览器兼容的事件处理。合成事件封装原生 DOM 事件，提供标准化接口；事件委托将监听器绑定到根节点，减少内存消耗；事件池复用事件对象，优化性能。开发者应使用箭头函数绑定事件处理器，避免事件对象被回收时访问失效，并通过 event.persist() 保留异步操作中的事件对象。理解这些机制有助于编写更高效的 React 应用。

2026-01-18 06:30:00 1173

原创 React 事件与普通 HTML 事件的区别

本文对比了React事件与普通HTML事件的主要区别。React采用驼峰命名法（如onClick），通过JSX绑定事件处理器，使用合成事件对象（SyntheticEvent）实现跨浏览器兼容性，并通过事件委托机制优化性能。与HTML事件不同，React事件默认支持冒泡但不支持捕获，且处理器的this指向组件实例。最佳实践包括使用箭头函数避免this问题、避免内联函数、通过ref访问DOM元素、处理事件冒泡以及组件卸载时清理事件监听器。这些特性使React事件系统更高效且易于维护。

2026-01-18 05:30:00 1143

原创 React 中 CSS 书写方式全解析

本文总结了React项目中常见的四种CSS书写方式：内联样式、外部CSS文件、CSS模块和Styled Components。内联样式适合动态样式调整但复用性差；外部CSS文件便于复用但易冲突；CSS模块通过局部作用域避免冲突；Styled Components实现样式与组件紧密结合。开发者应根据项目需求选择合适的方式，如小型项目可用内联样式，大型项目推荐CSS模块或Styled Components来提升可维护性。

2026-01-17 06:30:00 1147

原创 React 中实现 CSS 组件隔离以避免全局污染

摘要本文探讨了React项目中实现CSS组件隔离的四种主流方法：CSS模块、Styled Components、Emotion和Shadow DOM。CSS模块通过类名哈希实现局部作用域，适合中小型项目；Styled Components和Emotion采用CSS-in-JS方案，支持动态样式但增加JS复杂度；Shadow DOM提供最彻底的隔离，但开发成本较高。各种方案各有优劣，开发者应根据项目规模、性能需求和技术栈选择适合的样式隔离方案，以提升代码可维护性和扩展性。

2026-01-17 05:30:00 577

原创深入解析 React Hooks 中的 `useReducer` 原理

useReducer 是 React Hooks 中用于管理复杂状态逻辑的核心 API。它通过将状态更新逻辑集中在 reducer 函数中，提供了一种比 useState 更结构化的状态管理方式。其核心原理是基于纯函数的 reducer 和 dispatch 机制，内部通过 Fiber 架构维护状态队列，确保状态更新的顺序性和一致性。useReducer 支持惰性初始化状态，允许多个 reducer 共存，并能通过 dispatch 触发状态更新。理解其实现原理有助于开发者更好地运用这一工具，构建更可维护的

2026-01-16 06:30:00 1248

原创深入解析 React Hooks 中的 `useContext` 原理

React useContext 实现原理解析 React 的 useContext Hook 提供了一种高效的跨组件数据共享机制。其核心原理基于 React 的上下文系统，通过创建 Context 对象并利用 Provider/Consumer 模式实现数据传递。useContext 内部通过 Fiber 架构维护依赖关系，当组件调用该 Hook 时会注册到上下文的依赖列表，并在值变化时触发重新渲染。该机制支持嵌套上下文、默认值设置和性能优化，建议合理拆分上下文数据、避免直接修改值并设置默认值以获得最佳实

2026-01-16 05:30:00 1361

原创深入解析 React Hooks 中 useRef 的原理

本文深入解析了 React 中的 useRef Hook，从基础用法到实现原理全面剖析。作为 React Hooks 的重要成员，useRef 通过 Fiber 架构实现数据持久化，其引用对象在组件生命周期内保持不变，可用于保存可变数据和操作 DOM 元素。文章详细介绍了 useRef 在定时器管理、计算结果缓存等场景的应用，并强调了避免滥用和内存泄漏的注意事项。通过理解 useRef 的工作原理，开发者能更高效地处理 React 中的特殊需求场景，提升应用性能与代码质量。

2026-01-15 06:00:00 798

原创深入理解 React Hooks 中 useMemo 的原理

本文深入探讨了React中的useMemo Hook，分析了其工作原理和性能优化机制。文章首先介绍了useMemo的基本概念和典型使用场景，通过计算数组求和的示例展示了其避免重复计算的能力。随后详细剖析了useMemo的实现原理，包括React渲染机制、依赖项跟踪系统以及记忆化计算过程。文中还列举了useMemo的主要应用场景，如处理复杂计算和优化子组件渲染，并强调了合理使用的重要性，包括避免过度使用和确保依赖项准确性。最后指出useMemo是提升React应用性能的有效工具，但需要根据实际需求谨慎使用。

2026-01-15 05:30:00 637

原创深入解析 React Hooks 中的 `useState` 原理

本文深入解析React Hooks中的useState实现原理。文章首先介绍其基本用法，然后从闭包机制、Fiber节点存储、状态更新流程等方面剖析底层实现，并通过简化代码模拟核心逻辑。同时探讨了函数式更新和惰性初始化等高级特性，最后给出避免直接修改状态、合理使用函数式更新等最佳实践建议。全文旨在帮助开发者深入理解useState工作机制，从而更高效地使用React Hooks进行开发。

2026-01-14 06:00:00 681

原创深入解析 React Hooks 中的 `useEffect` 原理

本文深入解析了React Hooks中useEffect的实现原理与最佳实践。首先介绍了其基本用法：接收副作用函数和依赖数组，在组件渲染后执行。然后剖析了内部机制，包括副作用队列存储、依赖数组的浅比较、清理函数执行顺序等核心概念，并提供了简化版实现代码。文章还探讨了高级特性如异步副作用处理和多副作用管理，并给出四条关键实践建议：合理设置依赖项、避免嵌套副作用、善用清理函数和防止过度使用。通过理解这些原理和技巧，开发者能更高效地利用useEffect处理组件副作用，提升代码质量。

2026-01-14 05:30:00 878

原创 React Hooks 在函数组件内部函数中的调用分析

摘要： React Hooks 只能在函数组件的顶层调用，禁止在循环、条件或嵌套函数中使用，以确保调用顺序一致。在内部函数中直接调用 Hooks 会破坏状态管理，导致性能问题和调试困难。解决方案包括：1）将逻辑封装为自定义 Hooks（以 use 开头）；2）通过参数传递状态及更新函数。遵循这些规则能避免状态混乱，保障应用稳定性。例如，自定义 Hook useCounter 可安全地在组件内部调用，而直接嵌套 useState 则会触发错误。正确使用 Hooks 是高效开发 React 应用的关键。（字数

2026-01-13 06:00:00 616

原创为何 React Hooks 只能在函数组件或自定义 Hook 顶部调用

本文深入解析了React Hooks必须在函数组件或自定义Hook顶部调用的原因。Hooks通过链表结构存储状态，依赖稳定的调用顺序来准确匹配和更新状态。在循环或条件语句中使用Hooks会导致顺序混乱，引发状态错乱。顶部调用保证了顺序一致性，便于React进行静态分析和性能优化。同时，这一规则确保了自定义Hook的复用性及与React生态的兼容性。开发者必须遵守该规则，才能正确利用Hooks的强大功能，避免状态管理问题。

2026-01-13 05:30:00 671

一个月学会JavaScript.pdf

空空如也