Blog
Performance
18 de febrero de 20268 min

-80% de egreso de Supabase gracias a un caché inteligente

Despertar brutal al ver mi panel de control de Supabase. El egreso aumentaba mucho más rápido que mi número de usuarios. Cada vez que se abría la aplicación, se disparaban decenas de solicitudes.

El diagnóstico: N+1 y datos sin cambios

Primer culpable: las ViewStats. 20 tareas mostradas = 20 solicitudes individuales. Segundo culpable: datos recargados completamente en cada navegación, incluso si nada había cambiado.

ContentCacheService

Caché de dos niveles: L1 (Map en memoria, acceso instantáneo) y L2 (AsyncStorage, persiste en los reinicios). El flujo: L1 → L2 → Supabase → almacenar en L1 y L2.

Supabase Realtime

Dos canales (content-cache-tasks y content-cache-memos) que invalidan la caché cuando los datos cambian. Los componentes de React se vuelven a renderizar con los nuevos datos, sin solicitudes adicionales.

Batch ViewStats

getTaskViewStatsBatch(taskIds) recupera las estadísticas de 20 tareas en una sola solicitud en lugar de 20.

El impacto

El egreso se redujo entre un 80 y un 90%. La ventaja: la aplicación es perceptiblemente más rápida. El feed se muestra instantáneamente desde la caché. Optimizar los costos y optimizar la UX, a menudo es el mismo trabajo.