EcoPulse

Completed

EcoPulse is a web-based tool that analyzes a website's environmental impact by estimating its carbon footprint, energy consumption, and resource usage, along with a detailed resource breakdown (HTML, CSS, JavaScript, images, fonts, third-party assets).

Most websites are built without considering their environmental cost. EcoPulse helps developers and businesses measure digital carbon emissions, identify resource-heavy components, and make informed decisions to build greener, more efficient websites.

Next.jsTypeScriptTailwind CSSMongoDBPuppeteer
View on GitHubView Live Demo

🎯 Problem It Solves

The internet is responsible for approximately 3.7% of global carbon emissions. Most developers don't consider the environmental impact of their websites. EcoPulse addresses this by: • Calculating estimated CO2 emissions per page view • Measuring total page weight and resource distribution • Identifying optimization opportunities for reducing carbon footprint • Providing actionable recommendations for greener websites

✨ Key Features

  • Instant carbon footprint estimation
  • Detailed resource breakdown (HTML, CSS, JS, images, fonts)
  • Third-party script analysis
  • Performance optimization suggestions
  • Historical analysis tracking
  • Industry benchmark comparisons

🏗️ Architecture

Single-page application with serverless backend: **Frontend** (Next.js + TypeScript) - URL input and analysis request handling - Interactive charts for resource breakdown - Comparison with industry benchmarks **Analysis Engine** (Puppeteer + Custom Metrics) - Full page load simulation - Network request interception and analysis - Resource categorization (HTML, CSS, JS, images, fonts) **Database** (MongoDB Atlas) - Analysis history storage - Aggregate statistics for benchmarking **Carbon Calculation** - Based on data transfer and server location - Incorporates energy grid carbon intensity - Uses established methodology from digital carbon research

📚 Key Learnings

  • 1Web performance analysis at scale with Puppeteer
  • 2Understanding website resource loading patterns
  • 3Carbon footprint calculation methodology for digital products
  • 4Building intuitive data visualization dashboards
  • 5MongoDB aggregation pipelines for analytics
Back to Projects