Rancang Bangun Dashboard Web Real-Time Berbasis WebSocket dan MQTT untuk Pemantauan Kualitas Air dengan Fitur Predictive Maintenance - Fabiola Zefanya Anes; Keryn Herlita Pattimahu; Venny V Ponggawa; Edwin Lumunon (TIN: Terapan Informatika Nusantara, 2026)
Conventional water quality monitoring systems face two main obstacles: high data transmission latency caused by HTTP polling mechanisms and the inability to proactively notify operators of sensor conditions before failure occurs. This study presents the design and implementation of an integrated real-time web dashboard that combines Internet of Things (IoT) architecture with a WebSocket-based interface for water quality monitoring and predictive maintenance notifications. An ESP32 microcontroller acquires pH, turbidity, temperature, and TDS parameters and publishes them asynchronously via MQTT protocol to the HiveMQ public broker. A FastAPI backend subscribes to the broker, processes time-series data streams, and broadcasts telemetry and inference status to a React 18 frontend through persistent WebSocket channels. As a supporting inference component, a 1D-CNN model is adopted as a standard classification engine to distinguish Normal, Degraded, and Critical sensor conditions—complementing a TDS-based Rejection Rate formula used as an aggregate filtration performance indicator. System testing shows an average end-to-end latency of 1.38 seconds from sensor acquisition to dashboard rendering, with 1–2 second data reception intervals confirming WebSocket channel reliability. Conditional rendering on the React interface successfully visualizes three dynamic operational status levels based on Rejection Rate values: Fit for Consumption (green, RR 94.8%), Warning (orange, RR 91.6%), and Not Fit for Consumption (red, RR −79.8%). The resulting platform demonstrates that integrating low-latency message brokering with a high-performance asynchronous server can deliver responsive visualization and proactive maintenance notifications without dedicated GPU hardware. The primary contribution of this study is the development of an integrated monitoring dashboard architecture that combines low-latency messaging protocols with a lightweight inference model, thereby enabling real-time preventive maintenance notifications to be executed instantly on an interactive web interface.