Git Product home page Git Product logo

abhishek-x / web-carbon Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 2.96 MB

WebCarbon is a Chrome extension, designed for tracking and calculating the CO2e emissions from your daily browsing, offering a real-time audit of your digital carbon footprint.

Home Page: https://github.com/abhishek-x/web-carbon

JavaScript 56.60% HTML 16.53% CSS 26.88%
chrome-extension co2-emissions co2-footprint css html javascript local-storage

web-carbon's Introduction

Logo

WebCarbon

With every web page generating 1.76g of carbon emissions, the cumulative effect of our online activities becomes a significant environmental concern. it's an energy-hungry colossus, consuming over 416.2 TWh annuallyβ€”surpassing the entire electricity consumption of the United Kingdom.

WebCarbon is a Chrome Browser extension, designed for tracking and calculating the CO2e emissions from your daily browsing, offering a real-time audit of your digital carbon footprint.

UI

🌐 Table of Contents

πŸ“œ Background

The inspiration for this project lies in a realization that the Internet's carbon footprint rivals that of the global aviation industry. Data centres, transmission networks, and the billions of devices we use are steadily guzzling electricity, primarily sourced from fossil fuels.

This project hopes to spark conversations about the sustainability of the internet and the steps we can take to reduce our online carbon footprint. With data on energy consumption by websites, users can more informed decisions by understanding the real weight of their online activities in carbon emissions and be part of a solution that aims for a greener internet.

Because the internet shouldn't cost the earth.

πŸš€ Features

  1. Tracks ⏱️ real-time CO2e emissions from daily web browsing.
  2. Displays a 30-day graph πŸ“Š of your browsing emissions.
  3. Offers an annual CO2e emission forecast 🌧️ using average carbon emissions data (till date).
  4. Compares annual emissions to an equivalent number of flights πŸ›«.
  5. Suggest the number of trees 🌴 to plant to offset emissions.

🏁 Getting Started

Prerequisites

Installation & Configuration

  1. Clone the Repo
    git clone https://github.com/abhishek-x/web-carbon.git

  2. Go to the Extensions page by entering chrome://extensions in a new tab or, click the Chrome menu, hover over More Tools, then select Extensions.

  3. Enable Developer Mode by clicking the toggle switch next to Developer mode.

  4. Unpack Extension by clicking the Load unpacked button and selecting the extension directory. Load Unpacked

  5. Pin this Extension (Optional): Pin your extension to the toolbar to quickly access your extension. Pin Extension

🎈 Usage

  • Browse the web as usual, and the extension will track the energy consumption of each website visited.
  • Access WebCarbon by clicking on the extension icon in the Chrome browser toolbar.

πŸ“ Algorithms Used

  1. Daily Carbon Emission Calculation: This calculates the carbon emissions for the current day by multiplying the number of pages viewed today (dayCount) by the average carbon emissions per page view (carbonPerPage).

    todayCarbon = dayCount * carbonPerPage

  2. Average Daily Carbon Emission and Annual Forecast: This calculates the average daily carbon emissions based on past data (sum of emissions over days) and then projects it to an annual scale.

    average daily carbon: avgDay = sum / days

    annual forecast: annualEmission = avgDay * 365

  3. Comparison to Flights and Trees Required: This compares the annual forecasted emissions to the equivalent number of flights between Paris and London (flight) and calculates the number of trees required to offset the annual emissions (treesNeeded).

    flightsEquivalent = annualEmission / flight

    treesNeeded = annualEmission / trees

    The sum variable aggregates the total carbon for the days counted, and days keep track of the number of days with more than zero emissions.

⛏️ Built Using

HTML, CSS, JavaScript, LocalStorage API, Chrome Manifest V2

πŸ—ΊοΈ Improvements

  1. Migrate extension from Manifest V2 to Manifest V3.
  2. Publish WebCarbon extension on Chrome Web Store.

πŸ‘₯ Contributors


Abhishek Aggarwal

web-carbon's People

Contributors

abhishek-x avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.