Page weight is a super important metric and affects conversion, retention, and SEO. Actually, it not only costs user engagement — it costs money.
At this moment, Browser Calories is available as a browser extension for Chrome, Firefox and Opera. This may change in the future depending on how the community will react to this project. There's definitely room for a separate web app if people find this useful. Treat this as a "MVP" ;)
Once you install this extension, you'll see a donut icon next to the address bar. Every time you hit that donut, we'll calculate a performance budget based on the tab that is currently open in your browser.
Behind the scenes, a new HTTP request is made and the response is broken down by resource type. Then, we compare the size of each resource with the page weight from top 100 sites.
You can also configure your own budget comparison based on competitors or whatever number you come up with your team.
If you're new to web development, it's easy to get confused with all the tools available out there. In fact, people tend to believe that new tools are only made to replace existing ones, which is not always the case.
Browser Calories was created to do only one thing really simply and really well. It shows page weight and nothing else. Note that this tool does not try to compete with any of the projects mentioned above. Instead, it complements your toolbelt.
If the page you're trying to measure isn't accessible from the public internet or requires some kind of authentication to be accessed, this is not going to work.
The first thing you can do is to share this cute little project with your friends! They will love it and you'll create awareness about web performance optimization. You can also write a review or simply rate this extension on the Chrome Web Store.
Let's make a faster web for everyone \o/