- 博客(1145)
- 收藏
- 关注
RSS订阅原创 React 源码解读（二）
本文深入解析React核心机制，重点剖析了三大系统：调度器(Scheduler)、协调器(Reconciler)和渲染器(Renderer)。主要内容包括： 核心对象解析：详细介绍了ReactElement、Fiber、Update等关键数据结构及其作用，阐述了React内部的状态管理机制。 执行流程分析：拆解React的创建和更新两大阶段，详解从容器创建到视图更新的完整链路，包括任务调度、Fiber树构建和提交变更等关键步骤。
2025-11-24 11:52:41
12
原创 React 中什么是可中断更新？
React的可中断渲染通过Fiber架构实现时间分片和优先级调度，能在处理长任务时暂停并优先响应高交互任务（如用户输入），随后恢复原渲染。这种机制提升了应用响应速度，避免因大量渲染导致的卡顿。示例中，当点击事件与耗时组件渲染冲突时，React会优先处理交互再继续渲染，保障流畅体验。该特性显著优化了复杂界面的用户体验。
2025-11-20 15:14:09
233
原创 React中Context 的作用及原理
React Context提供了一种在组件树中传递数据的有效方式，避免了props逐层传递的问题。它包含Provider和Consumer两部分，通过createContext创建上下文对象，Provider提供状态值，Consumer或useContext Hook用于消费这些值。Context特别适合管理用户认证、主题等全局状态，能提高代码可读性和维护性。使用时需注意性能优化，避免高频更新导致的性能问题，并尽量在最小组件树范围内使用Provider。
2025-11-20 14:55:38
417
原创 React 18 源码解读（一）
本文深入解析了React源码架构及核心实现原理。首先介绍了React采用Monorepo架构管理，详细拆解了react(基础包)、react-dom(Web渲染器)、react-reconciler(协调器)、scheduler(调度器)等核心包的职责分工。其次通过Babel示例分析了JSX编译过程，将JSX转换为React.createElement调用。然后重点剖析了React的双阶段工作流程：创建阶段完成容器初始化，更新阶段处理状态变更和视图更新。
2025-11-20 11:19:27
561
原创 React 中的 key的作用是什么 ？
摘要：React中的key属性用于唯一标识组件，帮助提升渲染性能和保持组件状态。在列表渲染中，key能优化Diff算法比较过程，通过react-reconciler/src/ReactChildFiber.new.js中的reconcileChildFibers等方法实现新旧节点匹配。源码通过比较key值决定是否复用组件实例，若key不同则创建新实例。示例展示如何用item.id作为列表项的key，使React能高效处理列表增删改操作，仅更新变化的DOM节点而非整个列表。
2025-11-18 22:55:31
190
原创 源码解析React中的setState到底是同步还是异步？
React18中的setState行为受并发模式影响，分为同步和异步两种情况。批量更新时setState是异步的，React会对事件处理器中的多个状态更新进行合并优化。新增的flushSync方法可强制同步更新。源码层面，setState通过enqueueSetState将更新加入队列，由调度器批量处理，batchedUpdates机制合并更新直到执行环境重置后才会渲染。这些改进提升了性能和响应性，使状态更新更加智能高效。
2025-11-18 14:51:18
385
原创 Vue 3.0 源码解读
摘要：本文深入解析Vue3框架的架构设计与核心实现原理。从工程架构角度详细阐述了compiler-core、compiler-dom、compiler-sfc等编译模块的分工协作，以及reactivity、runtime-core、runtime-dom等运行时模块的响应式原理和DOM操作机制。重点剖析了Vue3的diff算法优化策略，包括最长递增子序列算法在DOM更新中的应用，对比了简单diff、双端diff和快速diff三种算法的性能差异。最后通过手写简版Vue3实现，展示了响应式系统、依赖追踪、DOM
2025-11-18 00:02:34
793
原创 Vue 3 函数式编程与Composition API
函数式编程强调纯函数、不可变性和高阶函数等特性。Vue3的Composition API与该范式高度契合：计算属性体现纯函数思想，响应式状态可模拟不可变性，自定义Hook实现了高阶函数和逻辑复用。文章重点展示了函数式编程中的compose函数实现，并演示了如何在Vue3中应用函数式思想，通过组合小函数构建复杂逻辑，如useCounter和useDoubleCounter等自定义Hook。这种编程方式提升了代码的可维护性和复用性，是Vue3的重要创新。
2025-11-13 14:24:09
444
原创 Vue 3与 Vue 2响应式的区别
Vue3和Vue2响应式原理对比：Vue3采用Proxy实现响应式，通过reactive和ref函数创建代理对象，支持动态属性检测，性能更优；Vue2依赖Object.defineProperty，需在data和computed中定义响应式数据，无法动态响应属性增减，存在性能局限。Proxy相比Object.defineProperty具有更好的灵活性和效率。
2025-11-13 11:36:41
401
原创 Tauri 开发桌面端简介
Tauri是一个轻量级桌面应用开发框架，支持多平台构建微小快速的二进制文件。它允许开发者使用任意前端框架构建界面，同时通过Rust、Swift等语言处理后端逻辑。相比Electron，Tauri具有更小的体积、更高的安全性以及更灵活的语言选择。项目结构清晰划分前后端代码，包含Rust入口文件、配置文件和资源目录等关键组件。Tauri2.x采用优化的架构设计，显著提升了性能和开发体验。
2025-11-12 00:55:08
340
原创 Electron 原理浅析
Electron应用架构解析：由主进程（Node.js环境）、渲染进程（Chromium环境）和IPC通信组成，采用事件驱动模型。提供上下文隔离、内容安全策略等安全机制，支持原生模块扩展（通过node-gyp）和增量更新（利用electron-builder比对版本差异生成更新包）。应用打包后可通过electron-updater实现版本检查、差异包下载和静默安装的完整更新流程。该框架结合了Web技术与原生能力，支持跨平台应用开发。
2025-11-12 00:02:09
1209
原创 Electron 快速入门手册
本文介绍了Electron跨平台桌面应用开发的主要技术方案和实践方法。首先对比了基于ElectronForge和Electron-Vite的两种项目初始化方式，详细说明了使用模板、自定义模板和启动应用的具体步骤。然后重点讲解了主进程与渲染进程之间的三种通信模式（单向、双向、主到渲染），并提供了完整代码示例。文章还列举了Electron常用API模块的功能及用法，包括app、BrowserWindow、ipc等核心模块。
2025-11-11 23:00:53
1155
原创 Electron 面试中最常见的两个问题
本文介绍了Electron框架中主进程和渲染进程的区别及通信方式，并提供了应用性能优化建议。主进程负责管理应用核心功能，渲染进程处理UI展示，两者通过IPC机制通信。性能优化策略包括：减少渲染进程负载、使用WebWorker处理耗时任务、懒加载资源、优化动画渲染、使用分析工具定位瓶颈、优化资源管理以及减少IPC通信频率。这些方法有助于提升Electron应用的响应速度和运行效率。
2025-11-06 10:13:12
278
原创 React-Native 原理浅析
React-Native的执行流程主要包含代码编译、跨平台对接和新架构优化三部分。开发中，JavaScript/JSX代码通过Metro打包工具进行编译和热重载，Hermes引擎优化性能。通过桥接机制实现JS线程与原生线程的异步通信，新架构引入Fabric渲染系统实现并发更新，采用视图扁平化和多线程模型提升性能。关键术语包括Bridge通信通道、Fabric渲染系统、Metro打包工具和Hermes引擎，共同构成了React-Native高效跨平台开发的完整技术栈。
2025-11-06 00:13:05
980
原创 ReactNative 快速入门手册
本文全面介绍了React Native开发流程，从项目初始化到应用发布。主要内容包括： 项目创建与配置 使用React Native CLI创建项目 启动Metro开发服务器 推荐项目目录结构 核心开发内容 常用组件(View、Text、Image等)的使用方法 StyleSheet样式管理及主题实现方案 路由处理(@react-navigation配置) 常用API(AsyncStorage、Fetch等) 多端开发与发布 平台适配方案(Platform API) 原生模块开发.......
2025-11-05 20:28:30
876
原创 ReactNative如何处理跨平台差异和优化应用
本文介绍了React Native开发中的两个关键优化方向：跨平台差异处理和性能优化。在跨平台方面，建议使用Platform API进行条件渲染、采用第三方UI库、运用StyleSheet和flexbox布局，并强调多平台测试的重要性。针对性能优化，提出了多种策略：使用代码分割和懒加载减少初始JS体积、启用Hermes引擎、优化图片加载、利用性能监控工具、改进动画处理、减少重渲染频率，以及定期进行内存检测。这些方法能有效提升应用启动速度并降低内存使用，适用于需要优化React Native应用的开发者。
2025-11-02 23:35:44
409
原创 Taro 源码浅析
Taro 4.0.7源码分析摘要： Taro采用monorepo架构管理核心功能模块，通过编译时和运行时两阶段实现多端适配。编译阶段通过Babel转译代码、条件编译和生成平台特定产物；运行时基于@tarojs/taro等子包处理组件渲染、API转换和状态管理。其核心包括AST解析、组件/API映射、样式适配三层转换机制，并通过插件体系支持平台扩展。差异化处理涵盖生命周期映射、事件标准化和跨平台API适配，最终输出符合各平台规范的代码。文档和案例资源为开发者提供了完整的生态支持。
2025-11-02 14:33:22
1239
原创 Taro 开发快速入门手册
本文介绍了Taro跨端开发框架的详细使用指南。主要内容包括：1. 环境搭建与项目初始化，包括Node.js环境要求、Taro CLI安装、项目创建和模板选择；2. 项目结构与基本开发，讲解目录组织、核心文件和常用组件（View、Text、Image等）的使用；3. API功能介绍，涵盖网络请求、Toast提示、设备信息获取等常见场景；4. 多端开发方案，重点说明通过环境变量、条件编译和多端文件实现跨平台适配；5. 构建与发布流程，详细介绍微信小程序和H5应用的打包部署方法。文章还包含平台插件化设计和Dock
2025-11-02 12:49:31
1202
原创 Taro多端适配技术解析
摘要： Taro的多端适配通过跨端编译、组件化开发和API适配层实现代码转换和统一接口，支持CSS预处理和样式转换。其架构包含核心框架、编译器、插件系统、UI组件库、路由系统和开发工具，提供生命周期管理、代码转换、功能扩展、跨平台UI、一致导航和高效调试等功能，实现多端开发的高效性和一致性。
2025-10-29 23:37:39
357
原创 uni-app开发入门手册
摘要：本文详细介绍了HBuilderX工具的安装与使用流程，包括创建uni-app项目、调试应用、页面组件开发、条件编译等核心内容。重点讲解了项目结构、常见组件API、Vue3组合式API应用，以及uni-app的生命周期管理。同时涵盖uni-cloud云服务开发、应用构建发布流程，并提供了官方文档和扩展资源链接，为开发者提供全面的uni-app开发指南。全文系统性地阐述了从环境搭建到项目上线的完整开发链路。
2025-10-29 15:37:54
939
原创 微信小程序服务商
微信小程序服务商是微信生态中的重要第三方角色，主要为企业提供小程序开发、运营和技术支持等专业服务。服务商类型包括开发型、运营型和综合解决方案型。入驻流程需通过微信开放平台注册、提交资质并审核。合作模式主要有开发外包、联合运营、SaaS和一站式解决方案四种形式，满足不同企业的需求。服务商帮助中小企业快速搭建和运营小程序，降低技术门槛，提升业务效率。
2025-10-27 22:20:52
1011
原创 微信小程序云开发
微信小程序云开发提供了一站式后端服务，包括云函数、云数据库、云存储和云调用四大核心功能。开发者无需搭建服务器，即可快速构建小程序应用。通过微信开发者工具可轻松启用云开发环境，配置云数据库进行增删改查操作，上传下载云存储文件，以及部署和调用云函数处理复杂业务逻辑。云调用还能直接对接微信开放能力如支付功能。实践案例展示了如何存储用户信息和上传文件，体现了云开发的高效便捷特性。
2025-10-26 22:03:01
874
原创 微信小程序开发基础（复习版）
微信小程序开发全流程指南 摘要：本文系统介绍了微信小程序的开发全流程，从小程序的历史背景出发，详细阐述了开发环境搭建、项目结构、基础架构、常用组件与API、路由与状态管理、网络请求等核心技术。文章重点讲解了小程序发布流程，包括代码上传、审核、版本管理和灰度发布等关键环节，并提供了HTTP请求、WebSocket、文件上传下载等实用功能的代码示例。通过本指南，开发者可以全面掌握小程序开发的核心要点，快速构建高性能的原生体验小程序应用。
2025-10-18 11:40:23
782
原创 微信小程序中的双线程模型及数据传输优化
微信小程序采用双线程模型（视图层和逻辑层）提升性能，但线程间通信存在性能开销。优化建议：1）减少setData调用频率和数据量，仅传递必要数据；2）采用分包加载和懒加载机制；3）长列表使用分页或虚拟滚动；4）利用本地缓存存储静态数据。这些措施可有效降低数据传输开销，提高小程序运行效率。
2025-10-07 10:19:39
387
原创 Nest 中使用Swagger自动化API文档生成
用来为操作指定响应状态码及其描述。@Get()用于定义 API 路径参数的相关信息。用于描述请求中的查询参数及其属性。@Get()用来描述 POST、PUT 等请求中的请求体内容。@Post()@ApiBody({schema: {})通常用于描述 DTO 类的属性，帮助生成 API 请求和响应的定义。
2025-10-01 15:36:53
1023
原创 Nest 定时任务与任务队列
本文介绍了Nest框架中定时任务与任务队列的集成方法。定时任务通过@nestjs/schedule模块实现，支持Cron表达式、间隔任务和超时任务，适用于数据清理、邮件发送等场景。任务队列使用@nestjs/bull模块结合Redis，实现异步任务处理，适用于邮件批量发送、图像处理等高并发需求。文章详细讲解了基础配置、高级功能（任务重试、并行处理）以及监控工具BullBoard的集成。这些功能能有效提升应用性能，改善用户体验。
2025-09-29 12:00:41
720
原创 Nest 文件上传与下载
NestJS框架提供了完整的文件处理方案，支持文件上传与下载功能。通过Multer中间件实现文件上传，可配置存储路径并动态生成文件名。文件下载支持流式传输和打包压缩（如tar格式），通过StreamableFile类优化大文件处理。开发者可扩展文件类型验证、大小限制等功能，并集成OSS服务实现云端存储。该方案兼顾灵活性与性能，适用于各类Web应用场景。
2025-09-28 21:41:51
766
原创 Nest 身份鉴权与权限控制
本文介绍了NestJS中实现JWT身份验证的完整方案。通过Passport模块集成JWT，详细讲解了AuthController、AuthModule、AuthService等核心组件的实现逻辑，包括登录验证、令牌生成和权限控制流程。同时对比分析了Cookie、单Token、双Token等多种身份鉴权方案的特点和适用场景，重点推荐了改良版双Token方案，通过Redis存储refreshToken实现更高的安全性和用户下线功能，适用于Web、移动端等多平台应用。
2025-09-27 15:36:06
1150
原创 Nest 数据库集成与ORM
本文介绍了如何在NestJS中集成TypeORM与PostgreSQL数据库。首先需要安装@nestjs/typeorm、typeorm和pg依赖包，然后配置数据库连接参数并创建实体类。通过TypeOrmModule.forFeature()注册实体，建立服务层注入Repository进行数据库操作，并创建控制器处理HTTP请求。
2025-09-27 13:34:34
890
原创 Nest Config 配置提取
Nest 官方配置模块@nestjs/config简化了应用配置管理，支持多环境和集中式配置。通过ConfigModule加载配置文件，可将数据库等敏感信息与代码分离，提高安全性。典型应用包括：1）在主模块导入配置；2）在config目录下按功能分置配置文件；3）通过ConfigService获取配置。特别适用于TypeORM等需要动态加载配置的场景，支持开发/生产环境切换，兼顾灵活性与安全性。新版API支持.env文件和环境变量优先加载。
2025-09-24 00:03:31
488
原创 Nest 中的数据库集成、JWT身份认证与任务调度全解析
本文介绍了在NestJS中集成PostgreSQL数据库、实现JWT身份认证以及定时任务管理的技术方案。通过TypeORM实现PostgreSQL集成，包括安装配置、ORM原理说明；使用JWT模块实现安全认证，涵盖令牌生成、验证策略及SSO方案；利用@nestjs/schedule和@nestjs/bull实现定时任务和队列管理，支持复杂任务调度。全文详细阐述了各模块的实现步骤、工作原理及最佳实践，为NestJS应用开发提供了完整的技术解决方案。
2025-09-23 23:18:02
946
原创 Nest 自定义模块集成
本文介绍了在NestJS中创建自定义PostgreSQL模块的方法。主要内容包括：1）安装pg库并创建PostgresService处理数据库连接；2）构建PostgresModule模块；3）在其他模块中使用数据库服务；4）集成事务支持，通过transaction方法封装事务操作（包括开始、提交和回滚）；5）展示在Controller中使用事务的示例。该方案实现了数据库连接的统一管理，简化了事务处理流程，保障了数据操作的一致性。
2025-09-23 00:13:00
1092
原创 Nest 核心概念详解
Nest 核心组件简介：1)Controllers处理HTTP请求，通过装饰器定义路由；2)Providers(如Services)负责业务逻辑和数据操作；3)Middleware处理请求前逻辑(如日志、认证)；4)Filters统一处理异常；5)Pipes验证转换请求数据；6)Guards实现权限控制；7)Interceptors拦截请求/响应，可添加额外处理逻辑。各组件通过装饰器声明，配合依赖注入实现模块化开发。
2025-09-22 16:52:38
654
原创 Nest 项目架构与搭建
Nest是一个基于Node.js的高效服务器框架，支持TypeScript和JavaScript，融合了多种编程范式。它在Express或Fastify等HTTP服务器框架之上提供抽象层，同时保留底层API的灵活性。Nest通过模块化架构、依赖注入和装饰器设计，帮助开发者构建可测试、可扩展的应用程序。其核心功能包括控制器、服务、中间件、守卫、管道和拦截器等，适用于处理复杂业务逻辑。使用Nest CLI可快速初始化项目，通过模块系统组织代码结构，实现松耦合和易维护的架构。启动后默认运行在3000端口。
2025-09-22 15:55:08
1296
原创 深入解析Nest 核心机制：依赖注入、拦截器与装饰器
本文深入解析Nest.js三大核心机制：依赖注入通过模块化设计和@Injectable装饰器实现组件解耦；拦截器基于AOP理念，在请求前后插入日志、权限等处理逻辑；装饰器配合元数据反射系统，简化权限控制和参数验证。这些功能共同支撑Nest.js构建高效可维护的Node.js应用，掌握其原理可显著提升开发效率与代码质量。
2025-09-22 11:53:47
679
原创 TypeORM 浅析
TypeORM是一个基于TypeScript/JavaScript的ORM框架，支持PostgreSQL、MySQL等多种数据库。它通过装饰器实现实体映射，简化数据库操作。文章介绍了TypeORM的安装配置、核心功能（实体定义、Repository操作、条件查询）以及高级特性（关系映射、乐观锁、事务）。通过代码示例展示了如何定义实体类、执行CRUD操作、处理一对多关系和使用事务管理。TypeORM提供面向对象的数据操作方式，适合构建复杂的数据驱动应用。
2025-09-21 22:09:22
584
原创 Node.js 服务数据持久化
本文介绍了Node.js中两种常用的数据库持久化方案。1) PostgreSQL部分：通过pg模块配置连接池，使用Express框架实现用户API，包括创建用户和获取用户列表功能。2) Redis部分：利用redis包建立连接，实现会话存储和检索功能，用于提升应用性能。两种方案均提供了代码示例，展示了基本的数据库操作方式。
2025-09-21 08:48:15
483
原创 Redis 入门与实践
Redis是一个高性能的内存键值数据库，支持多种数据结构（字符串、哈希、列表等）和持久化（RDB/AOF）。与SQL相比，Redis采用简洁的命令操作，如SET/GET/DEL等。它常与PostgreSQL等数据库配合使用，用Redis存储会话状态，持久化数据库存储核心数据。Redis还支持事务、发布订阅、消息流（Streams）和集群功能，适用于高并发、分布式场景。通过内存存储和丰富特性，Redis在缓存、会话管理和消息队列等场景中表现优异。
2025-09-20 23:46:05
968
原创 PostgreSQL 入门与实践
本文介绍了PostgreSQL数据库的核心功能与应用。主要内容包括：SQL基础语法、PostgreSQL与其他数据库（MySQL、MongoDB）的对比分析、丰富的数据类型支持（基本类型、数组、JSONB等）、存储过程与函数开发。文章重点展示了项目实战中的建表范例，包括用户表和行为表的设计与查询。高级应用部分详细讲解了全文检索、数据分区、并行查询、JSON处理等企业级功能，特别介绍了通过PLV8扩展使用JavaScript编写存储过程的方法。
2025-09-20 11:57:22
1034
原创 Docker 与数据库环境
Docker是一个轻量级容器化平台，通过OS级虚拟化实现高效资源利用和环境一致性。摘要涵盖：Docker核心优势（轻量、可扩展、环境一致）；Mac/Windows/Linux系统安装指南；使用Docker Desktop部署PostgreSQL和Redis的详细步骤；通过Navicat连接数据库服务的操作方法；Docker Compose多容器管理（含yml文件配置和常用命令）；最后简要介绍Kubernetes及其轻量版K3s/MicroK8s等扩展内容。150字完整呈现Docker核心功能与应用场景。
2025-09-19 14:40:39
935
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人