La memoización en JavaScript. Optimiza el rendimiento de tus funciones

El Closure de JavaScript: qué es y cómo funciona
El Closure de JavaScript: qué es y cómo funciona
30 de mayo de 2023
Los Arrays en JavaScript. Cómo trabajar con listas
Los Arrays en JavaScript. Cómo trabajar con listas
13 de junio de 2023
El Closure de JavaScript: qué es y cómo funciona
El Closure de JavaScript: qué es y cómo funciona
30 de mayo de 2023
Los Arrays en JavaScript. Cómo trabajar con listas
Los Arrays en JavaScript. Cómo trabajar con listas
13 de junio de 2023

La memoización en JavaScript, más bien dicho, en general, es una técnica de optimización utilizada en programación para reducir la cantidad de cálculos repetitivos en una función y así mejorar el rendimiento de ésta.

En JavaScript, esto puede ser particularmente útil en funciones que son costosas en orden de cómputo o que se ejecutan con frecuencia (como las funciones recursivas. Ej: Fibonacci).

En este artículo, abordaré la memoización, cómo funciona, puntos negativos y cómo puedes implementarla en tu código JavaScript.

¿Qué es la memoización?

La memoización o memoization en inglés, es una técnica de optimización que consiste en guardar el resultado de la ejecución de una función que ha sido llamada previamente en caché y devolver este resultado almacenado si la función es llamada de nuevo con los mismos parámetros.

En otras palabras, en lugar de volver a hacer el calculo cada vez que se llama con los mismos parámetros, se almacena el resultado en una variable y se devuelve este resultado almacenado si se llama de nuevo con los mismos parámetros.

¿Por qué es importante la memoización?

Es importante conocer esta técnica ya que mejora el rendimiento de las funciones cuando son llamas con los mismos parámetros varias veces en el tiempo de ejecución de la aplicación. De esta forma, reducimos el número de cálculos repetitivos, y podemos mejorar el rendimiento y la eficiencia de la aplicación.

¿Cómo funciona la memoización en JavaScript?

En JavaScript se puede implementar utilizando una función que encapsula la función original. Esta función envolvente es responsable también de almacenar los resultados de la función original en caché y de devolver los resultados almacenados si la función original es llamada de nuevo con los mismos parámetros.

Un ejemplo claro es la función recursiva de Fibonacci. Partimos de la siguiente función recursiva:

var fibonacci = function(n) {
     return n < 2 ? n : fibonacci(n-1) + fibonacci(n-2);
}

Si nosotros quisieramos calcular Fibonacci de número del 0 al 10 ambos inclusive, haríamos:

for (var i = 0; i<=10; i++) {
     console.log('Fib(' + i + ') = ' + fibonacci(i);
}

Como resultado del bucle anterior, llamamos 11 veces a la función fibonacci, pero ésta, y aquí viene lo importante, se llama a si misma más de 400 veces. Si multiplica y verás. Como te podrás imaginar, aquí tenemos una oportunidad de mejorar en cuanto a performance de nuestra aplicación, y lo vamos a hacer con memoización.

Resolvamos el mismo problema utilizando esta técnica de optimización:

var fibonacci = (function () {
     var memo = [0,1]; // resultados del caso base Fibonacci
     var fib = function(n) {
          var result = memo[n]; // vamos a comprobar si ya se llamo fib con el valor n
          if (typeof result !== 'number') { // Si no es number, es que no se ha llamado previamente
               result = fib(n-1) + fib(n-2); // Calculamos
               memo[n] = result; // Cacheamos
          }
          return result; // Devolvemos el resultado
     };
     return fib; // Devolvemos la función
}()); // Fíjate que estamos ejecutando la función con ()

La función anterior resuelve el mismo problema, pero cada vez que lo resuelve, almacena el resultado en la variable memo por lo que cuando se vuelve a llamar no tiene que ejecutarse de nuevo. Como resultado de aplicar esta técnica tenemos que en lugar de llamarse más de 400 veces, ahora solo se llama solo 29 veces.

Puntos negativos

Esta ténica tiene principalmente dos puntos negativos. El primero, es obvio que estamos aumentando la cantidad de momeoria utilizada ya que tenemos que cachear los resultados previamente calculados. El segundo punto, y esto es una opinión personal, aumenta la complejidad del código, por lo que su mantenibilidad es más complicada.

Tendremos que hacer balance de lo que ganamos ahorrando potencia de calculo contra el aumento de memoria (que en los tiempos que corren tal vez esto ya no sea un problema en esta situación) y complejidad.

Conclusión

La memoización en JavaScript es una técnica de optimización muy útil para reducir la cantidad de cálculos repetitivos en una función y mejorar el rendimiento y la eficiencia de nuestra aplicación. Si estás trabajando con funciones costosas computacionalmente o que se ejecutan con frecuencia, la memoización puede mejorar significativamente el rendimiento y la velocidad de tu aplicación.

Puedes aprender más en nuestra sección de Programación, Desarrollo Web o en la sección específica de JavaScript.

¡Espero que te haya sido de utilidad!

Antonio J. Galisteo
Antonio J. Galisteo
Soy Antonio J. Galisteo. Ingeniero de software con amplia experiencia en desarrollo frontend, backend, aplicaciones móviles y de escritorio.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

La memoización en JavaScript. Optimiza el rendimiento de tus funciones
Este sitio web usa cookies para mejorar tu experiencia. Al navegar por este sitio aceptas nuestra Política de Protección de Datos.
Leer más