While searching for an extension to help me block time-wasting websites, my frustration peaked.
There are many extensions in the Chrome Web Store, but sadly, most are connected to a service. The problem isn’t that they are paid; most offer a free plan.
The issue is that these services do not need to have a centralized entity. Our browsers have tons of features that facilitate creating feature-rich, persistent blockers.
So, I did what any other programming-inclined person would do: I built my own. The extension, Somebody Stop Me!, is very simple. It has a configuration pop-up that allows you to:
- Block the currently viewed website,
- Add a website to the blocked list, and
- Enable or disable the entire extension without purging the saved list.
Blocking a website, for example, facebook.com, will automatically block typical variants, such as www.facebook.com and sub-paths like facebook.com/foo/bar.
Cheat Mode
I am trying to be pragmatic. I want to block YouTube to avoid wasting time, but sometimes it is the only place where you can get content needed for a project. That’s the official explanation. Less officially: we sometimes want to have a cheat day.
To accomplish that, you get a big, fat button to unblock a website for five minutes.
Currently, the block will not be reinstated if the website is open. For example, YouTube does not always reload the full website when you open a new video. It also does not work with Single Page Applications. This will definitely be improved in future versions.
The Code?
This is my first foray into Chrome Extensions. There are some things I am not particularly proud of. Once cleaned up, it will be shared via Git.
Browser feature
I mentioned powerful browser features, so which am I using here?
Firstly, storage. Chrome and Chromium-derived browsers, such as Microsoft Edge and Vivaldi, offer four built-in storage options:
- Local: Local Storage is a web storage API that allows you to store data persistently in a user’s browser. The data stored in Local Storage has no expiration date and remains available even after the browser window is closed. We don’t want to use it; more on this later.
- Session: Similar to Local Storage, but it will not survive a browser restart. This extension uses this class of storage for temporary exceptions, such as your cheat mode.
- Sync: A storage option that acts like Local Storage, as it survives restarts, but is also synced across your devices if you have this feature enabled in your browser. This is a super neat feature, and this extension uses it as the primary storage.
- Managed: This storage area is used for storing managed preferences that are configured by enterprise policies. It allows administrators to set policies that control the behavior of extensions in a managed environment. I will explore this storage in future iterations as a way of implementing parental controls, which will prevent kids from overriding the rules.
Okay, enough about storage.
When it comes to filtering, the API is a bit more contentious. Google has recently gutted uBlock Origin after moving to Manifest V3. The changes impacted filtering capabilities, and the all-powerful Web Request API is gone.
But while uBlock Origin has to filter a huge number of websites, malware, and trackers, you will probably want to block only a handful of time-wasting websites. With that, we can rely on the built-in chrome.declarativeNetRequest API, which allows us to define priority-based redirects for websites you want to block.
And that’s it. Built-in storage, filtering API, a bit of glue code, plus a whacky icon, and the extension is born.
Give it a try. It is free of charge and free of trackers.
