Web design blog

Browser detection and feature detection: a brief survey of libraries and techniques.

Modernizr

modernizr.com

“Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser.”

Taking Advantage of HTML5 and CSS3 with Modernizr

has.js

has.js – “Pure feature detection library, a la carte style.”

Feature Detection with has.js

Detector

Detector is a simple, PHP- and JavaScript-based browser- and feature-detection library that can adapt to new devices & browsers on its own without the need to pull from a central database of browser information.

Stack Overflow pages

Plenty of lively discussion — as usual — at Stack Overflow:

JavaScript: Detecting browser library function – does one exist?

JavaScript libraries to detect browser capabilities/plug-ins

Library to detect and parse browser information

Browser detection versus feature detection

How do I redirect my client to a different page according to their browser?

Need a good JS browser detection library but not JQuery

Further reading

Browser detection in JavaScript libraries

detectmobilebrowsers.com

Detecting HTML5 Features

Browser and Feature Detection

Feature Detection: State of the Art Browser Scripting

Server-Side Device Detection: History, Benefits And How-To

Template engines for rendering data into HTML in the browser using JavaScript:

• Google Closure Template
• EJS
• jQuery.EJS
• dust
• Handlebars
• Pure
• JavaScript Template Engine Compare
• The client-side templating throwdown: mustache, handlebars, dust.js, and more

Adapt.js is a JavaScript library (or framework) that helps you design web sites for mobile devices:

For many developers that means using @media queries to selectively target the device screen size and orientation through CSS.

While the @media approach is a good one, it won’t work for every site. That’s why Nathan Smith, creator of the 960 Grid System, has released Adapt.js, a lightweight JavaScript library (894 bytes minified) that allows you to specify a list of stylesheets and the screen sizes for which they should be loaded. Essentially Adapt.js does the work of @media, but will work in any browser, even those that don’t understand @media.

… While using JavaScript to load CSS might seem a bit strange, even if you use @media queries you’re still going to need some kind of polyfill (usually JavaScript-based) to handle those browsers that don’t know what to do with @media rules.

— Scott Gilbertson @ Webmonkey