¿Qué son las optimistic updates?

Después de desarrollar durante más de un año con react hoy me he decidido a intentar entender la razón de ser de la librería redux, que promete ayudar al mantenimiento y manipulación del estado de una aplicación frontend. Nunca he tenido la necesidad de usarla y sé que ha llevado consigo bastante controversia porqué en general se percibía como una herramienta que tenías que incluir en tus proyectos sí o sí, percepción que ha sido refutada incluso por su creador @dan_abramov, el cual os recomiendo seguir.

Aunque podría escribir largo y tendido sobre esta librería, sobre cuando es idóneo usarla y cuando sale más a cuenta usar alternativas más ligeras como la nueva API Context de React o Mobx, hoy quiero definir un concepto que he encontrado en la explicación de la motivación que llevó al autor a crear la librería, las optimistic updates.

 

As developers, we are expected to handle optimistic updates, server-side rendering, fetching data before performing route transitions, and so on.

 

Es un término que me llamó la atención más o menos de la misma forma que tree-shaking, aunque es más fácil de entender ya que conscientemente o no, si has desarrollado una aplicación frontend en cualquier plataforma, mientras hagas peticiones a un servidor, has decidido hacer actualizaciones optimistas o pesimistas a tus vistas.

Actualizaciones optimistas

Pongamos que estamos ante una aplicación para ver memes que cuenta con un componente para votar positivamente o negativamente una publicación, cuando el usuario pulsa sobre la flecha de votar, ¿cómo tiene qué reaccionar la UI? Seguro que casi todo el mundo coincidirá en algo parecido a:

  1. Tiene que cambiar el color del icono pulsado, flecha arriba o flecha abajo
  2. Si hay un contador de votos positivos, tendrá que incrementarse o decrementarse en concordancia

Y ahora viene la pregunta del millón, esa actualización de UI, ¿la vas a hacer de manera optimista o pesimista?

Si eres optimista, no vas a esperar a que el servidor te diga que la petición de la votación se ha procesado de manera correcta. Al tener toda la información necesaria en el cliente (el icono que cambiará de color, y el contador que se incrementará o decrementará), puedes hacer la actualización de la UI tan pronto cómo el usuario pulsa el icono.

Si eres pesimista, que a mi parecer es lo que se ha ido haciendo en general históricamente, esperas a que el servidor conteste y actualizas la UI luego, aunque sea mostrando un error.

A priori, me parece que las actualizaciones optimistas me van a llevar más trabajo al tener que controlar qué ha pasado con la petición al servidor y tener que revertir cambios la UI (algo en lo que redux ayuda mucho) o tener que hacer una cola de peticiones a reintentar. No obstante, entiendo que dan una mejor respuesta a las acciones del usuario, mejorando así la experiencia del usuario y siendo útiles sobretodo en aplicaciones que pueden estar trabajando o no en offline. 

¿Te ha gustado el artículo? ¿Quieres que te avise de mis próximas publicaciones?

¿Quieres seguir aprendiendo?

Spread Operator y Objetos en JavaScript

¡Hola! Bueno ya lo sabéis, hoy toca aprender a usar el spread operator con objetos. En este vídeo casi no voy a mencionar la teoría del spread operator, ya que lo hice en el anterior, así que si no lo has visto es pr...

Seguir leyendo