Today’s ship: Mock-Trade Lab, 5-min CSV Import, and bulletproof Price Fallbacks

Leader posted Originally published at dev.to 2 min read

Today’s ship: Mock-Trade Lab, 5-min CSV Import, and bulletproof Price Fallbacks

We’re building Pocket Portfolio in the open. Today we shipped three slices that make the app instantly useful.

1) Mock-Trade & Scenario Lab (live)

What: Add/remove positions, tweak size/price, and watch totals update — without touching real P/L.
Why it matters: sanity-check ideas (hedges, rebalance, scale-in) before committing. It’s the “are we sure?” layer.

Try it: open the app → Add Mock Trade → e.g., TSLA +2 @ 260.
App → https://www.pocketportfolio.app/app?utm_source=coderlegion&utm_medium=guest&utm_campaign=todays_ship


2) 5-minute CSV import (with samples + error report)

What: Drag-drop a broker CSV; we normalize it and show a clean portfolio. Includes sample CSVs and Download error report if a row fails.
Why it matters: no broker hookups, no paywalls — just get your data in and move.

How to test quickly: Menu → Import CSV → use a sample (eToro / Coinbase / Generic).
If a row trips, download the error CSV and paste a redacted line in an issue — we’ll add the mapping.

Repo → https://github.com/PocketPortfolio/Financialprofilenetwork?utm_source=coderlegion&utm_medium=guest&utm_campaign=todays_ship


3) Resilient price fallbacks (equities, FX, crypto)

What: Client→edge design with provider rotation + caching. If one endpoint blinks, we fail over.
Why it matters: fewer “0.00” moments, snappier updates, more trustworthy P/L.

No settings required — it just works across stocks, FX, and crypto.


Small technical notes

  • Scenario isolation: mock trades are tagged and kept out of real totals.
  • Edge functions: quote fallbacks and cache control live at the edge; client stays fast.
  • A11y/UX: import flow has clear state + error CSV, and we’re adding shortcut keys next.

Contribute (good first issues)

  • CSV mapping for a new broker format
  • Playwright tests for error-CSV → fix → success
  • Price fallback telemetry (simple counters, no PII)
  • Small UI polish on the Mock-Trade modal

Repo → https://github.com/PocketPortfolio/Financialprofilenetwork?utm_source=coderlegion&utm_medium=guest&utm_campaign=todays_ship


Try it now

https://www.pocketportfolio.app/app?utm_source=coderlegion&utm_medium=guest&utm_campaign=todays_ship

Got stuck importing? Open an issue with one redacted row; we’ll map it quickly.

If you read this far, tweet to the author to show them you care. Tweet a Thanks

Great update with practical improvements to Pocket Portfolio, especially the mock-trade lab and quick CSV import. How do you plan to expand the price fallback system to handle larger market data loads in real time?

Thanks, Ben — great point. “Never 0.00” is easy for a handful of symbols; the real work is scale + burstiness. Here’s how we’re extending the fallback system to handle larger, real-time loads without turning into a mini-HFT shop.


Architecture at a glance (client → edge → providers)

  1. Symbol fan-out & coalescing (edge)

    • Each region runs a lightweight coalescer per symbol bucket.
    • Ingest from 2–3 providers (WS + HTTP backup), buffer for 100–250 ms, emit freshest per frame (5–10 Hz max).
    • If no tick in rotateMsrotate provider; if none in staleMs → serve LKG with stale:true.
  2. Snapshot + delta

    • On connect, clients receive a compressed snapshot (last-known price + ts).
    • Then we stream tiny deltas {sym, price, ts, src, stale}. Cheaper, faster, cache-friendlier.
  3. Tiered cache

    • Hot KV (per region) for LKG + last 60–120 s.
    • Cold object store for minute snapshots (optional analytics).
    • Edge functions read KV first; providers only when needed.
  4. Backpressure & quotas

    • Per-client rate cap (e.g., max 5 Hz) + symbol limit per session.
    • Adaptive frames: if fan-out spikes, coalescer steps from 100 → 200 ms automatically (humans can’t read 20 Hz anyway).
  5. Health + circuit breakers

    • We count timeouts/NaNs per provider, per region.
    • When error rate > threshold, open circuit, exclude for cooldownMs, log one concise line (no PII).
  6. Clear UX

    • If stale:true, show a chip: “Last 2.4s • p2 fallback”.
    • If >10s, gray cell + tooltip. We always prefer known-stale to silently wrong.

Tiny edge loop (sketch)

const frameMs = env.FRAME_MS ?? 200;     // coalesce window
const rotateMs = env.ROTATE_MS ?? 1000;  // rotate provider if quiet
const staleMs  = env.STALE_MS  ?? 2000;  // mark stale

const buf = new Map<string, Tick>();     // latest within frame
const lkg = new Map<string, Tick>();     // last-known-good

setInterval(() => {
  const now = Date.now();
  for (const [sym, latest] of buf) {
    const fresh = (now - latest.ts) <= staleMs;
    const out = fresh ? latest : (lkg.get(sym) ?? latest);
    const stale = !fresh;
    pushToClients(sym, { ...out, stale });   // SSE/WS
    lkg.set(sym, out);
    if (!fresh && (now - (lkg.get(sym)?.ts ?? 0)) > rotateMs) rotateProvider(sym);
    buf.delete(sym);
  }
}, frameMs);

Why this scales

  • Real-time in, human-rate out (frame coalescing) keeps fan-out manageable.
  • Snapshot + delta slashes payload size.
  • Regional KV removes cross-region chatter.
  • Deterministic policy (rotate, stale, LKG) makes behavior predictable.

Open questions / collaboration invites

  • Fairness: best strategy to allocate symbol budgets across many tenants?
  • Crypto specifics: per-exchange consolidation vs. VWAP across venues?
  • Compression: worth moving to SSE + zstd for high-symbol dashboards?
  • Observability: minimal counters that actually help tune policy (no log firehose).

If you or anyone wants to riff, I’ll spin up a tiny OSS coalescer + SSE demo we can benchmark together (bring your provider keys). Appreciate the nudge—this is exactly the design pressure we want at this stage.

More Posts

[DISCUSS] The “Never 0.00” Challenge — design a resilient price pipeline (client → edge) together

Pocket Portfolio - Sep 29

CSS Styling Images: From Thumbnails to Polaroids – A Complete Guide

Raj Aryan - Jul 15

Coming Soon: Price Pipeline Health Widget

Pocket Portfolio - Oct 3

Designing a “Never-0.00” Price Pipeline in the Real World

Pocket Portfolio - Oct 1

Differences and stats for screen reader testing.

Laura_a11y - Sep 25
chevron_left