Improved visualization of EthProofs Website with pie charts and filters!
Ethproofs is a public block execution proof explorer for Ethereum that aggregates data from multiple zkVMs (Zero-Knowledge Virtual Machines) in real time. Key Features:
DISCLAIMER: I've only im`roved a bit the visualization, I DID NOT created EthProofs webiste
Tech Stack Implementation:
Ethproofs uses Next.js 15 with App Router, combining Server Components for direct database queries via Drizzle ORM and API Routes for client-side data fetching. React Query (TanStack Query) handles client-side caching and polling every 50ms for real-time updates, while Supabase real-time subscriptions listen for database changes and invalidate the React Query cache. Drizzle ORM provides type-safe queries with automatic TypeScript inference from the schema, and PostgreSQL (via Supabase) stores all data with Row Level Security policies. The visualization layer uses Recharts for pie charts showing proof status distribution per block, Framer Motion for smooth layout animations, and Radix UI components styled with Tailwind CSS for an accessible, responsive interface. This hybrid architecture enables server-side data fetching for performance, real-time updates via Supabase subscriptions, polling as a fallback, and end-to-end type safety from database to UI.

