React Virtual DOM Postmortem

There is a chasm between using React to build UIs and needing to know how it actually works under the hood.

Launching a React <App /> For The First Time

Mounting <App/> For The First Time.

Virtual DOM & Diffing (“Reconciliation”) Algorithm

An abstract animation of React’s Diffing Algorithm. If the two virtual DOM trees are found to be different then the most recent one (the newest one) is reconciled to the actual DOM in browser.

React Components

render() should remain a pure function at all times

Don’t pollute render() method with functions that in some way update DOM directly.

Lifecycle Events

Animated Hooks Next?

Issues. Every webdev has them. Published author of CSS Visual Dictionary few others…

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store