Hertz Frequency of Function

JavaScriptJavaScriptBeginner
Practice Now

This tutorial is from open-source community. Access the source code

Introduction

In this lab, we will dive into measuring the performance of JavaScript functions using the concept of Hertz frequency. We will learn how to use the performance.now() method to calculate the time elapsed executing a function and how to determine the number of cycles per second. Through practical examples and exercises, we will explore the differences in performance between different implementations of the same function.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/AdvancedConceptsGroup(["`Advanced Concepts`"]) javascript/BasicConceptsGroup -.-> javascript/variables("`Variables`") javascript/BasicConceptsGroup -.-> javascript/data_types("`Data Types`") javascript/BasicConceptsGroup -.-> javascript/arith_ops("`Arithmetic Operators`") javascript/BasicConceptsGroup -.-> javascript/comp_ops("`Comparison Operators`") javascript/BasicConceptsGroup -.-> javascript/loops("`Loops`") javascript/BasicConceptsGroup -.-> javascript/array_methods("`Array Methods`") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("`Higher-Order Functions`") subgraph Lab Skills javascript/variables -.-> lab-28385{{"`Hertz Frequency of Function`"}} javascript/data_types -.-> lab-28385{{"`Hertz Frequency of Function`"}} javascript/arith_ops -.-> lab-28385{{"`Hertz Frequency of Function`"}} javascript/comp_ops -.-> lab-28385{{"`Hertz Frequency of Function`"}} javascript/loops -.-> lab-28385{{"`Hertz Frequency of Function`"}} javascript/array_methods -.-> lab-28385{{"`Hertz Frequency of Function`"}} javascript/higher_funcs -.-> lab-28385{{"`Hertz Frequency of Function`"}} end

Function Frequency Calculation

To measure the frequency of a function execution per second (hz/hertz), use the hz function. You can do this by following these steps:

  1. Open the Terminal/SSH and type node to start practicing coding.
  2. Use performance.now() to get the difference in milliseconds before and after the iteration loop to calculate the time elapsed executing the function iterations times.
  3. Convert milliseconds to seconds and divide it by the time elapsed to return the number of cycles per second.
  4. If you want to use the default of 100 iterations, omit the second argument, iterations.
const hz = (fn, iterations = 100) => {
  const before = performance.now();
  for (let i = 0; i < iterations; i++) fn();
  return (1000 * iterations) / (performance.now() - before);
};

Here's an example of using the hz function to compare the performance of two functions that calculate the sum of an array of 10,000 numbers:

const numbers = Array(10000)
  .fill()
  .map((_, i) => i);

const sumReduce = () => numbers.reduce((acc, n) => acc + n, 0);
const sumForLoop = () => {
  let sum = 0;
  for (let i = 0; i < numbers.length; i++) sum += numbers[i];
  return sum;
};

Math.round(hz(sumReduce)); // 572
Math.round(hz(sumForLoop)); // 4784

In this example, sumReduce is faster than sumForLoop because it has a lower frequency of function execution.

Summary

Congratulations! You have completed the Hertz Frequency of Function lab. You can practice more labs in LabEx to improve your skills.

Other JavaScript Tutorials you may like