Web Dev PSA: Your Favorite Tools Have Been Updated
The last week was a bit of a whirl with many of our favorite tools receiving updates and tweaks.
Usually, I'd save the announcement for our monthly "Recently in Web Development" piece, but considering how much, and how often, we use the tools below, it's only fair that you be informed as quickly as possible.
First on our list is the venerable HTML5 boilerplate, or h5bp to its cushy fans. But what exactly is this 'boilerplate' thingy, you ask?
HTML5 Boilerplate is the professional badass's base HTML/CSS/JS template for a fast, robust and future-safe site.
If you're still lost, I suggest taking a look at this excellent guide by Paul Irish.
If you're like me and need to look at what has changed precisely, you can take a look at the complete changelog here.
Well, the big news is that h5bp has been updated to version three. Here are some of the highlights in this version:
- The build script has now been exported to its own project.
- h5bp has been put on a diet. This version is noticeably smaller in size
- The build system has been forked into a separate project.
- In a touch of whimsy, the design of the 404 page has been improved
It’s a common misconception that Modernizr miraculously upgrades all browsers to allow for HTML5 and CSS3 support. Unfortunately, this isn’t the case. However, instead, it detects support, which provides us with a lot of power!
Version 2.5 ships with a massive set of changes, which you can view here, but here are the important ones.
- More than 60 additional feature detects added.
- html5shiv and yepnope added to core.
- Respond.js removed from core
- A polyfill for Function.prototype.bind is baked in by default.
yepnope is an asynchronous conditional resource loader that's super-fast, and allows you to load only the scripts that your users need.
This nifty resource loader, which is only 1.7KB minified and gzipped, is bundled with Modernizer and is great for loading polyfills, preloading or “priming” the user's cache, or as a simple asynchronous resources loader / filter! You can read up more here.
Your spiffy new HTML5 elements, in all their glory, are impervious to CSS rules in IE. This is where html5shim comes to the rescue. Simply include it in your page’s <head> section and you will be able to style the new HTML5 elements perfectly.
The new versions of html5shiv ship with some radical performance improvements, with some tests running 10 [!] times faster.
html5shiv is built into Modernizr.
As a mobile alternative to h5bp, the mobile boilerplate ships as an intelligent set of defaults for mobile sites and web apps. Version three brings it up to date with the recent versions of Modernizr and closely follows the changes made to its HTML5 counterpart.
Go Check 'em Out!
'nuff said! The staff at Nettuts+ use almost all of these on a daily basis and we think they're worth your time as well.