From the course: Master React 19 and Next.js 16 with Hands-On Projects and Real-World Applications

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Keeping components pure

Keeping components pure

In this lecture, you will learn about components' purity in React. You will understand what purity is and how to make sure components stay pure by avoiding side effects in the render phase. First, let's understand what a pure function is through an example. The function add is a simple function that adds two numbers. If you pass 2 and 3 to the function add, you will get 5 as a result. If you call the function again using the same parameters, you will always get the same result, 5. Also, our function does not have any side effects, like changing outside variables. We can say that this is a pure function. Any function that verifies these two conditions is called a pure function. If you give it the same input, it always returns the same output, and it does not have any side effects like changing a variable outside the function scope. Now let's have a look at this function. The function increment increments the count variable and returns it as an output. So this function has a side…

Contents