Miscellaneous Flashcards
What are React Portals?
Portals provide a way to render children into a DOM node that exists outside the DOM hierarchy of the parent component.
How do you handle forms in React?
Using controlled components where form elements like <input></input>, <textarea>, and <select> maintain their state in the React state.</select></textarea>
What is the significance of the key prop in React lists?
Keys help React identify which items have changed, are added, or are removed, which aids in efficient updates and rendering.
What is a Fragment in React?
Fragments allow a component to return multiple elements without wrapping them in a parent DOM element.
What are React hooks?
Hooks are functions that let you “hook into” React state and lifecycle features from function components.
What is Redux and how does it relate to React?
Redux is a predictable state container for JavaScript apps.
What is mutability?
The ability of an object to be altered or changed after its creation.
What are pure functions?
Functions that always produce the same result given the same inputs and produce no side effects.
What is functional programming?
A programming paradigm that treats computation as the evaluation of mathematical functions and avoids changing state or mutable data.
How does immutability differ from mutability?
Immutable objects cannot be changed after creation, promoting safer and more predictable code. Instead of altering, new versions are created.
What’s the benefit of immutability in React?
It simplifies complex features like time-travel debugging, ensures consistent behavior in your components, and can improve performance optimization.
What is tree shaking?
A method used by modern bundlers to eliminate dead code by analyzing which exports are used and which are not.
Why is tree shaking beneficial?
It reduces the final bundle size, leading to faster load times and better performance for web apps.
What is code splitting?
A technique where a large bundle is split into smaller chunks that can be loaded on demand, optimizing load times.
How does React support code splitting?
Through features like React.lazy() and <Suspense>, allowing components to be loaded dynamically.
Define Polyfill.
A code piece added to provide modern functionality on older browsers that do not natively support it.
What’s the purpose of a Virtual DOM?
A lightweight in-memory cache of the actual DOM on the page, allowing for efficient updates and rendering by minimizing direct DOM manipulations.
How does React use the Virtual DOM?
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.
What is the principle of Single Responsibility?
An object (or function, or module) should have only one reason to change, promoting cleaner, more maintainable, and easily understandable code.
What is a Higher-Order Component (HOC) in React?
A function that takes a component and returns a new component with added props or altered behavior.
