Miscellaneous

Question 1

What are React Portals?

Answer 1

Portals provide a way to render children into a DOM node that exists outside the DOM hierarchy of the parent component.

Question 2

How do you handle forms in React?

Answer 2

Using controlled components where form elements like <input></input>, <textarea>, and <select> maintain their state in the React state.</select></textarea>

Question 3

What is the significance of the key prop in React lists?

Answer 3

Keys help React identify which items have changed, are added, or are removed, which aids in efficient updates and rendering.

Question 4

What is a Fragment in React?

Answer 4

Fragments allow a component to return multiple elements without wrapping them in a parent DOM element.

Question 5

What are React hooks?

Answer 5

Hooks are functions that let you “hook into” React state and lifecycle features from function components.

Question 6

What is Redux and how does it relate to React?

Answer 6

Redux is a predictable state container for JavaScript apps.

Question 7

What is mutability?

Answer 7

The ability of an object to be altered or changed after its creation.

Question 8

What are pure functions?

Answer 8

Functions that always produce the same result given the same inputs and produce no side effects.

Question 9

What is functional programming?

Answer 9

A programming paradigm that treats computation as the evaluation of mathematical functions and avoids changing state or mutable data.

Question 10

How does immutability differ from mutability?

Answer 10

Immutable objects cannot be changed after creation, promoting safer and more predictable code. Instead of altering, new versions are created.

Question 11

What’s the benefit of immutability in React?

Answer 11

It simplifies complex features like time-travel debugging, ensures consistent behavior in your components, and can improve performance optimization.

Question 12

What is tree shaking?

Answer 12

A method used by modern bundlers to eliminate dead code by analyzing which exports are used and which are not.

Question 13

Why is tree shaking beneficial?

Answer 13

It reduces the final bundle size, leading to faster load times and better performance for web apps.

Question 14

What is code splitting?

Answer 14

A technique where a large bundle is split into smaller chunks that can be loaded on demand, optimizing load times.

Question 15

How does React support code splitting?

Answer 15

Through features like React.lazy() and <Suspense>, allowing components to be loaded dynamically.

Question 16

Define Polyfill.

Answer 16

A code piece added to provide modern functionality on older browsers that do not natively support it.

Question 17

What’s the purpose of a Virtual DOM?

Answer 17

A lightweight in-memory cache of the actual DOM on the page, allowing for efficient updates and rendering by minimizing direct DOM manipulations.

Question 18

How does React use the Virtual DOM?

Answer 18

React creates a diff between the current Virtual DOM with the previous one and updates only the actual DOM nodes that need to change, optimizing performance.

Question 19

What is the principle of Single Responsibility?

Answer 19

An object (or function, or module) should have only one reason to change, promoting cleaner, more maintainable, and easily understandable code.

Question 20

What is a Higher-Order Component (HOC) in React?

Answer 20

A function that takes a component and returns a new component with added props or altered behavior.