Ease HTML5 Web Development with jQuery, Knockout, and Modernizr Libraries

HTML5 has opened the door to a significant number of new features and capabilities in the browser. Unfortunately, those capabilities vary from version to version, and developers must consider browsers that aren't HTML5 compatible. It’s really too much for one developer to handle, and being productive in the today's web development world means using frameworks and libraries. So which development frameworks and libraries should you use? The most ubiquitous library for web development, at least in the Microsoft space, is the jQuery library. Today, jQuery has evolved into the jQuery Core and jQuery UI versions. In jQuery Core, key JavaScript techniques, such as traversing a web document’s objects, handling events, and even directly coding AJAX, are simplified with this library. Microsoft has also contributed to the jQuery library and includes the library with many of its latest web technologies.

jQuery UI is useful for handling effects and widgets for the browser's UI. Built on top of jQuery Core, jQuery UI works with CSS to create theme frameworks for a consistent UI across all of your pages, as well as handling animations, shading, and other more advanced effects.

But the most important aspect of jQuery is that it works equally well across all major browsers, even Internet Explorer (IE). And that’s the hard part of today's web development—there are so many different browsers (with new versions are released every few months) and trying to keep up with the changing capabilities of today's browsers will make you crazy. Utilizing jQuery for document traversal means that you don’t have to deal with the changes caused by future browser versions. Instead, you can download the latest version of jQuery and deploy it with your application.

Knockout is a JavaScript library that plays a similar role to jQuery, but for declarative data binding. Clean-coded data access in web pages is a constant challenge and using a framework can greatly simplify the process, as well as dealing with future changes. And, similar to jQuery, Knockout handles all the different browsers that developers care about.

Although jQuery and Knockout take advantage of HTML5, these libraries aren’t specifically focused on HTML5, and today’s web developers want to exploit the latest and greatest in HTML5. But what do you do about users with an older browser? This is where libraries such as Modernizr and CSS PIE come in.

Modernizr uses a technique called polyfills that lets you write code that exploits new HTML5 features, such as Location classes. The code degrades gracefully with older browsers that don't have HTML5 functionalities. CSS PIE helps level the playing field of CSS implementation across different versions of IE. You can code for IE 9 and let CSS PIE deal with the older versions of IE.

There are many more libraries out there to help you be productive in this complex world of web development; these four libraries that I've described are only a few. It’s well worth your time to look for help rather than solve all web development problems yourself.