The new Firefox 4 is out and I installed it now that most of my extensions work. There are a couple of things that I noticed:
- It looks very much like Chrome with the tabs on top and the context menu placing “Open in New Tab” in the pole position.
- The page loading icon is sometimes two different icons.
The latter is the one things that has been fascinating me for the entire day. So much so that I even recorded my screen to record the action. Normally, the page loading icon spins and spins and spins and you are happy when you finally get to the page, the flash movie etc. It usually spins clockwise. However, sometimes the page loading icon in Firefox spins counter clockwise. And on top of that, the graphics is a different one.
Now the big question is: Why? I’d love to hear a good explanation for these two different graphics. Is it essentially a different process, is it a bug that hasn’t been fixed, is it a feature to show a different loading process?
This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.
Penny Leach
I think the two spinning icons represent making the http connection (which includes the dns look up etc) and then downloading the content of the page. But I could be wrong 🙂
Plausible explanation, Penny. Thanx.
I’m sure Penny is correct – in fact on my Firefox 4, when the counterclockwise animation appears, the word ‘Connecting’ is displayed in the tab title. When the server starts to provide a response the animation starts spinning the other way. In theory when the server provides the initial headers (in particular the Content-length header) the browser can start to estimate how long the whole page will take to download. So I think the initial animation is really just saying “I’m waiting and have no idea how long it might take”.
Thanks for your explanations. Then the only remaining question is why the first one spins counter clockwise and the second one clockwise. Why not make both clockwise? Is there a different process involved for the “connecting” one that requires the counter clockwise spinning?
The reason for the change of direction is to make it easier for your eye to discern the difference in state.
Kristina,
I believe this two-icon idea appeared with Google’s Chrome browser (but maybe they got it from somewhere else, like Opera). And, yes, there are two processes involved. The first process is “Connecting.” This involves a certain amount of unknown parameters, which cannot be estimated. The second process is “downloading,” which is a lot more measurable.
While your browser is “connecting,” your computer does a lot of things, including: (1) looking up a DNS server (kinda like a big online address book), which it then (2) asks for the IP address of the website (for example, “mozilla.org” really means “63.245.209.11”), then (3) trying to establish a connection with that IP address.
After the connection is established, your browser asks for the content from the remote server. That’s all the other stuff in the URL. (For this page, it’s “/curious/2011/03/26/firefox-4-counter-clockwise/”) The server generally responds, “Hey, I found it, and it’s X bytes long.” (However, if the server can’t find it, you get the familiar “404 Not Found” error.)
Once your browser has the “X bytes long” number, it can start calculating the time to completion, as it downloads. It also begins spinning the icon in the other direction.
Personally, I find the two icon thing a good visual indicator of the health of my internet connection. If I get the first spinner for a long time, I know that something is giving my connection trouble. If I get the second spinner for a long time, that just means (a) it’s a big file or (b) it’s coming from a slow or overloaded server.
I need to inject a bit of clarification to my last post.
At this point, the server has the request, and it may take a while to formulate a response. During this time, your browser will still show the “connecting” icon. Usually, this doesn’t take much time, but sometimes it does take the server a while to find (or create) a response.
Hello John,
Thank you very much for your explanation. Now I better understand the different processes involved. It’s just fascinating that both don’t spin into the same direction. Is it to draw attention to the processes involved?
Best I can figure is that the FF team was following the lead of the Google Chrome team. In Google Chrome, it’s the same icon, but the direction is opposite for each phase. Since the FF icon is different for each phase, it could indeed spin the same direction.
Alternatively, perhaps there is some emerging de-facto standard that “Connecting is counter-clockwise” and “Receiving is clockwise.” I haven’t seen anyone voice this idea yet, though.
Yes, you are right. Chrome also has two different icons. They are more subtle, and thus I hadn’t noticed before.