Contact

Memoization in JavaScript

Memoization in JavaScript

What is Memoization

In programming, memoization is an optimization technique that can be used to make application faster by saving previously calculated results into the cache and retrieving that same result from the cache the next time when it needed instead of calculating it again.
In simple words, to memoize a function in JavaScript, you need to store the results of that function in a cache. The cache can be an object with the arguments as keys and results as values. When you call this function, first it checks whether the result is present in the cache before running. If it is present in the cache, it returns results from the cache Otherwise, it executes.

Importance of Memoization

It is optimization technique that increase the performance by caching the result of function execution. It saves the previous result and Whenever programs need that result it retrieves from the cache. This reduces the execution time and increase the function performance.
How Memoization works
The concept of memorization is based mostly on two ideas. They are as follows:
  • Closures - Closure is a function that access its lexical scope even executed outside of its lexical scope.
  • Higher order functions - A Higher order function is a regular function that takes one or more functions as arguments and/or returns a function as its output.
A Simple Example:

Consider this function. The function takes in an argument and returns its square.

To run the function, call it with a number like this:

With 5 as the argument, square() will run fast. If you calculate the square of 5000000, there would be a noticeable delay. Now, if you were to call the function multiple times and pass 5000000, you would experience a delay in each call. Using Memoization you can eliminate this delay.

 

 

 

 

 

 

 

 

 

 

 

Output:

 

 

 

 

 

 

  • In this example, the function checks whether its calculated result before, by checking if it exists in the cache object. If it has it returns the already calculated value.
  • When the function receives a new number, it calculates a new value and stores the results in the cache before it returns.
  • This example explains how memoization work to improve the performance of a program.
  • Memoize only pure functions. When pure function called it always returns the same value. If a function is impure, it returns different values whenever executed. In this case caching such values in result unexpected return values.

In general JavaScript object, there are two common ways to check whether a key exists in an object or not using in operator and hasOwnProperty method.

Conclusion:

  • The process of memorizing becomes more manageable when you turn it into key-value pairs. A simple object is created, checked for existing values matching user input, and newly created key-value pairs are stored if they don’t exist already.
  • Storing all data means that we’re going to be using memory. It is best to implement memoization on pure functions and heavy computing functions, repetitive calculations.
Reference:  https://www.freecodecamp.org/news/memoization-in-javascript-and-react/