Monday, February 23, 2015

Talk to my Agent

Do you know which web browser you are using right now? I hope so.

Do you know which web browser the users of your site are using right now?  You should.

There are people who track global market share of different web browsers and provide that data to the public, so you can know that 58% of the world is using Internet Explorer, for example.

Maybe the most well known is Net Market Share.

But I'm talking about just your users. Are you tracking the browsers being used by the people who are visiting and using the application for which you are responsible? It is valuable data that can be used for both planning and debugging purposes.

For amphibian.com, I collect the User-Agent strings from the browsers that visit the site. The User-Agent is a bit of text that all browsers send to the servers with each request. It doesn't identify you personally, but it does tell the server the product name and version (like Chrome 40) and the layout engine name and version.

If you want to see what your browser says it is, just go to http://whatsmyuseragent.com/ and it will tell you.

What are some of these?
The problem is that these strings have gotten out of hand. They almost always start with "Mozilla." Both Chrome and Internet Explorer both do this, and they couldn't be more different. Firefox should theoretically be the only browser that could claim Mozilla heritage, but there are obviously no rules. Web developers have no right to complain though, since they caused it. When people started blocking access to web sites based on which browser was requesting the access (remember things like "This site only works in Netscape Navigator"), the browser manufacturers responded by putting "Mozilla" in every agent string.

Have a look at this site if you want to see a rather exhaustive list of possible agents: Zytrax.com Browser IDs.

Given the absurd amount of similarity and variety possible in User-Agent strings, it's best to find a tool to help you process them. Since Amphibian.com is a JavaScript-based Node application, I use UAParser.js, a very convenient parser module. It can be used both on the back-end, like I do, and in the browser if you need to parse the agent string client-side.

Usage is simple.

var parser = new UAParser();
var r = parser.setUA("some user-agent string").getResult();

console.log(r.browser.name);    // "Chrome", "Firefox", etc.
console.log(r.browser.version); // the complete version, like 40.0.2214.115
console.log(r.browser.major);   // just the version whole number, like 40
console.log(r.os.name);         // "Windows", "Linux", etc.
console.log(r.os.version);      // 95, ME, 7, 8, etc.
console.log(r.engine.name);     // "WebKit", "Gecko", etc.
console.log(r.engine.version);  // something like 537.36

After creating the UAParser object, get an object that represents the result of a parse by calling setUA and passing in a string. The result object contains a nicely organized breakdown of the agent. Easy!

Why don't you take your user agent over to my comic now and see what the frogs are up to today?

Amphibian.com comic for 23 February 2015