How to determine the capabilities of the browser?

Question

From all the reading I did, I realized that using the user-agent string is not recommended, as it can be faked. Devices may be difficult, etc.

I also realized that the best option is to test the capabilities of the browser.

How do I make it? I mean, is there some kind of standard feature test that I could do, something like this: detecting objects ?

Another problem is that, would this not include some overhead every time a user accesses the site? I know that I can counter this using some cookies.

Please do not suggest using a third-party plugin / framework like jQuery.

Answer 1

Modernizr is a library that detects a discovery function. You can use the library as it is, and then query it for the functions you want, or you can see how it works for certain functions that you want to detect and copy into your own code.

How you discover a function for a given function depends entirely on the particular function.

Actual function detection is usually pretty quick (maybe even faster than extracting / saving something in a cookie). In addition, it is best for you to perform a function detection function every time a user updates to a new version of his browser whose capabilities are changing.

For example, if you want to know if you can use the .forEach () method for an Array object, you can simply use this:

if ( Array.prototype.forEach ) { // enter code here } 

Answer 2

Here is the MSDN magazine article that talks about this topic: Without a browser on the left: HTML5 Adoption Strategy .

They mention that they use the framework, but you can use the methods explained without it.