Learn React Source Code

• Day1 - Guidance
• Day2 - Mounting
• Day3 - Mounting - Contd
• Day4 - Updating - The Process Flow
• Day5 - Updating - Diff
• Day6 - Updating - Real DOM Update

Read it Online

What You'll Learn

• React JSX mount DOM
• React Virtual DOM Diff Element tree DOM
• Virtual DOM React
• React

What This Doesn't Cover

React React list Paul 2016

• defaultProps
• propTypes
• keys
• refs
• batching
• events
• createClass
• warnings
• browser
• optimizations
• rendering null
• DOM updates
• SVG
• life cycle hooks
• error boundaries
• perf tooling and optimizing
• PureComponents
• functional components

Run the Demo

> cd ./demo
> npm install
> npm run watch

Open the index.html manually.

Disclaimers

1. Most code of Dilithium you've seen in this repo is originally written by @zpao, at building-react-from-scratch, but it's also slightly changed here. I'll keep digging some of the listed features and adding blog and source code on top of the current codebase.

2. The diffing algorithm used in the Dilithium is the stack reconcilliation, not the new fiber architecture.

3. The code snippets in the blogs are sometimes somewhat different from that in the codebase. This is for better readablity and a more smooth learning curve.

Liscense

MIT@Chang