Over a million developers have joined DZone.

Six Reasons Browser Monitoring Matters

If we just all use the latest standards for our webpages life would be great. That's what HTML 5 is all about. We're told we shouldn't worry about the target platform, but the hard truth is sometimes we do need to worry. Here's a quick look at a couple of places where you might place your concerns.

· Performance Zone

Download Forrester’s “Vendor Landscape, Application Performance Management” report that examines the evolving role of APM as a key driver of customer satisfaction and business success, brought to you in partnership with BMC.

Browser monitoring matters. Remember this?


In the later days of Internet Explorer 6 this was a phrase which brought developers much misery.

Not only did we have to work around not having display inline-blocks but you also had to deal with PNG alpha transparency issues.

img {
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(...);

And that doesn’t cover security issues.

Luckily enough there were dedicated individuals whose posts saved many hours of debugging.

Fast forward to the present and now IE 6 is no longer supported; you can be forgiven for thinking Browser Monitoring (knowing which browser a user views your site with) isn’t important anymore. Since we don’t have nearly the same amount of worries.

Well think again!

Browser Monitoring can still save you valuable development time, and thus money.

Which is why today we are going to discuss six reasons Browser Monitoring matters.

Let’s dive in!

1: Use Java, Flash, Silverlight?

In the past if you wanted to add something interactive to your website such as:

  • A Piece of Audio
  • A How-to Video
  • A Game for attracting more users

Then it would have required development using a browser plugin.

Flash, Java, or Silverlight were commonly used for such roles.

These plugins at the time were wonderful since they not only added additional interactive functionality to the web, but they also had cross-browser support.

Which at the time wasn’t something very easily done.

The downside of these plugins are that users had to download the plugins before they could view the content.

Not very nice to someone who just wanted to quickly find a tutorial!

Since the introduction of HTML 5, many of the plugins are now obsolete as the features can be done natively without the user downloading the plugin.

But should you use it?

Well that depends.

Knowing how many users need a plugin to support your functionality will determine the best approach to take…

Whether you’re building a new feature using a HTML 5 with a fallback using a plugin, or the more likely scenario of whether to remove the old plugin dependency (and upgrade a feature using the latest technology instead).

2: Utilizing the Latest CSS

When it comes to creating a stylesheet, some choices, like deciding to change the box model using box-sizing: border-box, have seemingly become a valid (yet trivial) choice since it’s now widely supported.

But not all the latest and greatest CSS features are such as:

  • Calc function
  • Masks
  • 3d transformations
  • Grid layout

Now you wouldn’t need to use these properties in day-to-day development (I know I haven’t) and we have made do without them for years.

But what they offer is a way to create effects without requiring the download of an external image, which in turn reduces the amount a user needs to download.

Or in other cases, a way to create a web page easier, with less markup. And if that brings less div spam, then I’m all for it!

3: Keep Those Polyfills?

Sites are large, complicated beasts, composed of multiple images, fonts, stylesheets, and more.

With all these in mind, it’s easy to forget about just how many scripts are included in a website.

While it may seem trivial, keeping or removing a polyfill (or a no longer needed script) will impact how fast your website loads at least to the initial viewer.

And as a previous post outlines, page speed matters!

4: Upgrading Your Version of jQuery

While the title specifically mentions jQuery, this is more of a reference to that generic library we all have included in a project.

You know the library. The one that adds cross-browser support. The one that fixes browser quirks. The same one that speeds up our development process by providing easy to use APIs.

These libraries—just like our websites—support particular browsers, and so should be upgraded to match the browsers of your users.

It is pointless having fixes for IE 6 when no-one browses your websites on versions less than Internet Explorer 9.

Knowing when you can upgrade to use the latest version of that library brings benefits such as:

  • File size reductions as required browser hacks and polyfills are removed.
  • New features and APIs to speed up development tasks.
  • Speed improvements as faster ways of doing tasks are found.

Not to mention the bug fixes!

5: Browser Monitoring for Mobile Devices

In our world, almost everyone has a mobile device.

Mobile devices allow anyone to browse the web and thus your website

In this age every website should have a mobile alternative, ideally.

But sadly there is only so much time in the day.

Which I totally understand. You get busy working on a new product, or feature, or page for the website, and with a deadline looming there isn’t much time to do much else.

And just because users can browse to your site on a mobile device, doesn’t mean to say they do.

Which is why knowing how many people browse your website on a mobile device helps you when prioritizing tasks.

We aren’t saying that the mobile site doesn’t matter.

Just that tasks that need to be organised depending on the priorities since there is a limited time to do them.

6: Codebase Cleanup

As projects wear on it’s easy to become oblivious to the reductant code that is being kept.

Workarounds, browser hacks, fallbacks for features now widely supported, “one-off” lines to deal with a particular quirk—they build up quicker than expected.

And this is where paying attention to the browsers of your user base can help you out.

Removing needless code for unsupported browsers not only reduces the file-size, but helps increase the maintainability of the codebase.

Which in turn can help out new developers first being introduced to your codebase.

To Summarise

Browsers have come a long way, with less compatibility issues, more standardisation, new features, and faster release times in latter years.

But sadly not all of users have the knowledge, or the ability to update their browsers to make use of these new features.

Which is why Browser Monitoring is important and will continue to be important in the future.

To help us make informed choices about what we are going, or should, do.

That way you can ensure all your visitors get the most out of your site.

See Forrester’s Report, “Vendor Landscape, Application Performance Management” to identify the right vendor to help IT deliver better service at a lower cost, brought to you in partnership with BMC.

browser detection,monitoring,jquery

Published at DZone with permission of Ben Harding, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

The best of DZone straight to your inbox.

Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}