用户9715713的专栏-腾讯云开发者社区

开发者社区

文档建议反馈控制台

腾讯云架构师技术同盟

文章/答案/技术大牛

发布

用户9715713的专栏

专栏成员

129

文章

82832

阅读量

22

订阅数

深入react源码看setState究竟做了什么？_2023-03-15

paint queue setstate state tree

在深究 React 的 setState 原理的时候，我们先要考虑一个问题：setState 是异步的吗？

2023-03-15

6430

细说react源码中的合成事件_2023-03-15

document dom event plugins 事件

最近在做一个功能，然后不小心踩到了 React 合成事件的坑，好奇心的驱使，去看了 React 官网合成事件的解释，这不看不知道，一看吓一跳...

2023-03-15

4040

React Context源码是怎么实现的呢_2023-03-15

react children dispatcher provider render

目前来看 Context 是一个非常强大但是很多时候不会直接使用的 api。大多数项目不会直接使用 createContext 然后向下面传递数据，而是采用第三方库（react-redux）。

2023-03-15

4500

从react源码看hooks的原理_2023-03-01

编程算法渲染 react

其实hooks的定义都来自dispatcher，那我们根据Dispatcher依次去看看他们的实际实现。

2023-03-01

8720

从recat源码角度看setState流程_2023-03-01

react javascript 编程算法

setState() 将对组件 state 的更改排入队列批量推迟更新，并通知 React 需要使用更新后的 state 重新渲染此组件及其子组件。其实setState实际上不是异步，只是代码执行顺序不同，有了异步的感觉。

2023-03-01

5650

从源码角度看React-Hydrate原理_2023-03-01

这里，我们在 index.html 中直接返回一段 html，以模拟服务端渲染生成的 html

2023-03-01

3630

react源码分析：深度理解React.Context_2023-02-28

渲染 redux react

在 React 中提供了一种「数据管理」机制：React.context，大家可能对它比较陌生，日常开发直接使用它的场景也并不多。

2023-02-28

6450

react源码分析：组件的创建和更新_2023-02-28

因为初始化的源码文件部分所涵盖的内容很多，包括创建渲染、更新渲染、Fiber树的创建与diff，element的创建与插入，还包括一些优化算法，所以我就整个的React执行流程画了一个简单的示意图。

2023-02-28

5200

react的useState源码分析_2023-02-28

简单说下为什么React选择函数式组件，主要是class组件比较冗余、生命周期函数写法不友好，骚写法多，functional组件更符合React编程思想等等等。更具体的可以拜读dan大神的blog。其中Function components capture the rendered values这句十分精辟的道出函数式组件的优势。

2023-02-28

4360

react源码中的生命周期和事件系统_2023-02-27

因为前面也讲到jsx在v17中的编译结果，除了标签名，其他的挂在标签上的属性（比如class），事件（比如click事件），都是放在_jsxRuntime.jsx函数的第二参数上。表现为key:value的形式，这里我们就会产生几个问题。

2023-02-27

6200

react源码分析：babel如何解析jsx_2023-02-27

同作为MVVM框架，React相比于Vue来讲，上手更需要JavaScript功底深厚一些，本系列将阅读React相关源码，从jsx -> VDom -> RDOM等一些列的过程，将会在本系列中一一讲解

2023-02-27

2740

react源码分析：实现react时间分片_2023-02-27

编程算法 javascript 渲染 react

设想一个页面上有一万个DOM节点，如果我们用同步的方式一个个遍历完需要花费多少时间。而且如果是同步遍历的话，遍历的过程中，JS线程一直会霸占主线程，导致阻塞了浏览器的其他线程，导致卡顿的情况出现。

2023-02-27

3210

react源码中的fiber架构_2023-02-21

编程算法 react

上述代码，区分了组件的类型，在后期协调阶段beginWork、completeWork的流程里根据不同的类型组件去做不同的fiber节点的处理

2023-02-21

2490

react源码中的hooks_2023-02-21

react 渲染编程算法

今天，让我们一起深入探究 React Hook 的实现方法，以便更好的理解它。但是，它的各种神奇特性的不足是，一旦出现问题，调试非常困难，这是由于它的背后是由复杂的堆栈追踪（stack trace）支持的。因此，通过深入学习 React 的新特性：hook 系统，我们就能比较快地解决遇到的问题，甚至可以直接杜绝问题的发生。

2023-02-21

4740

react源码中的协调与调度_2023-02-21

react unix 编程算法

其实在React执行过程中，会有数不清的任务要去执行，但是他们会有一个优先级的判定，假如两个事件的优先级一样，那么React是怎么去判定他们两谁先执行呢？

2023-02-21

4630

React源码解读之任务调度_2023-02-20

react javascript 编程算法

React 设计体系如人类社会一般，拨动时间轮盘的那一刻，你便成了穿梭在轮片中的一粒细沙，角逐过程处处都需要亮出你的属性，你重要吗？你无可替代吗？你有特殊权限吗？没有，那不好意思，请继续在轮片中循环。属于你的生命之火殆尽，前来悼念之人很多，这幕，像极了出生时的场景。

2023-02-20

3230

React源码解读之更新的创建_2023-02-20

react 编程算法

React 的鲜活生命起源于 ReactDOM.render ，这个过程会为它的一生储备好很多必需品，我们顺着这个线索，一探婴儿般 React 应用诞生之初的悦然。

2023-02-20

2680

react hook 源码完全解读_2023-02-20

编程算法 react 渲染 javascript

从React Hooks发布以来，整个社区都以积极的态度去拥抱它、学习它。期间也涌现了很多关于React Hooks 源码解析的文章。本文就以笔者自己的角度来写一篇属于自己的文章吧。希望可以深入浅出、图文并茂的帮助大家对React Hooks的实现原理进行学习与理解。本文将以文字、代码、图画的形式来呈现内容。主要对常用Hooks中的 useState、useReducer、useEffect 进行学习，尽可能的揭开Hooks的面纱。

2023-02-20

1.1K0

React Context源码是怎么实现的呢_2023-02-19

目前来看 Context 是一个非常强大但是很多时候不会直接使用的 api。大多数项目不会直接使用 createContext 然后向下面传递数据，而是采用第三方库（react-redux）。

2023-02-19

5590

ReactDOM.render在react源码中执行之后发生了什么？_2023-02-19

react 渲染 javascript

通常是如下图使用，在提供的 container 里渲染一个 React 元素，并返回对该组件的引用（或者针对无状态组件返回 null）。本文主要是将ReactDOM.render的执行流程在后续文章中会对创建更新的细节进行分析，文中的源代码部分为了方便阅读将__DEV__部分的代码移除掉了。

2023-02-19

5130

点击加载更多

社区活动

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·干货材料·成员作品最新动态