EcoAssist: Embedding Sustainability into AI-Assisted Frontend Development

TL;DR

EcoAssist is an IDE-integrated tool that analyzes AI-generated frontend code for energy consumption, providing targeted optimizations to reduce digital emissions while maintaining developer productivity.

Contribution

It introduces EcoAssist, the first energy-aware AI coding assistant for frontend development that estimates energy footprint and offers actionable energy-saving suggestions.

Findings

EcoAssist reduced website energy consumption by 13-16%.

Developers' awareness of energy use increased with EcoAssist.

Energy optimization did not compromise developer productivity.

Abstract

Frontend code, replicated across millions of page views, consumes significant energy and contributes directly to digital emissions. Yet current AI coding assistants, such as GitHub Copilot and Amazon CodeWhisperer, emphasize developer speed and convenience, with energy impact not yet a primary focus. At the same time, existing energy-focused guidelines and metrics have seen limited adoption among practitioners, leaving a gap between research and everyday coding practice. To address this gap, we introduce EcoAssist, an energy-aware assistant integrated into an IDE that analyzes AI-generated frontend code, estimates its energy footprint, and proposes targeted optimizations. We evaluated EcoAssist through benchmarks of 500 websites and a controlled study with 20 developers. Results show that EcoAssist reduced per-website energy by 13-16% on average, increased developers' awareness of energy use, and maintained developer productivity. This work demonstrates how energy considerations can be embedded directly into AI-assisted coding workflows, supporting developers as they engage with energy implications through actionable feedback.