How to solve the issue that arise while using performance.now() method in JavaScript?


The performance.now() method is used to calculate the performance of the code written by any programmer or the coder. The performance.now() method will return a numerical value that will be the time taken by the written code to execute. The value returned by this method may vary every time we execute the code even for the same code.

In today’s time, everyone wants to write the fast loading and the efficient code for a problem that can work on every parameter and fastest of all other solutions. So, to measure the efficiency and to make sure that the written code is fast enough, programmers use the performance.now() method provided by JavaScript to measure all the parameters of the written code.

Till now, we have discussed the advantages of the performance.now() method, but there are some issues or the problems that may arise while calculating the efficiency or performance of the code using this method.

Problem

Suppose there are two programmers Prog1 and Prog2, and both of them are writing the code to solve the same problem. If the code written by Prog1 takes less time as compare to the code of Prog2 for small inputs, then the code of Prog1 is said to be more efficient for small inputs only. But, on the other hand the code written by Prog2 takes lesser time as compare to the code of Prog1 for large inputs, then the code of Prog2 is said to be the only efficient solution to the problem.

Let us discuss the problem that could arise while using this method with help of code example.

Syntax

Following syntax will show you how you can use the performance.now() method to find the performance of the written code −

var variable_name = performance.now();

Let us assume that both the programmers are trying the best solution for the problem of finding the sum of first N natural numbers, where N is entered by the user.

Steps

  • Step 1 − In the first step, we will add the input element in the HTML document of number type to get a number input from the user.

  • Step 2 − In the next step, we will add the button element with onclick event which will call a function when user clicks the button and the sum of N natural numbers as well as the time taken by the code to execute is visible to the user.

  • Step 3 − In this step, we will define a JavaScript function to calculate the sum of N natural numbers with the help of a for loop.

  • Step 4 − In the last step, we will assign the function defined in last step to the onclick event of the button.

Example

The below code is written by Prog1 to calculate the sum of N natural umbers −

<html>
<body>
   <h3>Solving the issue that arise while using performance.now() method in JavaScript</h2>
   <p id = "upper">The below code is to find the sum of N natural numbers written by Programmer1.</p>
   <p>Enter a number:</p>
   <input type = "number" id = "inp1"> <br><br>
   <button id = "btn" onclick = "findSum()"> check the time </button>
   <p id = "result"> </p>
   <script>
      let initialTime = performance.now();
      let result = document.getElementById("result");
      function findSum() {
         let sum = 0;
         let inp1 = document.getElementById("inp1");
         let num1 = Number(inp1.value);
         for (let i = 1; i <= num1; i++) {
            sum += i;
         }
         let finalTime = performance.now();
         let time = finalTime - initialTime;
         result.innerHTML += " The sum of the first <b> " + num1 + " </b>  natural numbers is: <b>  " + sum + " </b>, and the time taken by code to execute is: <b> " + time + " </b>. <br> ";
      }
   </script>
</body>
</html>

Let us now discuss the code of Program 2

Approach

The approach of this example is almost similar to the algorithm of the previous example. You just need to perform a minor change by replacing the for loop of previous example with the formula of finding the sum of N natural numbers as: N*(N+1)/2.

Example

The below code is written by Prog2 to calculate the sum of N natural numbers −

<html>
<body>
   <h3>Solving the issue that arise while using performance.now() method in JavaScript</h3>
   <p id = "upper">The below code is to find the sum of N natural numbers written by Programmer2.</p>
   <p>Enter a number:</p>
   <input type = "number" id = "inp1"> <br> <br>
   <button id = "btn" onclick = "findSum()"> check the time </button>
   <p id = "result"> </p>
   <script>
      let initialTime = performance.now();
      let result = document.getElementById("result");
      function findSum() {
         let inp1 = document.getElementById("inp1");
         let num1 = Number(inp1.value);
         let sum = (num1 * (num1 + 1)) / 2;
         let finalTime = performance.now();
         let time = finalTime - initialTime;
         result.innerHTML += " The sum of the first <b> " + num1 + " </b>  natural numbers is: <b>  " + sum + " </b>, and the time taken by code to execute is: <b> " + time + " </b>. <br> ";
      }
   </script>
</body>
</html>

In both of the above written code examples, the execution time for the same value entered by the user is almost same. Which is the problem that arises while calculating the performance of the code using the performance.now() method. In these cases, we ca not find which method or solution of the problem is efficient or best for the problem using performance.now() method.

Solution

The solution of the problem is to use the Big O notation to find the efficiency of the written solution. The Big O notation does not give the time taken by the code to execute instead of that it will calculate the worst case or the maximum time that could be taken by the code to execute with help of some constraints.

Let us implement the Big O notation with the codes of Prog1 and Prog2 to find which solution is efficient.

The code written by the Prog1 contains a loop which runs till number N hence the maximum time taken by this code in terms of Big O notation will be O(N). While the code written by the Prog2 does not contain any loop and find the sum of N numbers using the formula that contains the constant time to execute. Hence the time taken by the code of Prog2 in terms of Big O notation is O(1) only.

Hence we can say that the code written by the Prog2 is better than the code written by the Prog1 in terms of time complexity.

Conclusion

In this article, we have discussed the problem arises when we use the performance.now() method in JavaScript to find the efficiency of the code in details with a real life example of two programmers and their code. We have seen the solution to the problem as well and found the efficient solution of problem written by two programmers using that solution.

Updated on: 20-Nov-2023

67 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements