Carbon Footprint Extension

A Chrome browser extension that depicts carbon footprint and energy usage left by the user when they surf the internet.

Comment

💡Inspiration

While reading an article on Online Carbon Footprints, I came across the idea of creating an application that would record the data exchange from a user's network and show them the Carbon footprint they left while they surfed the internet. I came across the concept of page weight and instants gratified the idea of calculating the emissions caused using it.

🧰What it does

The main motive of our application is to show the user the amount of CO2 they have emitted and the amount of energy they've used while using their internet browser. Our application is quite simple, it is a chrome extension which displays the footprint, duration and data exchanged. It also has a button that opens up a dashboard with a detailed information on the footprints that you left. The extension works by monitoring the page weight of the websites the user visits and calculating the carbon emissions associated with loading each page. The total carbon emissions for each session or for a user's browsing history could then be displayed in the extension's user interface. This information could help users understand the environmental impact of their browsing habits and encourage them to adopt more sustainable behaviors, such as reducing their data usage or using more energy-efficient devices.

⚙ How we built it

JavaScript was the primary tool utilized to construct this project, where the Chrome API was leveraged to retrieve network details from the browser console. The project's user interface was predominantly developed using HTML, CSS and Tailwind.

🚩Challenges we ran into

The backend implementation of the project presented a challenge due to the strict privacy and security policies enforced by both the Chrome browser and the extension. These policies limited our ability to access certain resources and execute certain types of JavaScript code in the background. Consequently, we had to devise several workarounds and strategies to overcome these obstacles and successfully complete the project, particularly in relation to managing the page weight.

🏁 Accomplishments that we're proud of

In order to make the backend work, we had to utilize deprecated tools that were no longer officially supported. Due to the extremely limited support and references available for the Chrome API, which meant that we had to rely solely on the provided documentation. Despite this challenge, we were able to leverage our expertise in backend development and gain a deeper understanding of the technology involved.

📝What we learned

In particular, we learned how to deconstruct and understand complex systems and processes, which allowed us to effectively manipulate data and extract the required information. We also became proficient in using the Chrome library to fetch request information and work with the data obtained. It enabled us to effectively visualize and analyze the data collected. All of these skills were critical to our ability to effectively manage page weight and ensure optimal user experience.

☘ What's next for Carbon Footprint Extension

Our team has an ambitious plan to enhance our extension by incorporating a recommendation engine that utilizes advanced machine learning algorithms such as Clustering and Deep Learning. The recommendation engine will analyze page weights and provide suggestions for alternative websites that offer a similar user experience with lower carbon emissions. Additionally, we plan to introduce a function that takes into account the type of content on a web page, such as static media (e.g. video and images), instead of treating the entire page as a single entity when calculating page weight. This will provide a more comprehensive understanding of the environmental impact of a particular webpage, allowing users to make more informed decisions. Furthermore, we aim to encourage sustainable development practices amongst web developers. To this end, our extension can be used to help developers create more eco-friendly web applications by providing information on page weight and carbon emissions during the development process. Overall, our goal is to make the internet a more sustainable place, and we believe that our extension has the potential to make a meaningful contribution towards achieving this goal.

Built With

Share this project:

Updates