Maximize browsing experience with Tree Style Tab
As a programmer, I use google, a LOT. 50% of my normal development flow usually spent mostly on googling and browsing stuff. Multiple tabs to browse more solution is required, and allow me to get more information. This means, increasing browsing effectivity will also increase my development time and ease browsing experience too, which is really important to save time, and reduce hassle.
Why this helps me a lot ?
When using the top tab bar, first 5–10 tab would be OK. But after 10 tab — based on your screen resolution — the tab will collide with each other, eating their own space, aaaand you’ll eventually ended up like this :
So, I started to browse on some plugin, on Firefox — because comfortable with it, and I still love my RAM — and found an interesting plugin called Tree Style Tab.
What this tab do is basically move all of your tab, from the top bar, and rearrange it into tree-like structure to browser sidebar. It uses the same sidebar as browser bookmark. The only caveats of using this plugin is that it will eat about 100–200px of screen side, which I’m okay with.
The result, I got my tabs now arranged neatly on the side. One time I even got to around 120 tabs at one time (not opened at the same time, only preloaded from closing and opening the browser), with only showing 10–15 parent and each has child tab.
After applying the plugin, it will look more-less like this :
Looking good right ? But wait, there’s more.
After applying this plugin, now you gotta have 2 tabs, the Tree Style Tab plugin, and the top bar tab. And hey, why don’t get rid of this as well ?
And I run into this tutorial article from Aenon, which basically removes the top bar entirely by overriding the browser styling with a userChrome.css file config as follow :
/* hides the native tabs */
#TabsToolbar {
visibility: collapse;
}
/* leaves space for the window buttons */
#nav-bar {
margin-top: -24px;
margin-right: 74px;
margin-bottom: -4px;
}I applied this plugin, do some configs, and now my browser is looking like this :
To quit, just press Alt+f4. I’m not using the panel that often anyway, so extra pixel on top definitely useful.
That’s it! Looking good huh ? Let me know what you think, and whether you have any additional ideas below! Thanks !