feat: finalizing things

[WingsDevelopment]

POC: Next.js Server-Side Cache

Overview

• A cron job periodically triggers
  react-query sdk.vaultMetaService.fetchVerifiedVaults
• The result is cached in memory on the server
• The vaults table always renders from this cached data
• The vault / earn details page:
  • Renders immediately from the cached list
  • Fetches additional, more detailed data on load
  • Updates the fetchVerifiedVaults cache for that specific vault once fresh data arrives

Result:
Even with a long cache TTL (e.g. 1 hour), table data stays fresh over time as users visit vault detail pages or execute transactions.

---

Pros

• Significant RPC cost savings
• Faster initial load and better overall app performance
• Server-side rendering (SSR) for maximum performance
• SEO-friendly DeFi app (first meaningful paint is server-rendered)
• No third-party dependencies – everything lives in the same Next.js app
• Graceful degradation:
  • If RPC or backend is down, users still see cached data
  • Clear messaging can indicate that data may be stale
• Simple implementation:
  • Reusing existing React Query calls
  • No custom cache logic or special handling required

---

Cons

• Potentially stale table data
  (depends on cron frequency and vault popularity)
• Scaling complexity:
  • In-memory cache + serverless environments (e.g. Vercel)
  • Works predictably with Railway or AWS (current setup)
• Slight increase in implementation complexity

---

How the /vaults (table) page works

• Triggers the same
  react-query sdk.vaultMetaService.fetchVerifiedVaults query
• Since the server already fetched and cached it:
  • The query will usually hit the in-memory cache
• If the cache is stale:
  • React Query performs a normal fetch automatically
• In practice, the cache should remain fresh because:
  • The cron job runs more frequently than the cache TTL

---

How the vault / earn details page works

1. Immediately render data from the table cache
2. Trigger sdk.eVaultService.fetchVault to load detailed data
3. Populate remaining fields as data arrives
4. Update the table cache with the newly fetched vault data

---

Best Part

If anything goes wrong with:

• Server-side logic
• In-memory cache
• Cron job

…the app could automatically fall back to direct fetching. (this is not yet implemented, not sure if it would make more sense to actually always display cache even if stale, or do we allow users to try fetch themselves)

This is default React Query behavior — no extra logic or safeguards required. (right now added guard against it, to always serve the cache)