51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
信创认证
公众号矩阵
移动端
视频课 免费课 排行榜 短视频 直播课 软考学堂
全部课程 软考 信创认证 华为认证 厂商认证 IT技术 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库
CKA（Kubernetes 管理员认证）精品班
按照企业k8s需求进行技能培训，帮助用户快速拿下CKA认证，K8S采用新版本进行授课，课程内容全、讲解详细 。 免费试学
软考高级：系统架构设计师精品班
根据考试大纲对知识点、高频考点进行深入讲解，传授答题技巧及判断标准，助力高效备考。 免费试学
信创认证：系统架构师精品班（高级）
信息技术应用创新人才考试评价 免费试学

深入react技术栈-初入react
1.virtual DOM 传统页面开发模式中，都是对真实的dom进行操作，耗费大量的性能。而react将真实dom树转换成虚拟dom,每一次更新都与原来的虚拟dom进行diff比对来进行更新，对于改变的部分来进行批量更新，节约了性能。 通过虚拟dom转换成真实dom，方便和其他平台的集成，reac ...
生命周期
ios
批量更新
android
原生控件
转载
mob604756f2dcb4
2021-09-19 22:11:00
186阅读
2评论

react 技术栈 前端架构图 深入react技术栈
1. react.ComponentReact 的所有组件都继承自顶层类 React.Component。它的定义非常简洁，只是初始化了React.Component 方法，声明了 props、context、refs 等，并在原型上定义了 setState 和forceUpdate 方法.2. 无状态函数示例代码如下：function Button({ color = 'blue', text
react 技术栈 前端架构图
初始化
生命周期
转载
编程小匠人之魂
2023-10-26 19:50:14
133阅读

深入React技术栈之setState详解
抛出问题 这四次输出，按常理来说分别是: 1，2，3，4。但是，实际输出为: 0, 0, 2, 3 setState的注意点 setState不会立刻改变React组件中state的值（即setState是异步更新） setState通过一个队列机制实现state更新； 当执行setState时，会
事件处理
生命周期
函数式
状态队列
问题分析
转载
mob604756eedb0b
2018-11-05 16:55:00
77阅读
2评论

深入React
设计思想想表达什么？React怎样理解Application？应用是个状态机，状态驱动视图v=f(d)v是视图f是组件d是数据/状态与FP有什么关系？把函数式思想引入前端，通过PureComponent组合来实现UI最大好处是让UI可预测，对同样的f输入同样的d一定能得到同样的v可以把各个f单独拎出来测试，组合起来肯定没有问题，从理论上确定了组件质量是可靠的，组合出来的整个应用的UI也是可靠的目标
Java
原创
mb5ff9827b65e5b
2021-01-15 20:09:24
182阅读

深入 React Fiber 内部
从 React 16 开始，React 重新实现了 reconciliation 算法，它被称为 Fiber Reconciler。在 React 16 之前你可能听说过 virtualDOM，那是老的 reconciliation 算法，老的 reconciler 算法使用了堆栈，所以它也被称为 Stack Reconciler。我会先简单的介绍一下 Stack Reconciler，再介绍 F
React Fiber
转载
mb5ffbc8bbd6412
2021-01-17 15:09:18
340阅读
2评论

<<深入React技术栈>> CSS Modules
css-loader css-loader 是一个 webpack 模块编译器，支持 CSS Modules . module: { rules: [ { test: /\.global\.css$/, use: [$style_loader, $css_loader] }, { test: /(? ...
css
ico
html
编译器
ide
转载
mb5fd33fb726faf
2021-09-22 16:44:00
163阅读
2评论

React技术
React技术注意：本章节运行环境在上一章节​​React项目构建​​之上。文章目录​​React技术​​​​简介​​​​Virtual DOM​​​​支持JSX语法​​​​测试程序​​​​程序解释​​​​JSX规范​​​​组件状态state​​​​属性props​​​​构造器constructor​​​​组件的声明周期​​​​函数试组件​​简介React是Facebook开发并开源的前端框架。当
React技术
html
javascript
重绘
原创
带着梦想飞翔
2022-10-19 11:34:27
141阅读

《深入React技术栈》电子书PDF+源代码
下载：https://pan.quark.cn/s/436627996fd7
react
原创
nikanni
2023-09-18 20:20:19
774阅读

【React】深入理解React组件状态State
定义一个合适的State，是正确创建组件的第一步。State必须能代表一个组件UI呈现的完整状态集，即组件的任何UI改变，都可以从State的
react.js
前端
前端框架
数组
赋值
原创 精选
wx638ea457ad8b9
2023-10-17 01:20:24
365阅读

深入React笔记 — 谈谈hooks
年初的时候，从头大的flutter终于转回了老本行js代码，就此第一次开始接触了hooks。一开始看useState这些api其实很奇怪的，返回一个数组，第一个数组项目是value，第二个是setValue的函数。然后就是useEffect，useCallback这些，有点套不上原来class组件的思维。但一年下来，感觉非常爽，就个人感觉hooks理念相比其他前端框架跃进了一大截。为什么需要hoo
hooks
React笔记
转载
mb600beaa63f802
2021-01-25 19:20:18
357阅读
2评论

React深入 - 手写redux api
简介： 手写实现redux基础api createStore( )和store相关方法 api回顾： createStore(reducer, [preloadedState], enhancer) Store 方法 源码实现： demo:验证正确性 // import { createStore
中间件
ide
加载机制
自定义
提交状态
转载
mb5fe18e32e4691
2018-11-04 23:09:00
89阅读
2评论

【React】594- React Fiber：深入理解 React reconciliation 算法
作者：Maxim Koretskyi 译文：Leiy ​​https://indepth.dev/inside-fiber-in-depth-overview-of-the-new-reconciliation-algorithm-in-react/​​React 是一个用于构建用户交互界面的 JavaScript 库，其核心​​机制​​​就是跟踪组件的状态变化，并将
生命周期
字段
子节点
转载
pingan8787
2022-10-24 10:40:48
169阅读

【React】383- React Fiber：深入理解 React reconciliation 算法
作者：Maxim Koretskyi 译文：Leiy ​React 是一个用于构建用户交互界面的 JavaScript 库，其核心​​机制​​​就是跟踪组件的状态变化，并将更新的状态映射到到新的界面。在 React 中，我们将此过程称之为​​协调​​​。我们调用​​setState​​​方法来改变状态，而框架本身会去检查​​state​​​或 ​​props
生命周期
字段
子节点
转载
pingan8787
2022-10-21 18:23:35
50阅读

react 技术架构
React 技术架构 React 是一个用于构建用户界面的 JavaScript 库。它采用了组件化的思想，使得我们可以将复杂的 UI 划分为独立可复用的组件。通过引入虚拟 DOM，React 实现了高效的 DOM 更新，从而提高了应用的性能。在本文中，我们将介绍 React 的技术架构，并通过代码示例来说明其工作原理。 ## 组件化思想 React 的核心思想是组件化。组件是一个可复用的、
生命周期
javascript
技术架构
原创
mob64ca12e6f33c
2024-01-29 11:16:55
52阅读

react架构技术
本文主要讲解：React目录结构、React创建组件、 ReactJSX语法、 React绑定数据、React绑定对象 在上一篇中使用 npx create-react-app demo1命令创建了一个react项目，并且用npm start命令将react项目启动起来。一、项目的目录结构demo1 |--node_modules #npm 包的安装目录 |--public |--in
react架构技术
react
JSX
App
css
转载
墨守成规de网工
6月前
33阅读

React技术初识
前端框架哪家强，如果没理解错
学习
原创
jeanron100
2021-07-25 11:13:46
185阅读

React技术栈
本文简明准确地向你介绍React技术栈，致力于前端开发的同学可以参考。
React技术栈
转载
googlingman
2018-05-19 10:33:27
2134阅读

react深入 - 手写实现react-redux api
简介：简单实现react redux基础api react redux api回顾 <Provider store>把store放在context里，所有子组件可以直接拿到store数据 connect([mapStateToProps], [mapDispatchToProps], [
ide
数据
回调函数
选择器
高阶函数
转载
mb5fd869d1d8388
2018-11-04 13:41:00
99阅读
2评论

实现高效前端组件通信：深入探索React框架的技术方案
前端开发中，组件通信是一个重要的话题。在复杂的应用程序中，组件之间的有效通信对于实现良好的用户体验和可维护性至关重要。本文将探索基于React框架的前端组件通信技术，深入了解不同的通信模式和实践，并提供相应的示例代码。一、单向数据流在React中，单向数据流是一种常见的组件通信模式。父组件通过props将数据传递给子组件，子组件只能通过props接收数据。这种模式简单明了，易于理解和维护。示例代码
示例代码
ide
App
原创
虎斑嘟嘟
2023-10-24 09:40:55
134阅读

技术站访问地址
Vue
原创
hanige
2024-07-31 17:55:43
66阅读
  • 1
  • 2
  • 3
  • 4
  • 5
精品课程领资料
免费资料>
2025软考
系统架构设计师 系统规划与管理师 软件设计师 系统集成项目管理工程师
信创认证
系统架构师 信创集成项目管理师 信创规划管理师 系统开发工程师
厂商认证
CKA/CKS架构师 红帽认证工程师 Oracle-OCP认证 Oracle-OCM认证
IT技术
数据库高级工程师 AIGC大模型实战 Linux云计算架构师 Python全栈开发
华为认证
数通HCIP认证 云计算HCIE认证 华为存储HCIE认证 HCIP安全认证
相关文章

B站视频技术架构 b站技术环境分析

深入解析React Event实现原理

深入理解react-redux

深入了解 React Router 原理

React 框架 | 深入剖析 Scheduler 原理

React 18底层源码深入剖析

深入props --React进阶指南笔记

深入理解React Diff算法

深入详解React生命周期

Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯