What is the difference between pure and impure pipe?
A pure pipe is only called when Angular detects a change in the value or the parameters passed to a pipe. For example, any changes to a primitive input value (String, Number, Boolean, Symbol) or a changed object reference (Date, Array, Function, Object).
An impure pipe is called for every change detection cycle no matter whether the value or parameters changes. An impure pipe is called often, as often as every keystroke or mouse-move.
What is PureComponent? When to use PureComponent over Component?
Pure components are the simplest and fastest components which can be written. They can replace any component which only has a
render(). These components enhance the simplicity of the code and performance of the application.
Component and PureComponent have one difference. PureComponent is exactly the same as Component except that it handles the
shouldComponentUpdate() method for you. When props or state changes, PureComponent will do a shallow comparison on both props and state. Component on the other hand won’t compare current props and state to next out of the box. Thus, the component will re-render by default whenever shouldComponentUpdate is called.
So, It is safe to use PureComponent instead of Component so long as you follow two simple rules: 1) Mutations are bad in general, but the problems are compounded when using PureComponent. 2) If you’re creating new functions, objects, or arrays in the render method you’re (probably) doing it wrong.
What is the difference between state and props?
Most of the time, mixing business logic in a React component will provide you with lots of headaches. For example: making an api call and storing those results in state.
apiReturn() -> datastore.storeData() -> datastore.notifyListeners() -> reactComponentListener()
The listener tends to be on a parent React component which stores that data in state. It then passes it down to child components via props.
If you have a list of items, your main list component has the listener function which stores the data in state. The components that serve as the items in the list get this data passed in via props.
This keeps a nice separation of logic in your code. The only reason to use state in a child is if you’re doing something simple like a visual toggle.
What is a higher order component?
A higher-order component (HOC) is an advanced technique in React for reusing component logic. HOCs are not part of the React API, per se. They are a pattern that emerges from React’s compositional nature.
Concretely, a higher-order component is a function that takes a component and returns a new component.
const EnhancedComponent = higherOrderComponent(WrappedComponent);
Whereas a component transforms props into UI, a higher-order component transforms a component into another component.
HOCs are common in third-party React libraries, such as Redux’s connect and Relay’s
What is Redux?
What is React Router?
React Router is a powerful routing library built on top of React, which helps in adding new screens and flows to the application. This keeps the URL in sync with data that’s being displayed on the web page. It maintains a standardized structure and behavior and is used for developing single page web applications. React Router has a simple API.
Why can’t browsers read JSX?