How I browse the Web with uBlock (Hard Mode)
I have been asked quite a few times, whenever I show my browsing setup to people, Why don't you use the web as a normal user?, Well… Isn't it normal to see or read what you actually want, without all the all the crap ads & trackers being shoved down our throat by every site on the web.
Actually, my first choice to browse the web are text based browsers like eww, links, offpunk. chawan is nice too (It is more featureful than the others I mentioned). I use librewolf browser for normal browsing, part of it because I help maintain it for guix but if you want more customized and personal experience you should go with using user.js and profiles.json configuration setups.
Anyway, all it takes is one comment to motivate someone to write something, So with this I want to share how I browse the web with the help of Ublock, Redirector and Localcdn.
Disclaimer: The images in this piece are dithered to reduce bandwidth for the visitors, you can go the original image by clicking on it. Also caption also have sizes of both images.
<caption> <dithered image size> <Original Image size>
Ublock Origin
Ublock origin is the fundamental to my online presence over the Internet, I won't use a browser it without it, period.
It is a Wide Spectrum Content Blocker that means it can not only block ads and tracker but other content on a webpage as well using filters and rules.
Ublock's origin is fully supported only in Firefox and its derivatives, there are some chromium browsers like helium and ungoogled-chromium which still supports MV2 version of Ublock otherwise you will need to use Ublock Origin lite in chrome which I won't touch.
Install it using gnuzilla or sources listed on the its Repo. I would not go into detail explaining each option because that what Ublock's wiki is for that and its everything you need.
Also Pin the extension to the toolbar, you will need it.
Setting Defaults
Open the Ublock dashboard, by opening the Ublock Ui popup (by clicking the settings icon) or doin Ctrl+Shift+A and opening setting from there.
Every pane in the Dashboard have a Book Icon on the top right, you can click on the to go to the related wiki entry for that.
Go to Setting Pane > Check all the four options
- [] Block media elements larger than KB
- [] Block remote fonts
- [] Disable JavaScript
- [] I am an advanced user
Enables Filters
Disable Third Party
Go My Rules Tab
> In Temporary Rules pane, paste this
> Click save
> Click Commit
> The rules will Appear in Permanent Rules
* * 3p block * * 3p-script block * * 3p-frame block
Add Shortcuts
Go to about:addons (Ctrl+Shift+A)
-> Setting Icon
-> Manage Extension Shortcuts
Now visit any site you want, when you open the Ublock Ui popup, you will be able to see what third party a that website connecting to. Its such a super power.
Ublock Hard Mode
What we have done until now is enabled Ublock Hard Mode, Now try visiting some sites that you use daily and see if that breaks or not. We are going to see how to unbreak sites soon.
Dynamic Filtering
By enabling I am an Advanced User, we have enabled Dynamic Filtering, PLEASE READ THAT PAGE!!!
Why I am screaming at you is because this page explains everything you need to get started using Ublock in hard mode, and I don't want to duplicate thing that are already explained really well.
You MUST also read about Filters and Rules as these are the fundamental elements of Ublock Origin.
What we create with Dynamic Filtering are Rules but all the custom list we imported are Filters, You can create your own filters as well. SyntaxMeaningsThatAreActuallyHumanReadable is a very nice resource on Filters Syntax. Filters are static and need to be compiled before ahead of time, so it take more memory.
You can take a look at differences between different filtering types to see their advantage and disadvantages.
See the Overview of uBlock's network filtering engine to see how a request in handled.
What is going behind my browser?
Now comes a the thing every curious user would like to see, What is actually going behind a site?.
That's what the Ublock Logger is for, Open it via clicking on extention and choosing the logger option or through shortcut (Ctrl+Y).
Here you can see what's actually going on, what request, image, font is blocked, what is allowed, what is being requested in realtime. This is very useful in unbreaking the site by enabling just what is need to function the sibe by seeing the logs.
You can also filter, search, reload and open the toolbar by clcking the Ublock icon, It is really helpful.
When you click on a element a popup will open below, it contains three tabs:
Details
This contains various details about the request.
Rules
This shows the rule of the selected element.
Static Filter
Through This pane you can create static Filter, this allows very granual filtering of the elements.
DOM Inspector
Ublock logger also comes with its own DOM Inpector which helps in creation of cosmetics filters, You can access it by clicking the </> icon. It will also show an overlay over the things you have created filter for, It is really helpful overall.
How to Unbreak Things?
Now we are ready to Unbreak the things we need. We already know the tools now. I will be honest with you, I have very rarely have to unbreak a site as most of sites I use just works fine with things disabled.
My workflow is kinda like this:
-> Go to a url -> Somethning doesn't work -> Open the Ublock Ui popup -> Use Dynamic Url Filtering
So Over the years, I have gained enough knowledge about the things that usually unbreaks a site, you most of the times I don't even need to open the logger, If something still breaks:
-> Open the logger -> Reload page -> See what's the site is Requesting -> Allow needed things
So yeah that's it. I am also mentioning two other things are also helpful but I haven't had need to use them yet.
Firewall Filter
Through this you only see what's blocked in a page and that really helps to just allow the things we need. Check the wiki to see how to use it.
Dynamic URL Filtering
Another thing we can do via logger is Dynamic URL Filtering, it takes precedence overy Dynamic Filtering and Filters. It provides even more granule fil
Redirector
Redirector is an extension I use to redirect url using wildcard or regex patterns mostly to alternative private front-ends to services like youtube, reddit, imgur, twitter in case I need to open them. I really love this extension as you can apply the redirects to almost every part of the browser. I even read a book on regex because I wanted to use this extension.
Here is what a example rule looks like:
I would like to say I will be forever grateful to Einar Egilsson who passed away in 2022, RIP Einar.
Localcdn
So, in most of the cases, when you have to unbreak a site, you have to mostly enable CDNs and localcdn extension emulates CDNs so you don't have to make a request to those resources, From its homepage, It intercepts traffic, finds supported resources locally, and injects them into the environment.
To this date, I blocked 7,199 no of requests to CDNs, damn.
What's the point of All this?
In the time where every second website is trying to exploit you, Government making absurd rules in the name of children. The point is your privacy, security, freedom, ability to tinker, to actually know what's going on behind the scene and that to me is everything.
Thanks to all the people to encouraged and helped (@tusharhero) me write this piece.
Until next time…