¡Ven a la JSConf España 2026! Comprar entradas

Quitar la persistencia de favoritos al cerrar sesión

En aplicaciones con estado global es muy común persistir información como favoritos, carrito o preferencias del usuario. El problema aparece cuando un usuario cierra sesión y ese estado sigue vivo, provocando inconsistencias o incluso errores de seguridad.

En esta clase vamos a ver cómo y cuándo limpiar el estado persistido, centrándonos en el caso concreto de los favoritos.

El problema de la persistencia

Si usas una store global con persistencia, es posible que ocurra esto:

  • El usuario inicia sesión.
  • Marca varios favoritos.
  • Cierra sesión.
  • El estado de favoritos sigue existiendo.
  • Otro usuario entra y ve datos que no le pertenecen.

Esto pasa porque cerrar sesión no implica automáticamente resetear el estado en memoria.

Primera solución: limpiar el estado al hacer logout

Una solución directa es limpiar explícitamente los favoritos cuando el usuario cierra sesión.

Por ejemplo, en tu store de favoritos puedes añadir una acción como:

clearFavorites: () => set({ favorites: [] })

Y luego, en el flujo de logout:

logout()
clearFavorites()

De esta forma te aseguras de que el estado queda limpio al cerrar sesión.

Refrescar la página al cerrar sesión

Aunque pueda sonar agresivo, refrescar la página al hacer logout es una práctica muy común y recomendable.

Ventajas

  • Limpia todo el estado en memoria.
  • Evita estados intermedios difíciles de controlar.
  • Reduce bugs complejos en apps grandes.

Muchas aplicaciones prefieren esta estrategia porque es simple, segura y efectiva.

Resetear la store al estado inicial

Cuando la store empieza a crecer y tiene múltiples propiedades, limpiar campo a campo deja de ser viable.

En ese caso, lo mejor es volver al estado inicial completo.

Algunas librerías de estado permiten acceder al estado inicial de la store y restaurarlo directamente:

set(getInitialState())

Esto garantiza que:

  • El estado vuelve exactamente a su forma original.
  • No dependes de conocer todos los campos actuales.
  • Evitas errores si la store evoluciona en el futuro.

Por qué esta solución escala mejor

Limpiar manualmente funciona cuando el estado es simple, pero en cuanto tienes algo como:

{
  user,
  favorites,
  cart,
  settings,
  counters,
  flags,
}

La única solución robusta es resetear todo al estado inicial.

Así te aseguras de que:

  • No quedan restos de estado.
  • No introduces bugs al añadir nuevas propiedades.
  • El logout es consistente en toda la aplicación.

Conclusión

Al trabajar con estado global persistido:

  • Cerrar sesión no es suficiente.
  • Hay que limpiar el estado explícitamente.
  • Refrescar la página es una opción válida y recomendable.
  • Resetear la store al estado inicial es la solución más escalable.

Un logout bien implementado evita muchos problemas futuros y hace tu aplicación más segura y predecible.

¡Esto es todo para Zustand! Ahora nos toca pasar al Backend y Node.js. ¡Vamos!