Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/AttackXiaoJinJin/reactExplain
React源码解析
https://github.com/AttackXiaoJinJin/reactExplain
explaination react16 source-code
Last synced: 3 months ago
JSON representation
React源码解析
- Host: GitHub
- URL: https://github.com/AttackXiaoJinJin/reactExplain
- Owner: AttackXiaoJinJin
- Created: 2019-03-21T13:13:09.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-09T17:27:37.000Z (over 1 year ago)
- Last Synced: 2024-01-22T00:13:23.813Z (5 months ago)
- Topics: explaination, react16, source-code
- Language: JavaScript
- Homepage:
- Size: 5.7 MB
- Stars: 553
- Watchers: 5
- Forks: 85
- Open Issues: 149
-
Metadata Files:
- Readme: README.md
Lists
- awesome-github-star - reactExplain
- awesome - AttackXiaoJinJin/reactExplain - React源码解析 (JavaScript)
- awesome-react-cn - React源码解析
README
React源码解析
说明
* 本源码可从[https://github.com/AttackXiaoJinJin/reactExplain/blob/master/react16.8.6/CHANGELOG.md](https://github.com/AttackXiaoJinJin/reactExplain/blob/master/react16.8.6/CHANGELOG.md)
查看版本号，建议直接 fork，若从官网下载源码，考虑到 [文件名称被rename](https://github.com/AttackXiaoJinJin/reactExplain/issues/147) 的问题，建议版本号从16.9.0开始
官网 release 地址：
[https://github.com/facebook/react/releases?after=v16.10.2](https://github.com/facebook/react/releases?after=v16.10.2)
* 如果找不到对应的`函数名`/`文件名`，建议全局搜索里面的代码块进行查找
API
[React源码解析之React.createElement()和ReactElement()](https://juejin.im/post/5d2b0763f265da1bd14686c5)
[React源码解析之React.Component()/PureComponent()](https://juejin.im/post/5d2e754f6fb9a07f070e600e)
[React源码解析之React.createRef()/forwardRef()](https://juejin.im/post/5d39afe65188257dc103e9f5)
[React源码解析之React.createContext()](https://juejin.im/post/5d3efff3e51d4561a34618c0)
[React源码解析之React.children.map()](https://juejin.im/post/5d46b71a6fb9a06b0c084acd)
[React.forwardRef的应用场景及源码解析](https://juejin.im/post/5e52263de51d4526dd1ea1fe)
***
FiberScheduler
[React源码解析之ReactDOM.render()](https://juejin.im/post/5d535e7be51d45620771f0b2)
[React源码解析之RootFiber](https://juejin.im/post/5d5aa4695188257573635a0d)
[React源码解析之Update和UpdateQueue](https://juejin.im/post/5d62645bf265da03ec2e6f33)
[React源码解析之ExpirationTime](https://juejin.im/post/5d6a572ce51d4561fa2ec0bc)
[React源码解析之setState和forceUpdate](https://juejin.im/post/5d705e555188255457502380)
[React源码解析之FiberRoot](https://juejin.im/post/5d75a66ce51d4561e84fcc9b)
[React源码解析之scheduleWork（上）](https://juejin.im/post/5d7fa983f265da03cf7ac048)
[React源码解析之scheduleWork（下）](https://juejin.im/post/5d885b75f265da03e83baaa7)
[React源码解析之requestHostCallback](https://juejin.im/post/5da2d5725188252a923a8ec5)
[React源码解析之flushWork](https://juejin.im/post/5dad45575188256ad9347402)
[React源码解析之renderRoot概览](https://juejin.im/post/5db7f39f6fb9a0207f102ee7)
[React源码解析之workLoop](https://juejin.im/post/5dcc17b26fb9a02b6a6ff999)
***
ComponentUpdate
[React之childExpirationTime](https://juejin.im/post/5dcdfee86fb9a01ff600fe1d)
[React源码解析之FunctionComponent（上）](https://juejin.im/post/5ddbe114e51d45231e010c75)
[React源码解析之FunctionComponent（中）](https://juejin.im/post/5de8cf74f265da33ac2ce132)
[React源码解析之FunctionComponent（下）](https://juejin.im/post/5deb93976fb9a016464340b0)
[React源码解析之updateClassComponent（上）](https://juejin.im/post/5e1bc74ee51d45020837e8f4)
[React源码解析之updateClassComponent（下）](https://juejin.im/post/5e1d17e75188254dc022bbee)
[React源码解析之PureComponet的浅比较](https://juejin.im/post/5e2150535188254dbc25e6cf)
[React源码解析之IndeterminateComponent](https://juejin.im/post/5e26a131e51d453cf54449b5)
[React源码解析之updateHostComponent和updateHostText](https://juejin.im/post/5e398018f265da5765439b57)
***
NodeUpdate
[React源码解析之completeUnitOfWork](https://juejin.im/post/5e4a02bd51882549122aa50c)
[React源码解析之completeWork和HostText的更新](https://juejin.im/post/5e535d7e6fb9a07cbf46b282)
[React源码解析之HostComponent的更新(上)](https://juejin.im/post/5e5c5e1051882549003d1fc7)
[React源码解析之HostComponent的更新(下)](https://juejin.im/post/5e65f86f6fb9a07cdc600e09)
***
错误处理
[React源码解析之「错误处理」流程](https://juejin.im/post/5e7963956fb9a07cdc60253f)
***
Commit阶段
[React源码解析之commitRoot整体流程概览](https://juejin.im/post/5e829d1e6fb9a03c621666b5)
[React源码解析之Commit第一子阶段「before mutation」](https://juejin.im/post/5e883ff76fb9a03c860b6ab0)
[React源码解析之Commit第二子阶段「mutation」(上)](https://juejin.im/post/5e8ad1436fb9a03c3c351447)
[React源码解析之Commit第二子阶段「mutation」(中)](https://juejin.im/post/5e92b851f265da47bf17bdc6)
[React源码解析之Commit第二子阶段「mutation」(下)](https://juejin.im/post/5e9ae787e51d454701257e45)
[React源码解析之Commit最后子阶段「layout」(附Commit阶段流程图)](https://juejin.im/post/5ea6f1746fb9a0437c3929c5)
***
React-Hooks
[ReactHooks源码解析之useState及为什么useState要按顺序执行](https://juejin.im/post/5eb7c96ff265da7b90055137)
[ReactHooks源码解析之useEffect](https://juejin.im/post/5ed3356bf265da76cf6e4f75)
***
好文分享
[图解React](http://www.7km.top) ——作者：[公里柒(KM.Seven)](https://github.com/7kms)
[React源码揭秘1 架构设计与首屏渲染]()——作者：[卡颂](https://juejin.im/user/5aea853b518825670f7baf2e/posts)
[这可能是最通俗的 React Fiber(时间分片) 打开方式](https://juejin.im/post/5dadc6045188255a270a0f85)——作者：[荒山](https://juejin.im/user/5762733b2e958a00696163ea/posts)
[走进React Fiber 架构](https://juejin.im/post/5df21c895188251260743972#heading-36)——作者：[intopiece_槟](https://juejin.im/user/59435713128fe1006a278401/posts)
***
微信公众号
每周分享前端干货和生活感悟！
