React Interview Questions

React Interview Questions

by John Vincent


Posted on February 23, 2017



Let’s describe some of the potential React interview topics.

React

My blog

React Handbook

Others

TODO

Make sure to know any lifecycle, what is HOC, compound components, render props. Also diff between state and props. Uncontrolled vs controlled input.

https://courses.thinkful.com/react-001v3/lesson/5.2

https://www.youtube.com/watch?v=4OzC5InCkLY https://www.youtube.com/watch?v=yb_w7jg_veQ https://www.youtube.com/watch?v=-93UNO42CCs&t=3s

DOM

To talk about the virtual DOM behind React, we first have to understand the regular DOM. If you’re not aware, DOM stands for Document Object Model. This sounds confusing, but it is really just a fancy name for the way HTML is represented in-memory.

The DOM provides an interface to interact with these nodes through JavaScript functions like getElementById. But querying the DOM is expensive. Every time we want to modify an element, we have to traverse through the entire tree structure just to find the element. Due to the increasing size and complexity of HTML markup and the rise of SPAs (Single Page Applications), traversing the entire tree every time we modify the DOM can quickly lead to bad performance.

Virtual DOM

The virtual DOM is a copy of the DOM that is native to React. As we saw with this.setState, React is already good at figuring out how to re-render the minimum number of components necessary. It only re-renders the component and its children where a piece of state has changed.

After it updates the necessary components in its virtual DOM, it simply has to diff this copy with the real DOM and make the necessary changes.

This eliminates having the traverse the entire tree-structure of the DOM and results in huge performance gains. One of the reasons why React pages are typically so snappy (unless you use a ridiculous amount of packages) is because it takes advantage of the virtual DOM.