React Internals - How understanding React implementation can help us make better apps
Submitted by Ankit Muchhala (@ankit-muchhala) on Friday, 29 June 2018
We all know React is fast, it uses VDOM, it provides lifecycle methods and what not. But What is VDOM? How does it make React fast? How does it optimize changes? This talk aims to answer such questions about the internal workings of React.
Intended audience: Any developer working with React
Philosophy of React
- The declarative structure
- UI is a projection of data y = f(d)
- Component based architecture
- Learn once, write anywhere
- Elements, components and instances
- Talk about the old reconciliation algorithm when element tree is mounted/updated/unmounted.
- Diffing algorithm
- Explain how the old lifecycle methods came into being and how react controls them.
- Aim of fiber
- What is a fiber and explain concept of WIP tree
- Pausing and resuming work based on requestIdleCallback
- Explain the new lifecycle methods
- What takes priority in fiber
- Synthetic events and event pooling
- Talk about scenarios where using React might not be the best option and reason about them based on the previous explanation
I am a Software Developer at Postman. I have been developing web applications for the past 4 years. Currently, I spend my time building, optimizing and maintaining the web products of Postman.