¿Cómo piensas la diferencia entre estado de servidor y estado de cliente en una aplicación frontend?

El estado de servidor son datos que no te pertenecen: viven en una base de datos, pueden estar desactualizados en el instante en que llegan y necesitan caché, revalidación, reintentos y deduplicación. El estado de cliente son datos que sí te pertenecen, como qué pestaña está abierta o qué se ha escrito en un formulario, y es síncrono y siempre correcto. Trátalos distinto: una caché de consultas para el estado de servidor, estado local del componente o un pequeño store para el estado de cliente.

El estado de servidor es una copia cacheada de algo que no controlo. Llega de forma asíncrona, puede estar desactualizado, dos componentes pueden quererlo a la vez y necesita revalidación, reintentos y deduplicación. El estado de cliente es mío: el acordeón abierto, el borrador de un formulario, el filtro seleccionado antes de aplicarlo. Es síncrono y nunca está desactualizado. En cuanto empecé a tratarlos como problemas distintos, desapareció un montón de código. Los datos de servidor van a una caché de consultas indexada por sus parámetros, que se ocupa de los estados de carga y error, deduplica peticiones concurrentes y vuelve a pedir al recuperar el foco. El estado de cliente se queda como estado local del componente hasta que más de un componente lo necesita, y solo entonces se mueve a un pequeño store compartido. El síntoma de hacerlo mal es muy reconocible: un store global lleno de entidades, booleanos de carga escritos a mano en cada pantalla y un bug donde dos componentes piden el mismo usuario y no se ponen de acuerdo. He mantenido esa aplicación y no la volvería a construir así.