ESP32 Real-Time Dashboard with WebSocket — Lab

Building a real-time sensor dashboard using ESP32 WebSocket server. Live charts in the browser with zero polling — instant updates from sensor to screen.

Architecture

The ESP32 runs both a web server (for the dashboard HTML/JS) and a WebSocket server for real-time data. The browser connects once and receives a continuous stream of sensor readings.

Sensor Setup

Using a BME280 for temperature, humidity, and pressure. The ESP32 reads the sensor every second and broadcasts to all connected WebSocket clients.

Dashboard

A single-page dashboard built with vanilla JavaScript and Chart.js. It connects to the ESP32's WebSocket endpoint and updates charts in real-time. No framework needed — keep it lightweight for the ESP32 to serve.

Power Optimization

For battery-powered setups, the ESP32 can use light sleep between readings and only wake the WiFi radio when clients are connected.