Nepse-Trade
Interactive stock market analysis and simulated paper trading dashboard for the Nepal Stock Exchange (NEPSE) with historical price charting and portfolio tracking.
What challenges was this built to solve?
Modern web applications require high reliability and minimal resource consumption. In high-frequency operational tools, unmanaged memory accumulation and uncoordinated asynchronous events quickly cause dropped frames, state corruption, and user frustration.
Technical Architecture
Engineered a modular, performant system leveraging Next.js App Router and TypeScript. Integrated normalized cache layers with responsive UI feedback loops to ensure sub-millisecond interaction responses.
Engineering Bottlenecks Overcome
Why These Technologies?
Zustand + React Query vs Redux
Zustand manages ephemeral, client-only UI states (such as active modals, audio nodes, and draft filters) with minimal boilerplate. React Query handles all asynchronous remote cache invalidation and server reconciliation.
Next.js App Router & Server Components
Kept heavy database and serialization logic on the server to minimize client bundle payloads. Client components are strictly restricted to interactive boundaries (audio players, filters, form inputs).
Strict Zod Schemas
Shared type contracts between client form validation and backend route handlers eliminate duplicate logic and guarantee typed safety across runtime boundaries.
Virtualized DOM Lists
Windowing renders only what is visible within the viewport, ensuring continuous 60fps scrolling even when threads reach 10,000+ messages.
Impact & Verification
Successfully deployed with sub-100ms latency, zero layout shifts, and responsive touch controls across mobile and desktop. [TODO: Production conversion lift benchmarks pending full customer rollout].