← Back to home

BetterEthProofs

Improved visualization of EthProofs Website with pie charts and filters!

Problem Statement

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:Real-time proof visualization per block with pie chartsPerformance metrics comparison: cost, latency, proving timeFilters by team, deployment type (cloud/on-premise), and GPU countDownload and verify proofs directly in the browserREST API for integration with other projects Goal: Become the public standard for Ethereum block execution proofs, enabling users to compare different zkVMs and their performance, and facilitating the development of ZK light clients for EthereumDISCLAIMER: I've only im`roved a bit the visualization, I DID NOT created EthProofs webiste

Solution

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.

Hackathon

ETHGlobal Buenos Aires

2025

Contributors