Rebuilding Pocket Portfolio: From MVP to Momentum (Next.js 14 + Firebase + Edge)

#fintech #nextjs #edge #architecture

⚡ TL;DR: We moved Pocket Portfolio to Next.js 14 + Firebase v10 + Edge to make reliability (“never 0.00”), fast cold starts, and simpler DX the default.

🧭 Why rebuild?

We promised users that:

Prices should never degrade to 0.00
Profit/Loss should be explainable and reproducible
Fallbacks should be visible, not silent

But our old MVP had:

Serverful APIs with inconsistent latency
Duplicated auth/session logic
Hard-to-debug cold starts

So we rebuilt — on Next.js 14 Route Handlers, Edge Runtime, and Firebase v10 — to simplify, speed up, and scale out.

🏗️ New architecture (high-level)

Next.js 14 Route Handlers → /api endpoints
React Server Components (RSC) for dashboards (less JS over the wire)
Edge runtime for quote + health endpoints → low p95 latency, regional caching
Firebase v10 handles Auth, Firestore, Storage; Functions only where needed

Flow (in words):

Browser → Next.js Edge (Route Handlers) → Quote Providers (Yahoo, Chart, Stooq) → Health Store (Upstash Redis or in-memory) → Firestore (user data).

A CDN cache fronts Edge endpoints for instant fetches.

📊 What changed (numbers)

Metric	Before	After (Edge)	Δ
TTFB (dashboard)	—	↓ 31%	🚀
First quote p95 (EU)	~650 ms	< 450 ms	⚡
Cold start (health)	~600 ms	near-zero	🌍

🧩 Code crumbs

Edge endpoint:

  export const runtime = 'edge';
  export async function GET() { … }

UI:
RSC for portfolio lists + a small client island for live updates.
Health widget:
See Previous Week - (the “Never 0.00” pipeline).

🚦 Rollout guardrails

Canary release via custom header flag
Feature switch in the UI
Smoke tests for Yahoo + Stooq reachability
Observability: RAG badges 🟢🟠🔴 in UI + /api/health-price JSON endpoint

🔗 Links

🌐 Web: pocketportfolio.app
💻 Repo: github.com/PocketPortfolio/Financialprofilenetwork
🧠 Docs: docs.pocketportfolio.app (coming soon)

🧡 About Pocket Portfolio

Pocket Portfolio is an open-source fintech tracker that helps you make better investment decisions — together.
Built with Next.js 14, Firebase v10, and Edge, it’s designed to stay fast, transparent, and community-driven.

Follow the journey: