Over the last two years I've de-goggled my life more and more. Search was replaced with DuckDuckGo. Gmail with Fastmail. Google Maps with Apple Maps. (Next up: Replace Google Photos)
In spring 2020, I switched from Google Chrome to Firefox as my primary web development browser.
In this post I would like to highlight the tools used to replicate features I was missing from Chrome, why I like their devtools and why I will stick with Firefox for the foreseeable future.
Start up speed#
The first thing I noticed after switching, is how fast Firefox starts. In 2-3 seconds the browser is ready to go. (This is true after many months and not just at the start of using it.)
Chrome however, takes a minute to render the main window. Restoring a previous session then again takes another minute.
I've read that Chrome is working hard on fixing this and that a future release should improve boot performance. Hope they can make this happen.
Replacing Chrome's Profiles feature#
Chrome has a neat "profiles"-feature. I use this to keep bookmarks, browser-history and extensions separated between work and personal.
Firefox has a profiles too, but doesn't come with a native profile switcher similar to Chrome.
One method is to visit about:profiles and select the desired profile.
The way I do it now is by using MultiFirefox. Originally developed in 2006, the tool allows me to choose a profile and Firefox version to run. It even remembers my previous choices.
CSS Devtools#
Most of my time is spent writing backend code in PHP. To debug and analyse my apps I'm using Clockwork and its accompanying Firefox extension. (Nothing that Chrome wouldn't do.)
When working on the frontend, most of the time is spent designing UIs or websites with Tailwind CSS and adding interactivity with Vue.js.
For the work in CSS I really enjoy working with the Firefox devtools. They have famous good support for CSS grid and flexbox. With a click of a button I can see the outlines of the CSS grid I'm working on or see the flexbox boundaries.
Checkout this playground page to learn more on how to work with CSS grid with the Firefox devtools.
When a JavaScript issue pops up, the JavaScript debugger works really well for me. But I have to be honest: I didn't use it that much in the past 10 months. 🤷
The one issue I had in the past year in regards to the JavaScript devtools, is that Firefox can't properly warn me, if an infinite loop or huge memory leak is happening in my JavaScript code.
I remember, that while implementing a third party library in our app, the browser regularly froze, as an infinite loop was generated by said third party library.
The Firefox process had to be killed through the Activity Monitor. Meanwhile, Chrome detected the problem and halted the execution of the JavaScript code. (I haven't tested, if this is still a problem in Firefox. There's a good chance that a recent update fixed this.)
Chrome has it's place#
Eventhough I don't miss any particular feature from Chrome, I occasionaly will have to use it.
At my job I work with teams that rely on the Google Marketing Suite (Analytics, Tagmanager, Optimize, Data Studio).
One product, Google Optimize, needs to verifiy that your site works before starting an A/B test.
As Google Optimize is a Google product, it forces you to use Google Chrome to make that verification. The required extension is only available in the Chrome webstore and not for Firefox. 🙄
And, of course, I will still use Chrome to do browser testing. Even in 2021 there are still small differences between browsers on how they render CSS or execute JavaScript.
Sticking with Firefox#
I made the switch between Chrome and Firefox a couple of times over the years, but this time it stuck.
As you realised by now, the differences between the browsers are marginal.
But the speed differences are soo noticeable to me, that I will keep using Firefox as my main development browser for the forseeable future.
It's great to use a product, that isn't controlled by one of the biggest internet companies on the planet. (But the Mozilla Corporation has it's own problems).
I've you haven't used it in a while, give it a try.
Top comments (0)