Using jQuery 2.0 and supporting IE 8?

jQuery 2 has been released and the most talked about addition is actually the removal of a feature.  Notably, support for Internet Explorer versions 6, 7 and 8.  The jQuery blog notes that Android 2.x browsers are the next on the chopping block.  You may think that the new features in jQuery 2.0 would have to be substantial to encourage developers to use it and leave IE 8 behind, but at this point the APIs of jQuery 1.9 and 2.0 are identical.  In other words, they provide the exact same set of features, they just support different browsers.  In addition, both the 1.x and 2.x versions of jQuery will continue to be supported side-by-side for the foreseeable future.  jQuery 1.10 is will be released in the coming months with bug fixes from the 2.0 cycle.

The only noted benefit of the change to jQuery 2.0 is a decrease in size of the JavaScript file from 93kb to 83kb.  Some developers may see this change as negligible and continue to use jQuery 1.9, where those who support systems with much higher traffic may see a benefit in the reduced file size.  Why choose when you can serve the larger file to the browsers that need it and save the bandwidth for those that do not?

How To

Through the use of conditional comments, a site can use jQuery 1.9 to support just the IE 8 and lower users, and use jQuery 2.0 for all others, taking full advantage of the bandwidth savings when possible.  Conditional comments are commonly used to create IE-only stylesheets for those pesky quirks that only seem to occur in Internet Explorer.  However, there is nothing preventing them from being used for JavaScript as well.  See the following code example:

<!--[if lt IE 9]><!-->
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!--<![endif]-->
<!--[if gte IE 9]><!-->
<script src="http://code.jquery.com/jquery-2.0.0.min.js"></script>
<!--<![endif]-->

The first line checks to see if the requesting browser is lower than IE 9.  If it is, then we load jQuery 1.9.  The second line checks if it is greater than or equal to IE 9.  If it is, then we load jQuery 2.0.  Since the 1.9 and 2.0 APIs are identical, the rest of the calls to jQuery on the page will work properly with no additional changes required.  Take note that there are some additional comment tags included to make these checks visible to non-IE browsers such as Chrome or Firefox.

Conclusion

Many developers considered jQuery’s support for a wide range of browsers to be a significant benefit for choosing it over other alternatives.  Often a project’s targeted audience or the client themselves will determine what browsers need to be supported, leaving the developer out of the decision entirely.  With the newest version shifting from that support, the door may be left open for a competitor product to gain usage in the developer community.  At this point, there is no cause for alarm since the jQuery 1.x line will continue to be supported in the future.  However, if jQuery 2.0 begins to add features that are not available in 1, developers may demand a version of jQuery 2 with support for older browsers, or just move on to something new.  Only time will tell.

About these ads

3 thoughts on “Using jQuery 2.0 and supporting IE 8?

  1. If you don’t want to load jQuery twice for other browsers than IE use this code:

    
    
    
    <!--
    
    
    <!--
    
    
    <!--
    
    

    IE 10 doesn’t support these “IE comments”, then the last condition will be executed

  2. Hey, could You edit my previous comment, because my code for loading jQuery vanished… Below I put the code to and

     tags. Maybe this will work :D Thanks
    
    
    
    
    
    <!--
    
    
    <!--
    
    
    <!--
    
    

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s