A Site To Behold: Open Content & Design Comes to jQuery

Posted on by

In the past few days and weeks, you’ve probably already noticed the new theme we’ve been rolling out across our websites. In fact, unless this is your very first time looking at the jQuery blog, this very post probably looks a lot different than what you’ve been used to seeing over the past few years. Today, as this new design finally reaches jquery.com, we are very excited to pull back the curtain and explain the work we’ve been doing and how it goes above and beyond the simple “facelift” it may appear to be at first glance.

As the jQuery ecosystem has grown, it’s become increasingly difficult for the jQuery Team to keep our arms wrapped around a burgeoning balloon of documentation, design, CMS installs and wikis. Community members who’ve wanted to report and fix documentation errors have been left with nowhere to take action, and the picture wasn’t much better even for those who did have access. With all this content and design locked away in production environments behind a slew of different user accounts, and nowhere to track bugs, visibility has been low and progress incremental at best. We knew we had to make a change.

Over the past year, we’ve undertaken a massive effort to consolidate and simplify our site infrastructure and open source all of our web site content, documentation, and design. We’ve done this because it has already done wonders for our own ability to collaborate and move forward, and because we hope it will open up new avenues of participation for all of you out there who have wanted to find a way to get involved with jQuery, but have been unsure you could contribute.

So, enough with the platitudes — on to the stack!

git + grunt + WordPress

We’ve moved nearly all of our documentation and site content into static content repositories on GitHub, where they are maintained in HTML, Markdown, or XML, depending on the type of content. Now, if you notice a typo or think something needs clarification, you can file an issue and even send a pull request with a fix. Everything from the source documentation for jQuery.ajax to the front page of jquery.com to the raw Markdown of this new page that includes the full list of content repositories is open source!

The content is brought to life on our websites using WordPress and our custom theme and multi-site configuration, jquery-wp-content. Using this single WordPress instance makes it exponentially easier and more manageable for us to keep the look and feel of all our different sites in sync, and preserves our ability to easily layer on dynamic features like site search and user accounts as we need them. jquery-wp-content also contains a custom installation script that makes it easy to stand up the entire jQuery sites network for local development, opening up the doors for much less conservative experimentation with fixes and new features. Again, all this means that if you notice bugs on any jQuery website, there’s somewhere to report them, and you can even work on the fix yourself if you want!

(We’ve received an incredible amount of help creating and maintaining jquery-wp-content from WordPress developers Andrew Nacin and Daryl Koopersmith, and we’d be remiss if we didn’t thank them right here for all their hard work!)

The link between WordPress and the static content repositories is a grunt build and deployment process that processes the content files and synchronizes them into a WordPress installation using XML-RPC. That means we don’t ever use the WordPress Administration pages; all authoring and editing just happens in your favorite text editor, then grunt does the hard work.

In order to deploy to our production and staging servers, we simply use git webhooks to respond to commits on the content repositories and jquery-wp-content. Whenever a commit lands on the master branch of these repositories, the content and design is reflected immediately in the staging environment, which is just the URL of the website with a stage. subdomain prefix, e.g., stage.jquery.com. To deploy to the production sites, all that’s necessary is tagging with a semver and pushing the tag.

New Sites

In addition to today’s new look for the blog and jquery.com, we’re happy to unveil some brand new sites that are all powered by this system, which you should find especially useful if you’re looking to find ways to get involved with with jQuery.

Contribute to jQuery

URL: contribute.jquery.org | Repo: github.com/jquery/contribute.jquery.org
Our new hub for information on how to actually get started with contributing to jQuery and open source in general. It’s also full of useful resources for contributors, like our CLA form and style guides used across all of our projects.

jQuery IRC Center

URL: irc.jquery.org | Repo: github.com/jquery/irc.jquery.org
The jQuery Foundation uses Internet Relay Chat extensively for support and project communication. This is where we host the logs from our channels and keep documentation about how you can get connected and what to expect when you get there.

jQuery Brand Guidelines

URL: brand.jquery.org | Repo: github.com/jquery/brand.jquery.org
As we’ve recently freshened up a lot of the conventions we’re using for representing jQuery, we’ve also published these guidelines so that the community can have a better understanding of how they can — and can’t — use the names and marks of jQuery Foundation projects.

Sunrise, Sunset

We’ll also be saying goodbye to some subdomains in the next few weeks, and we wanted to give you a heads up, so you can prepare if necessary.

docs.jquery.com

Our original MediaWiki documentation-and-catch-all site has served admirably over the years, but it is time to put it out to pasture. We’ll continue to redirect the popular URLs on this site to their more modern counterparts.

meetups.jquery.com

Hosting our own meetup network was an interesting experiment, but the site gets almost no usage and is cumbersome for us to continue to manage, so we will be shutting it down. We recommend organizers use other, more established platforms such as meetup.com.


In addition to the new sites we’ve just launched, we’ll be continuing to roll out other new sites and integrate more of our existing sites into with the new theme over the coming days and weeks. We’re really happy with how it’s working so far, and look forward to continuing to improve the sites — perhaps with your help! As always, if you have trouble with any of this, please file issues, join us in the #jquery-content channel on freenode, or send an e-mail to content at jquery dot com.

jQuery 1.9 final, jQuery 2.0 beta, Migrate final released

Posted on by

Are you sitting down? Well sit down, in front of your computer, and start downloading. We have several new jQuery releases for you to test. For your convenience, jQuery can even be downloaded while standing.

First up are the final versions of jQuery 1.9 and jQuery Migrate 1.0. We think these releases are pretty solid, because very few of you reported any problems in the beta versions. Just be sure to read the information in the jQuery 1.9 upgrade guide so that your transition will be smoother.

Next, take out your sunglasses. Today you get a glimpse at the future, and it’s bright. jQuery 2.0 is in beta test! We know it’s a lot to take in, so let’s recap the positioning for jQuery 1.9 and 2.0:

  • jQuery 1.9 and 2.0 have the same API. Several deprecated features such as $.browser have been removed from both versions. It’s all laid out in the jQuery 1.9 upgrade guide.
  • jQuery 1.9 runs on Internet Explorer 6, 7, and 8 (“oldIE”), just like previous versions. Consider it a cleaner, slimmer, modern-API upgrade from jQuery 1.8.
  • jQuery 2.0 will not run on oldIE. As a result of removing several layers of barnacle-encrusted code, it will be both faster and smaller than jQuery 1.9.
  • The team is supporting both jQuery 1.9 and 2.0 into the future. You choose which version you want to use based on your needs.

The jQuery Migrate plugin can be used with either 1.9 or 2.0 to detect deprecated and removed features, or to restore old features for those sticky situations where you need old code to run with new jQuery. The plugin and the messages it generates are documented in the project README.

If you’re on a recent version of jQuery core and have been avoiding deprecated features, these new jQuery releases may work for your code right out of the box. (Just remember, jQuery 2.0 doesn’t work on IE 6, 7, or 8!) Still, we recommend that you always start by including the jQuery Migrate plugin to see if it gives you any warnings.

The jQuery 1.9 final files are available on jQuery’s CDN, and should be available on the Google and Microsoft CDNs within a few days:

<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script>

Or, for testing jQuery 2.0 beta 1, use the jQuery CDN:

<script src="http://code.jquery.com/jquery-2.0.0b1.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script>

For diagnostic purposes, you can also include the jQuery Migrate plugin with versions of jQuery all the way back to 1.6.4 to see what changes may cause issues with your code when you finally upgrade.

No matter which version of jQuery you use with the plugin, be sure to open the browser’s console to see what warnings or errors are being generated. Warnings given by the plugin start with the word “JQMIGRATE” and are listed in the plugin’s documentation. The description explains why the warning was given and how it can be fixed.

What’s New in 1.9

It may be a few weeks before the complete documentation for this release lands at api.jquery.com, especially since the API and other documentation sites are in the process of their own upgrade. For now, here’s a summary of what’s new and changed.

Streamlined API: Many deprecated and dubious features have been removed, as documented in the upgrade guide.

New .css() multi-property getter: Now you can pass .css() an array of CSS property names and it will return an object with the current values of all those CSS properties:

var dims = $("#box").css([ "width", "height", "backgroundColor" ]);
//  { width: "10px", height: "20px", backgroundColor: "#D00DAD" }

Enhanced cross-browser CSS3 support: jQuery 1.9 now supports the following CSS3 selectors across all browsers, all the way back to IE6: :nth-last-child, :nth-of-type, :nth-last-of-type, :first-of-type, :last-of-type, :only-of-type, :target, :root, and :lang.

New .finish() method: This method can be used to immediately complete all the animations queued on an element. The jQuery 1.9 RC1 blog post has more information and an example.

Source map support: You can now run the minified version of jQuery but use source maps for debugging. This can be extremely valuable for tracking down problems on a production web site. See the jQuery 1.9 RC1 blog post for a full description.

Many, many bug fixes: We’re especially proud of what we hope will be the final set of fixes for obscure issues in IE 6, 7, and 8. See the changelog below for a complete inventory.

Getting started with 2.0

Since jQuery 2.0 has its foundation in the work for jQuery 1.9, all the discussion in the upgrade guide also applies to 2.0. The Migrate plugin will identify many of these issues for you automatically.

If you’re using jQuery in non-web-site HTML situations such as an Android, iOS, or Windows 8 app, or a Chrome/Firefox add-on, jQuery 2.0 is an awesome choice. You can even use jQuery 2.0 on web sites if you don’t support oldIE or don’t mind using conditional comments:

<!--[if lt IE 9]>
    <script src="jquery-1.9.0.js"></script>
<![endif]-->
<!--[if gte IE 9]><!-->
    <script src="jquery-2.0.0.js"></script>
<!--[endif]-->

With this first beta of jQuery 2.0 we’ve made a huge down payment on major cleanup, cutting the size of the library by more than 10 percent. But we’re nowhere near done. There is more refactoring possible now that we can consistently depend on modern JavaScript, CSS, HTML, and DOM features being there. We’ll continue to tighten and clean up the code before 2.0 ships, and extend our work to make more functionality optional to shrink the size of custom builds.

They Built This For You

Many thanks to the people who have contributed to these two releases since 1.8.3 was shipped: Akintayo Akinwunmi, Alexander Farkas, Allen J Schmidt Jr, Ben Truyman, Bennett Sorbo, Callum Macrae, Carl Danley, Corey Frang, Daniel Gálvez, Dan Morgan, David Bonner, David Fox, Devin Cooper, Elijah Manor, Erick Ruiz de Chavez, Greg Lavallee, Ismail Khair, James Huston, Jay Merrifield, Jonathan Sampson, Julian Aubourg, Marcel Greter, Matt Farmer, Matthias Jäggli, Mike Petrovich, Mike Sherov, Oleg Gaidarenko, Paul Ramos, Richard Gibson, Rick Waldron, Rod Vagg, Roland Eckl, Sai Wong, Scott González, Sebi Burkhard, Timmy Willison, Timo Tijhof, Tom Fuertes, Toyama Nao, and Yi Ming He. Good work guys!

jQuery 1.9.0 final and 2.0.0 beta Changelog

Any tickets listed here that are not related to IE 6/7/8 support are also in the jQuery 2.0 beta.

Ajax

Attributes

Build

Core

Css

Data

Deferred

Effects

Event

Manipulation

Misc

Offset

Selector

Support

Traversing

The State of jQuery 2013

Posted on by

My fellow web developers, the state of jQuery is strong.

On January 14, 2006, John Resig attended BarCampNYC and made a presentation about his new project called jQuery. In a contemporary blog post John said, “This code revolutionizes the way you can get JavaScript to interact with HTML.” It was a bold statement, but in retrospect we know it was an understatement.

Seven years after John introduced jQuery to the world, the JavaScript library he created has continued to evolve. Today, jQuery is used by more than half of the top 100,000 sites and is the most popular JavaScript library by far.

Last year, jQuery projects moved from under the wing of the Software Freedom Conservancy to our own non-profit organization: The jQuery Foundation. This new Foundation was created not just to foster jQuery code projects, but to advocate for the needs of web developers everywhere. We’re starting to see the fruits of that labor.

To serve the evolving needs of web developers, jQuery has grown far beyond the core library. jQuery UI provides a rich set of user interface widgets that share a consistent and common set of events, programming conventions, and visual styles. jQuery Mobile offers a framework designed to simplify web site and HTML app development on mobile devices. Additional jQuery Foundation projects such as Sizzle, QUnit, and TestSwarm provide valuable components and tools for web development.

Anniversary Announcements

During the coming two weeks you’ll hear more about each of these jQuery Foundation initiatives:

jQuery 1.9 final: This latest version of jQuery core provides support for a full spectrum of browsers, from IE6 all the way to the most recent releases of every major browser.

jQuery 2.0 beta: Here is your taste of the future, a jQuery that can be faster and smaller without the need to support IE 6, 7, or 8. It’s a great choice for platform-specific HTML applications.

jQuery Migrate 1.0 final: Use this plugin to find things that may cause upgrade issues when you move up from older jQuery versions, and to allow older code to work with either jQuery 1.9 or 2.0.

jQuery UI 1.10 final: This version of jQuery UI includes API redesigns for both the Dialog and Progressbar components, in addition to a healthy set of fixes to other components.

New and remodeled web sites: All jQuery sites are being updated with a new look, and we’re encouraging contributions via Github. The most exciting news of all? The Plugin site returns!

Conferences: Our next conference is being held in Portland Oregon on June 12-14, so save the date! Ticket sales and a call for speakers will open on January 25th at noon Eastern time. Details of future conferences are coming soon; they include Austin Texas in September 2013, San Diego California in February 2014, and Chicago Illinois in July 2014.

Membership: Our new program lets you or your company show support by donating to the jQuery Foundation; you’ll get benefits such as t-shirts, hoodies, and discounts on conference tickets.

jQuery’s Mission

With the impending arrival of jQuery 2.0 some people have been asking, “If jQuery doesn’t have to worry about IE 6, 7 or 8 anymore, where does it go now? Aren’t cross-browser issues the whole reason for jQuery’s existence?”

First of all, let’s be very clear: The jQuery team does “worry about” IE 6/7/8, with jQuery 1.9. We’ve created a legacy-free jQuery 2.0 in order to address the many situations where older versions of IE aren’t needed. Some glorious day in the future, jQuery 2.0 will be the only version you’ll need; until then we’ll continue to maintain jQuery 1.9.

Second, jQuery wasn’t just created to iron out browser differences. It introduced a concise, powerful, and expressive API for managing HTML documents that is far better than the original W3C DOM APIs. Using the jQuery API, developers have created reusable jQuery plugins that make the process of building a web site or HTML application much easier. jQuery is a great choice even for an iPhone HTML app that will never see a different web platform.

But to the point about cross-browser issues, it’s a complete myth that today’s modern browsers have no differences. Look through the jQuery source code and you’ll see plenty of places where it has to fix, patch, and mask issues in modern browsers; those problems didn’t end with IE8. jQuery 2.0 now has more patches and shims for Chrome, Safari, and Firefox than for Internet Explorer!

In fixing and patching these differences, we often act as an advocate for web developers to the browser makers and standards organizations. We want jQuery APIs to be consistent and return useful results, even when browser bugs or ill-conceived standards dictate otherwise. It’s not always easy to do that.

Sometimes, doing the right thing requires changes to the standards, or new standards altogether. For some examples of that, see the work Mike Sherov has done to fix getComputedStyle(), or the efforts of Mat Marquis and others to create a responsive image tag. Team members Yehuda Katz and Rick Waldron are participating in the W3C and ECMA standards groups that define the technologies we all use.

Let’s Work Together

All of these benefits to the web development community are delivered by a dedicated group of jQuery team members. We’re proud to have developers like these working on behalf of the jQuery Foundation to advocate for the needs of the community. The majority of the team volunteers their time, or has their time subsidized through the generous donation of their employer. But there is always more work to do than the team can possibly tackle. Here are ways you can help:

Join the jQuery Foundation. As a member, you’ll get an awesome annual membership gift such as a t-shirt, hoodie, or bag, depending on your level of contribution. Your cash donations can help to keep our operations going. We’ll be announcing a memebership program in a few days as part of our anniversary celebration.

Test beta versions of jQuery projects as soon as they arrive. We want to find and fix problems before the final release. Beta versions are announced on the jQuery blogs, and bug reporting procedures are given in the blog posts as well. Read through the documentation and let us know when information is incorrect or missing. As Linus’ Law says, “Given enough eyeballs, all bugs are shallow.”

Write code, documentation, or web sites for a jQuery project. It’s not just the libraries themselves that need volunteers. The jQuery Foundation has many, many web sites at this point, and those sites always need contributions of code, documentation, or design. Watch for a blog post soon about a new site for contributors.

Get your company involved. If your company encourages employees to do open source work, consider doing that work on jQuery Foundation projects. Companies that wish to provide services and/or financial support can become corporate members of the jQuery Foundation.

Share your knowledge with the jQuery community. Join the discussion on our jQuery forum, on Stack Overflow, at user-group gatherings and conferences, or anywhere else you find jQuery being the hot topic.

Thank You!

As you can tell, the jQuery Foundation was very busy in 2012, and we’re determined to continue that pace in 2013.

We couldn’t have made such incredible progress without support from members and sponsors. jQuery Foundation member companies include WordPress, Media Temple, Adobe, RIM, Apigee, Intel, Gentics, BNOTIONS, White October, Bitovi, Davinci, Application Craft, GitHub, Go Daddy and MJG International. Significant support has also been provided by Bocoup, Filament Group, and their staff.

jQuery’s success isn’t ours alone; the web development community around the world deserves much of the credit. The breadth and scope of the jQuery ecosystem shows that it is thriving, and it continues to grow thanks to your support. Let’s make 2013 another great year for web developers!

Dave Methvin
President, jQuery Foundation

jQuery 1.8.3 Released

Posted on by

Woo hoo, Thanksgiving arrived early this year! jQuery 1.8.3 is available for download. You can get it here:

We’ve notified the Google and Microsoft CDNs as well; we trust they will endeavor to post these files tout de suite. The complete change log for jQuery 1.8.3 is below. It’s a rather modest list, but we did nail a few important bugs and regressions.

The team is already hard at work on jQuery 1.9 and would like to squash as many bugs as possible. To report a problem, please post a bug report and be sure to include a test case from jsfiddle.net or jsbin.com. Also try our work-in-progress build at http://code.jquery.com/jquery-git.js to see if it’s already fixed.

Many thanks to the patch contributors for this version; ye shall know them by their GitHub handles: gnarf37, timmywil, gibson042, rwldrn, joyvuu-dave, jaubourg, staabm, and sindresorhus. In addition, we thank all the community members who took the time to contribute quality bug reports with test cases. Your initial groundwork makes it possible for us to find and fix bugs.

jQuery 1.8.3 Change Log

Ajax

  • #12583: IE8 HTML bug (Chinese translation)
  • #12635: jquery 1.8.2 fails ajax calls in IE9 because it assumes cross domain when default port is in ajax url

Attributes

  • #10943: JQuery 1.7.1 does not properly set tabindex property on cloned element in IE7

Core

  • #12690: Minimum JS File Contains non-ASCII Character

Css

  • #10227: $('body').show() does'nt work if body style is set to display:none
  • #12537: element.css('filter') returns undefined in IE9

Deferred

  • #12665: Callbacks objects with "unique" flag will iterate over a function's methods when it is added a second time

Effects

  • #8685: Animations should keep track of animation state in order to properly address stacked animations
  • #12497: jQuery 1.8.1 transitions crashing android 2.3.4 browser
  • #12837: All animations break after zooming a lightbox on the iPad

Selector

  • #12643: Upgrade from 1.3.2 to 1.8.2 gives an Uncaught TypeError
  • #12648: Can not correctly detect focus for DIVs with contenteditable in Chrome and Safari

Support

  • #12357: jQuery 1.8.0 Not parseable by XUL Runner Applications

jQuery Licensing Changes

Posted on by

Some important changes have occurred in the latest releases of several jQuery projects such as core, UI, Mobile, Sizzle, and QUnit. You may not have noticed them because they didn’t really change the actual code, documentation, or functionality. Instead, these changes were designed to clarify the ownership and licensing of the software. If you’re not a lawyer, most of this won’t make a lot of difference to you, but it’s important to us.

One simplification we made was to remove the GNU General Public License (GPL), leaving only the MIT License. Having just one license option makes things easier for the Foundation to manage and eliminates confusion that existed about the Foundation’s previous dual-licensing policy. However, this doesn’t affect your ability to use any of the Foundation’s projects. You are still free to take a jQuery Foundation project, make changes, and re-license it under the GPL if your situation makes that desirable. The Free Software Foundation site confirms that the MIT License is a “lax, permissive non-copyleft free software license, compatible with the GNU GPL.”

Over time, more than 500 people have contributed to the projects currently managed by the jQuery Foundation. We’re working hard to make sure that everyone who has contributed gets the credit they deserve. Many of the projects now have an AUTHORS.txt file in their root that list all the major contributors in chronological order. Scott González did a lot of the heavy lifting to get the author lists in order, and created useful tools so that we can keep them that way. Of course, you can always see the author of a specific change to a project by looking at the commit in the git log or on GitHub.

It’s important to the jQuery Foundation that licensing of the code and documentation is clear, so the community can continue to use it without interruption. Doing so requires a “paper trail” so it is unambiguous that the Foundation has permission to use the code and the contributor had the ability to contribute that code in the first place. For an example of the latter, think about the situation where an employee works on jQuery Foundation projects at the company office; their employer might claim they own that work and the employee had no right to license it to the Foundation.

To make the licensing clear, contributors are asked to sign a Contributor License Agreement (CLA). jQuery team members will sign a Copyright Assignment Agreement (CAA) which actually assigns the copyright to the jQuery Foundation. For more discussion of what a CLA or CAA does, see this article.

All of these changes guarantee that the jQuery Foundation’s open source projects will be dependable resources for developers and businesses. They also ensure that when you contribute, you’ll get some recognition for the work that you’ve done. So with all that legal stuff out of the way, come help us build the jQuery Foundation projects!

jQuery 1.8 Released

Posted on by

August just got a little hotter, because jQuery 1.8 final code is here! You can pick up the code from jQuery’s CDN:

As usual, the Google and Microsoft CDNs will also have the file soon. Please don’t ask us about when they’ll be there, we don’t know and we don’t control those CDNs! Use our copies directly from the jQuery CDN above if you’re just itching to get started. It’s the same bits.

We don’t expect to get any bug reports on this release, since there have been several betas and a release candidate that everyone has had plenty of opportunities to thoroughly test. Ha ha, that joke never gets old. We know that far too many of you wait for a final release before even trying it with your code. So now there is really no reason to wait, and you can find out if there are any bugs you could have reported earlier.

If you do find a bug, please create a test case on jsFiddle or jsbin and file a bug on our bug tracker. If you’re not sure whether you’ve found a bug, ask on our forum. jQuery core 1.8.0 is compatible with the latest versions of jQuery UI (1.8.22), and jQuery Mobile (1.1.1). Be sure to update those if you’re reporting bugs on pages that involve them.

A Whirlwind Tour of jQuery 1.8

Let’s just recap the big changes in this release:

Sizzle re-architected: jQuery’s selector engine is faster than ever, thanks to a rewrite (well, really two rewrites) by Timmy Willison. Sure, most browsers have querySelectorAll nowadays, but nearly every implementation falls short in one way or another, creating a road full of cross-browser potholes. Sizzle smoothes that road for you. Plus, you may want those useful jQuery selector extensions like :has() with a complex selector or :contains(). Oh yeah, and there’s still IE6/7 support.

Animations re-imagined: Over time, the animation code in jQuery had become kind of messy. Corey Frang took a head-first dive into that swamp and managed to remove most of the alligators, um, bugs. Most of the changes are under the covers, so existing animations should just work (and work better). But there are also some awesome additions to make animations more general and extendable. One notable and very cool feature is the use of the progress callbacks in Promises. We’re still working on detailed documentation, but we do have a draft. Also, here’s an example of the new code in action: http://jsbin.com/odocid/1/edit.

Automatic CSS prefixing: When you use a CSS property, in either .css() or .animate(), we’ll use the correct prefixed property (when appropriate) for that browser. For example, take .css("user-select", "none"); in Chrome/Safari we’ll set the value as "-webkit-user-select", Firefox will use "-moz-user-select", and IE10 will use "-ms-user-select".

More flexibility with $(html, props): In jQuery 1.8, you can use any jQuery method or plugin in the object passed to $(html, props). Before, you could only use a short list of method names, and there was no documented way to add to the list. Now there doesn’t need to be a list at all! Be aware, however, that this can cause the behavior of your code to change if plugins are added later that have the same names as HTML attributes.

More than 160 bugs closed: The Sizzle and animation rewrites in particular provided the impetus to fix several long-standing bugs–some of which have been around for two or three years. Mike Sherov tackled most of the open CSS and positioning issues, getting us down to near-zero bugs there. We also haven’t given up and are still pounding away to eliminate annoying differences between IE 6/7/8 and modern browsers, so you don’t have to deal with them.

Smaller code size: Despite all the code cleanup, new features, and bug fixes, the gzipped file size of jQuery 1.8 is actually a few hundred bytes smaller than jQuery 1.7.2. Size reduction wasn’t our primary goal in this version, but we felt it was important to hold the line on code growth, and we definitely achieved that. Many thanks to Richard Gibson for leading the code-crunching charge across the entire project.

Modularity: If you know your project’s jQuery dependencies well, you can use the new grunt-based build system to strip out parts of jQuery that you know you don’t need. What we’ve done here for 1.8 is really just a beginning, you’ll see even more flexibility as we move to later versions.

The full changelog is available below, in case you’re wondering whether your favorite bug was squashed.

What’s Been Removed

The short answer is “very little”. We wanted to provide a generous notice period for deprecated features that will be removed in 1.9, to give people time to adapt their code. Several of the things removed in 1.8 were undocumented internals that some people have cleverly reverse engineered, but it’s always risky to use undocumented features. Here are the items removed:

$(element).data(“events”): In version 1.6, jQuery separated its internal data from the user’s data to prevent name collisions. However, some people were using the internal undocumented “events” data structure so we made it possible to still retrieve that via .data(). This is now removed in 1.8, but you can still get to the events data for debugging purposes via $._data(element, "events"). Note that this is not a supported public interface; the actual data structures may change incompatibly from version to version.

Deferred.isResolved() and Deferred.isRejected(): Calling N-1 boolean methods to get the state of an N-state variable was getting a bit silly, so we added Deferred.state() in jQuery 1.7 to tell you the state in a single call. So, these two older methods aren’t needed anymore. It’s much more convenient for debugging scenarios where you often want to know the state of a Deferred as a string.

$(element).closest(Array) returning Array: This was a strange signature of the .closest() method intended for use by the old .live(), but not used by any other code as far as we know. Normal uses of .closest() returning a jQuery object are not affected by this signature being removed.

$.curCSS: This method was simply an alias for jQuery.css() from jQuery 1.3 onward. Although it has never been part of the documented API, some external code has been known to use it, perhaps thinking it was “more efficient.” Now it’s “more gone.”

$.attrFn: Yet another undocumented item, used to define which methods could be used in conjunction with $(html, props) signature. Although it serves no functional purpose in jQuery 1.8, we are leaving an empty $.attrFn in jQuery to prevent code that uses it from throwing errors. Fair Warning: This will be removed entirely in jQuery 1.9, so update your code!

Where Credit’s Due

This release couldn’t have happened without the hard work of the talented jQuery Core team: Julian Aubourg (jaubourg), Corey Frang (gnarf), Richard Gibson (gibson042), Mike Sherov (mikesherov), Rick Waldron (rwaldron), and Timmy Willison (timmywil).

Special recognition goes to these jQuery team and community members who supported the Core team with patch contributions during the jQuery 1.8 development cycle: Andy Monat, Robert Katic, Joaoh Bruni, Sindre Sorhus, Oleg Gaidarenko, Yehuda Katz, Timo Tijhof, Dominik D. Geyer, Scott González, Jörn Zaefferer, Matt Farmer, Trey Hunner, Jason Moon, Ben Alman, Jeffery To, Kris Borchers, Daniel Herman, Vladimir Zhuravlev, Jacob Thornton, Chad Killingsworth, Nowres Rafid, David Benjamin, Uri Gilad, Chris Faulkner, Elijah Manor, and Daniel Chatfield.

We’re also very thankful to those of you who took the time to report bugs; we can’t possibly fix a bug unless we know it exists. If you’re looking for an easy way to contribute to jQuery, get to know the bug tracker and help us by creating reduced test cases that clearly demonstrate bugs. Once we can reproduce a problem, a solution usually isn’t too far away. Those test cases become the foundation for a unit test that can prevent the problem from happening when we change code in later revisions.

jQuery 1.8 Change Log

Ajax

  • #8205: JSONP random result is causing memory leak in IE8
  • #8653: jQuery.param outputs "null" and "undefined" in the query string
  • #9399: Deprecate jqXHR.success and jqXHR.error
  • #10285: evalScript rcleanScript replacement fails in IE8
  • #10524: jQuery.fn.load does not merge data parameter with jQuery.ajaxSetup
  • #10944: $.ajax does not always return an object implementing the Promise interface
  • #11013: Deprecate use of Deferred/Promise with sync $.ajax
  • #11402: evalScript function fails with error error 80020101 in IE
  • #11743: jQuery silently ignores errors during script tag ajax request in $.appendTo()
  • #11778: Cached XHR requests should still resolve asynchronously
  • #12122: jQuery.ajax() async deprecate use with $.Deferred

Attributes

  • #11153: jQuery 1.7 Strips Carriage Returns in IE 8
  • #11212: Sizzle.getText converts unbreakable space into whitespace on IE
  • #11547: XML DOM .removeAttr() doesn't remove cased attributes
  • #11962: Standardize getter return values for empty sets.
  • #12127: Clone does not correctly copy checked state in IE10

Build

  • #11767: Support custom build without effects
  • #11789: Update README to describe grunt build system
  • #11856: modularize dimensions
  • #11857: modularize css
  • #11865: modularize offset
  • #11965: Create deprecated.js to contain as much of the deprecated stuff as possible
  • #12059: `grunt custom` should minify – also should add excluded modules to headers
  • #12158: jQuery 1.8rc1 does not work with YUICompressor 1.4.7

Core

  • #10657: Deprecate jQuery#size() in favor of jQuery#length
  • #11290: selector interpreted as HTML
  • #11470: Adding a builtin readyP promise
  • #12018: $(document).ready() fires too early in IE8
  • #12026: Let $(html, props) use any jQuery.fn method

Css

  • #10373: `document.defaultView` => `window`
  • #10394: jQuery.cssHooks.opacity throws exception on non-IE browsers
  • #10413: width, innerWidth, innerHeight, outerWidth, outerHeight are inaccurate for a "box-sizing: border-box" child of hidden parent
  • #10679: CSS3 vendor prefix support
  • #11004: getWH incorrectly removes padding and border width when box-sizing is border-box
  • #11787: Remove jQuery.curCSS
  • #12088: Webkit now returning percentages for more getComputedStyle properties
  • #12148: hide event don't fire when toggle

Data

  • #7579: jQuery.data() truncates numbers taken from data-xxx attributes
  • #10589: Remove $.fn.data("events")
  • #11435: Obsolete test code to remove toJSON from .data's return value

Deferred

  • #11010: Make Deferred.then == Deferred.pipe like Promise/A
  • #11011: Allow traditional options object for $.Callbacks flags
  • #11736: Remove Deferred .isResolved() and .isRejected()
  • #11749: Preserve context objects when multiple Deferred object are passed to $.when()

Dimensions

  • #6724: wrong $(window).height() in mobile safari (iphone)
  • #10877: Make outerWidth/Height a setter
  • #11293: Reading width or outerWidth of empty TDs alters columns width values
  • #11604: Switch $(elem).width(-val) from no-op to $(elem).width(0)
  • #11724: $(document).height() changed in Firefox 12

Effects

  • #7109: animate width starts with invalid width on webkit
  • #7157: Animation callback shows element is still ":animated"
  • #8387: flickering problem with jQuery 1.5 hide/show issue with inline and inline-block elements on webkit browsers
  • #8627: .animate() fails on letterSpacing in IE (regression in 1.5.1)
  • #8892: Callback is raised before objects are shown with fadeIn() and jQuery.fx.off = true
  • #9217: javascript error in IE8 when animating element is removed before animation finishes
  • #9505: animate() issue when mixing percentages and pixels in WebKit
  • #11635: Explicit overflow:auto is overridden by inline overflow:hidden during animation
  • #11755: animate and it aliases should not use :hidden selector
  • #11797: New animation related events
  • #11854: percentage animations jump to end
  • #11971: Animating background-position fails in IE8
  • #11999: Incremental animation on fixed div does subtraction instead of addition in Chrome.
  • #12117: overflow hidden not properly set when animating to 0 height or width
  • #12138: fadeOut doesn't work in Chrome on basic SVG elements
  • #12150: border-spacing property accumulates when rows are shown and hidden

Event

  • #8545: Leak with events in IE
  • #10067: Firing $.ready on document.readyState === 'interactive' too
  • #10895: The doScrollCheck ie hack in bindReady degrades ie7 performance for no reason whatsoever
  • #11101: Deprecate "exclusive" events option from trigger method
  • #11315: Problems with delegate() and :first in nested elements with equivalent classes
  • #11328: Ctrl key doesn't set event.metaKey to true on Windows
  • #11382: Mouseenter doesn't fire on a disabled input element
  • #11500: Bug : "change" event handler not executed when triggered manually on IE7 & IE8
  • #11621: Triggering a event on document doesn't bubble to window
  • #11718: Deprecate .data() events
  • #11719: Deprecate .bind("ready") event
  • #11731: Deprecate "hover" pseudo-event
  • #11733: Deprecate .load(), .unload(), and .error() methods
  • #11764: Allow delegated non-native events on disabled elements
  • #11786: Deprecate .toggle( handler, handler, … ) signature
  • #12203: .undelegate() with no arguments unbinds all handlers from the parent element

Manipulation

  • #8894: appendTo() and alike methods called after clone() returns incorrect jQuery set in IE
  • #10324: Clone does not copy innerHTML of object element in IE9
  • #11231: Append, Prepend, After, Before should accept an array as first argument
  • #11325: Improve domManip/buildFragment/clean
  • #11338: Inconsistent behavior with .replaceWith() and disconnected nodes.
  • #11528: ie8 serialization bug with .html() also hitting html5 tags
  • #11566: node.append et al. does not work when node is a DocumentFragment
  • #11617: Define a $.parseHTML method for creating HTML fragments
  • #11809: Memory leak in .text(val) setter?
  • #11898: prevAll() with a complicated :not() selector returns results in wrong order
  • #12132: IE10 bug when cloning an object element without a parentNode

Offset

  • #10996: Simplify offset()
  • #11823: Remove webkitConvertPointFromNodeToPage

Selector

  • #3778: selector matching issues
  • #5568: Selectors behave differently with comments tags on FF/IE
  • #7596: xpath selector attribute name with brackets [] fails
  • #8473: In IE9rc *[tabIndex] select all elements without tabindex also
  • #8906: .(prevAll('span:has(input,select,textarea)')
  • #9400: Deprecate :text, :radio, :checkbox, etc. selector extensions
  • #9810: Rewrite Positional Selector Logic
  • #10003: Regression/BC break from #6963
  • #10074: Chaining two [] selector with :first not working
  • #10499: :nth-child() inside :has() treated as if outside it
  • #10570: :text selector throws an error in IE7 when there is a cross domain iframe on the page
  • #10697: Sizzle revamp
  • #10799: Inconsistent results with [name="name"] selectors (also breaks .has)
  • #10809: incorrect test using ".activeElement" in the :focus pseudo-class resolver
  • #11109: Sizzle: Expr.relative truncates prematurely
  • #11120: Tabs in some selectors break in IE7
  • #11814: Sizzle's element-rooted QSA strategy (i.e. attaching a temporary id) does not account for comma and other other selector divisions
  • #11826: Explore a parsed caching system for matchesSelector within Sizzle
  • #11902: :not + :contains selectors
  • #11918: :eq selector problem when using tag name with ':'
  • #11959: Add support for :active selector
  • #11961: "Maximum call stack size exceeded" when using jQuery#is
  • #11966: descendant selector
  • #11969: Missing null check when gathering siblings
  • #12054: Uncaught TypeError: Object #<HTMLDocument> has no method 'getAttribute'
  • #12057: Sizzle Regression
  • #12082: .find() POS selector no longer working in 1.8b2
  • #12153: Error occurs in the selector

Support

  • #9385: Deprecate jQuery.browser
  • #11163: jQuery.support.checkClone always true
  • #11249: CSP error in Chrome 18 when loading jQuery 1.7.1
  • #11439: jQuery.support.parentNode used, but not defined any more.
  • #11721: deprecate and remove internal uses of jQuery.support.boxModel
  • #11757: IE 8 memory accumulation in iframes with jQuery 1.7.2
  • #11766: Move jQuery.support to "unstable" status

Traversing

  • #9800: New method: .addBack (supersedes .andSelf)
  • #11539: All version of jQuery don't support .has() on $([text Element].parentNode).has?(other_element)
  • #11543: .has doesn't work on detached elements
  • #11706: `.has()` fails on document fragments
  • #11738: Remove .closest(Array) returning Array

The New Sizzle

Posted on by

In order to make your 4th of July more sizzlin’ (you’re welcome), the jQuery team is happy to announce that Sizzle, jQuery’s CSS selector engine, is better, faster, and more reliable than ever! Sizzle has received a substantial rewrite to be included with the release of jQuery 1.8.

First, credit should be given to Diego Perini for pointing me in the right direction as well as Samuel Lebeau for creating a project 3 years ago called Bouncer, a “fast bottom-up element matcher for Javascript”.

jQuery, along with Sizzle, was released in 2006, about 3 years after Simon Willison came out with getElementsBySelector, which pretty much set the stage for every selector engine we have today. As time went on, Sizzle was rewritten a few times for the sake of performance and more and more bugs were covered as the number of people using it increased.

During this time, other quite impressive selector engines were introduced, including but not limited to NWMatcher (by Diego), dojo.query, Slick, base2, qwery, and YUI. Though they all have their own strengths, NWMatcher and Dojo particularly stood out as exemplary engines. While neither is the fastest at every selection, they are both consistently fast for almost every selector. My goal was to achieve this same level of performance for Sizzle, retain all of the edge-case bug fixes that John and the bugs team have collected over the years, and cover even more bugs that were in the queue or were covered by other engines. I can now safely say this goal has been reached.

While I won’t say Sizzle is completely bug free or it is always the fastest in every situation, the reliability and performance gains are very competitive. http://jsfiddle.net/timmywil/s7rN4/ is a primitive test used to quickly observe the differences between some selector engines for several selectors (should be run in a browser with a console open).

What changed

Below is a reduced list of the main code differences between Sizzle in jQuery 1.7.2 and jQuery 1.8.

One compiled selector function

The selector parser compiles a selector into one function containing functions for each part of the selector. This means that for any given selector (excluding positional (POS) selectors such as :first or :eq(3)), the possible set of elements need only be checked once. This is predominantly where the major speed boost and heightened stability comes from.

Additionally, Sizzle maintains a cache of the most recently compiled functions. The cache has a maximum size (which can be adjusted but has a default) so you don’t get out-of-memory errors when using a lot of different selectors.

Note: this does not have an effect on simple selectors (ID-only, TAG-only, CLASS-only) because Sizzle has had shortcuts for these that defer to getElementByID, getElementsByTagName, and getElementsByClassName whenever possible. That wasn’t changed (except for the addition of a shortcut for element-rooted ID selectors), and those are still the fastest selectors. Any other selector will go through querySelectorAll if available or run through the compiler.

querySelectorAll and matchesSelector

With this latest rewrite, the code paths to querySelectorAll and matchesSelector are even better than before and yield excellent performance.

Some people ask why we need Sizzle at all, since modern browsers have querySelectorAll and matchesSelector and accept a wide range of CSS3 selectors. The problem is that every browser (not just IE) has a few bugs in these methods. Selector engines must know beforehand what these bugs are and bypass these methods before they return incorrect results (though not all of them do). Sizzle now has this covered.

In addition, querySelectorAll and matchesSelector do not know how to process jQuery selector extensions such as [attr!=value]. Any time you use a selector extension, Sizzle needs to handle the selection natively.

Improved selector validation

Validating selectors is a tricky business. To be too strict can be annoying, but to be too flexible can produce unexpected results. In the past, Sizzle has been both of these at different times for several use cases. The most recent changes are geared towards adhering to the W3C selectors specification as much as possible, but also allowing some things that the spec does not (such as having complex selectors within a :not() pseudo).

Specifically, we are matching all whitespace characters where necessary, including line feed, tab, carriage return, and form feed(http://www.w3.org/TR/selectors/#whitespace), validating identifiers and operators in attributes selectors (http://www.w3.org/TR/selectors/#attribute-selectors), and providing a character encoding that matches the spec (http://www.w3.org/TR/css3-syntax/#characters).

Combinators (space, ~, >, +)

Combinators can get very complicated, but the new strategy handles these with great poise. In the release of jQuery 1.8 beta (and at the jQuery conference this year), I claimed that Sizzle had improved support for combinators. While the accuracy was improved, I spoke too soon and, fortunately, this was pointed out by someone I only know as Yaffle on github. Apparently, for very large and deep documents, the original revisions were checking so many elements that it was causing a stack overflow for selectors that had several combinators. For each combinator, the number of elements checked went up exponentially in order to maintain possible matches. This was bad. Sizzle now takes care of that issue and gets very satisfying results.

Extensibility

Although most of the old API for Sizzle was not changed in this rewrite (except for the removal of the now unnecessary Sizzle.filter from the private API), there are a couple changes that make Sizzle even more extensible. The most common way to extend Sizzle is to add custom pseudo selectors. Now with the parser compiling a function of functions, you can receive more information when creating your custom selector. For example, within Sizzle, the implementation for the :not pseudo selector is very similar to

// Using the createPseudo function tells the compiler
//   to pass the pseudo argument, context, and whether the current context is xml
//   to the function passed to createPseudo and trusts
//   that a function to be used for filtering will be returned.
// Note: the use of createPseudo is only necessary for creating custom
//   pseudo selectors with arguments.
Sizzle.selectors.pseudos.not =
    Sizzle.selectors.createPseudo(function( selector, context, isXml ) {
        var matcher = Sizzle.compile( selector, context, isXml );
	return function( elem ) {
		return !matcher( elem );
	};
    });

This is the only breaking change in the public API given the new parser, but I think creating custom pseudos with arguments is now much cleaner. For more information, please refer to the Sizzle docs.

Perhaps some of you are thinking that it could be nice to pre-compile your own selectors. Well, you can. Sizzle.compile is exposed so you can cache your selectors before they get used. While compiling is still very fast without caching, you can make sure that step is skipped before the selection is ever run. Call compile with your selector and context

Sizzle.compile(“my>long>complicated:selector(poof)”, document);

and it’s added to the cache. You can even increase/decrease the size of the cache by setting Sizzle.selectors.cacheLength.

Note: The majority of users do not need to use the compiler as Sizzle will maintain a cache of recently compiled selectors. Overriding Sizzle.compile will have no effect on Sizzle as it maintains an internal reference to this method.

Get the code!

The code is now available in the git versions of jQuery and Sizzle. Expect jQuery 1.8 to be released sometime this month. Issues specifically for Sizzle can be filed on GitHub and, as always, any issues related to jQuery as a whole can be filed on our bug tracker. Try it out for yourself and let us know if you run into any problems. Enjoy and Happy Independence Day!

jQuery 1.9 and 2.0 — TL;DR Edition

Posted on by

It seems that many people had questions and misconceptions about the last post, so let’s try a short Q&A format to answer some of the comments left there.

Why is the jQuery core team dropping support for oldIE (IE 6/7/8)? We’re not! jQuery 1.9 will support oldIE when it’s released next year. The jQuery team will continue to support and maintain version 1.9 even after jQuery 2.0 is released.

Why are you making me use conditional comments to include jQuery? We’re not! You can use jQuery 1.9 for all the browsers we support, from IE6 all the way up to the latest versions of Chrome, Safari, Opera, or Internet Explorer.

What happens when jQuery 2.1 is released and adds APIs, will jQuery 1.9 support them? Can we borrow your crystal ball? jQuery 2.1 isn’t likely to arrive until 2014, so it’s hard to say what jQuery 2.1 will look like as we sit here in the middle of 2012. Our general goal is to keep the 1.x and 2.x lines in sync and add functionality via plugins; see the keynote from last week’s conference.

How long will you support jQuery 1.9? As long as oldIE is a significant factor on the web. It’s even possible that there will be further releases in the 1.x line, but we haven’t yet received the crystal ball requested in the previous question. When Microsoft drops Windows XP support in April 2014, however, it will put a hurt on the oldIE installed base.

I still have a lot of IE8 users, can’t you just drop IE6 and IE7? The oldIE browsers share many of the same flaws, so it doesn’t help to do anything less than remove all three in jQuery 2.0. If you need oldIE support of any kind, a supported jQuery 1.9 will be right there for you.

My website is in China and 22 percent of our users are still using IE6! Seems like some sort of human rights violation. Oh, and that wasn’t a question.

jQuery Core: Version 1.9 and Beyond

Posted on by

Please check out the followup post before jumping to the wrong conclusion.

As the last blog post discussed, jQuery version 1.8 is undergoing a spring cleaning to remove insecure, inefficient, ineffective, and inadvisable features. We’ve also begun the work to allow you to build custom versions that exclude parts of the library for even greater savings. Those efforts will make it possible for you to enjoy the jQuery API you need without carrying around the parts you don’t want.

Now that we’ve cleaned house, it’s time to take a look forward. There’s just one thing interfering with our vision of the future, and that’s the ghost of browsers past. Internet Explorer 6, 7, and 8–collectively, oldIE–have been a thorn in the side of web developers for a decade. Collectively, these browsers of a bygone era still represent up to one-third of users visiting some sites. That is a lot of users–people who still want the information, services and products that web sites provide. For many web sites that use jQuery, it’s not practical or profitable to ignore that audience.

jQuery was conceived specifically to address the differences in browsers, so we’re not going to abandon the essence of our philosophy and simply disregard the millions of active Internet users who (for whatever reasons) still use oldIE. Yet we also want to move ahead and take advantage of modern browsers, especially the growing mobile market.

The Road Ahead

jQuery 1.8 should arrive within a month. Here is our thinking about the next two versions of jQuery to follow it, and when they’ll arrive:

  • jQuery 1.9 (early 2013): We’ll remove many of the interfaces already deprecated in version 1.8; some of them will be available as plugins or alternative APIs supported by the jQuery project. IE 6/7/8 will be supported as today.
  • jQuery 1.9.x (ongoing in 2013 and beyond): This version will continue to get fixes for any regressions, new browser bugs, etc.
  • jQuery 2.0 (early 2013, not long after 1.9): This version will support the same APIs as jQuery 1.9 does, but removes support for IE 6/7/8 oddities such as borked event model, IE7 “attroperties”, HTML5 shims, etc.

Our goal is for 1.9 and 2.0 to be interchangeable as far as the API set they support. When 2.0 comes out, your decision on which version to choose should be as simple as this: If you need IE 6/7/8 support, choose 1.9; otherwise you can use either 1.9 or 2.0.

Questions and Answers

If jQuery 1.9 and 2.0 are basically the same API, what makes 2.0 compelling? Smaller size, better performance, and the lack of problems introduced by the need for oldIE support. We expect that we can improve error handling in the $.Deferred implementation in 2.0, for example, whereas we can’t do that as long as oldIE is supported.

My site still has many IE7/8 visitors but I want to use jQuery 2.0. Can I do that? If your web site needs oldIE support, and we expect most sites will need it for at least another year or two, you can use IE conditional comments to include version 1.9 only when visitors are using oldIE:

<!--[if lt IE 9]>
    <script src="jquery-1.9.0.js"></script>
<![endif]-->
<!--[if gte IE 9]><!-->
    <script src="jquery-2.0.0.js"></script>
<!--<![endif]-->

Why not make an “oldIE plugin” for jQuery 2.0? Special dispensations for oldIE are sprinkled throughout jQuery. Refactoring the code to provide enough hooks so that oldIE support could be added as a plugin would complicate the code for the modern browser case. Plus, developers supporting oldIE and using a public CDN would then need to include two files (jQuery 2.0 and the oldIE plugin) instead of one.

Once jQuery 2.0 is released, what happens to 1.9? In a departure from the past, we’ll continue to fix bugs in 1.9 (as minor releases). Having just gone through a spring cleaning for 1.8 and 1.9, we don’t anticipate adding a lot of new APIs in the future. Instead, we prefer to add new functionality through plugins compatible with both versions where it makes sense. So don’t feel like you’re being left behind when using version 1.9.

Is jQuery 2.0 basically for mobile devices? No. Although jQuery 2.0 will be a great fit for HTML mobile apps, including ones written with jQuery Mobile, it is not a Webkit-only library that targets just iOS and Android. In addition to mobile browsers, 2.0 will support (and be tested!) with modern desktop versions of Internet Explorer, Opera, Firefox, Safari, and Chrome.

How much smaller/faster will jQuery 2.0 be? We won’t know until we’re done, or at least close to being done. You can bet that we’ll tell you more as the release date for 2.0 draws near. Better yet, you can try the beta when it is released and see for yourself!

jQuery 1.8 Beta 1: See What’s Coming (and Going!)

Posted on by

Hello fellow jQuery users! It’s been a while since you’ve heard from us, but we haven’t been asleep. The jQuery Core Team has been heads-down working on jQuery 1.8, and our first beta release is now available! You can get the code from the jQuery CDN:

Give it a try on your current jQuery code and let us know how it works for you. If you experience issues, please file a bug, include a test case, and be sure to mention that you’re testing against jQuery 1.8 Beta 1.

There will be even more exciting jQuery news at the jQuery Conference in San Francisco later this month, with blog posts to follow.

jQuery is now powering about one-half of all the major web sites on the Internet; that’s a great success, but we’re not standing still. Web browsers and the devices they run on have undergone an incredible metamorphosis in the past six years. The process of web development is evolving to accommodate the changes that are happening. In response, jQuery continues to evolve as well.

Part of that evolution is not just knowing what to add, but what to take away. jQuery’s plugin architecture makes it easy for developers to extend the functionality that jQuery Core offers when it makes sense for their own needs. For that reason, the bar has been set pretty high for additions to Core. We don’t want to create size, complexity, or performance penalties for people who don’t need specific features.

Similarly, we have enough experience with the way that people use jQuery to know some features that originally seemed like a good idea turned out to be a not-so-good idea. Rather than carry these around forever, we want to remove them eventually. In fact, we want to make it easier to create a version of jQuery that excludes things you don’t need or want, especially for mobile environments where space can be precious.

With that in mind, here are some changes we are planning for jQuery 1.8 that will make it a better foundation for all HTML-based web pages and applications, regardless of their platform:

Modularity

As of jQuery 1.8, you can build a custom version of jQuery that excludes one or more modules if you do not need their functionality. This capability is made easy by our new build system based on Ben Alman’s awesome grunt tool. To build your own custom version, set up a copy of the jQuery core repo from Github and use the grunt command line options to exclude modules. For more information, see the README file.

The modules you can currently exclude are ajax, css, dimensions, effects, and offset. For example, if your application exclusively uses stylesheets and CSS animations via classes to control the visibility and size of items on the page, you could build a version without the css, dimensions, effects, and offset modules. If you didn’t need any of the optional modules, your custom build of jQuery would be about 21KB minified and gzipped.

Don’t worry though, building your own jQuery is completely optional. jQuery has always been, and will continue to be, distributed as a single file in both compressed and uncompressed form and available on CDNs. We still expect that to be the way most jQuery developers go, because it’s simple and painless. For example, when you include a jQuery plugin that you didn’t write, using the full jQuery ensures you won’t be bitten by some dependency lurking inside the plugin.

Vendor-Prefixed CSS Properties

The W3C had its heart in the right place when it came up with the idea to use vendor prefixes for CSS features that were not yet standardized, but it hasn’t resulted in a fairy-tale ending. Web developers are faced with the nightmare of including all the vendor-prefixed property names in stylesheets. jQuery 1.8 eases the pain a bit. We automatically take the non-prefixed property name and generate the prefix that is appropriate for the current browser, so you don’t have to. For example, on Chrome the jQuery call $("#myscroll").css("marquee-direction", "backwards") will set the CSS to -webkit-marquee-direction: backwards.

Animation (Effects)

Our code for animation had become a tangled mess over the past few years, and with 1.8 we hope we’ve brought the beast under control. It’s more than just a cleanup, though; there are several extension points that make it easier to add or modify animations. At the moment there is only preliminary documentation for the new features, but in this first beta our primary focus will be on ensuring that any existing animation code works properly.

Browsers are doing a much better job providing efficient animations today, particularly with CSS transitions. Yet there are still plenty of users who don’t have a browser capable of doing CSS-based animations. With jQuery 1.8 you get the best of both worlds. If you need to support older browsers without built-in animations, the new $.Animation provides a solid foundation and fixes many bugs from previous versions. If you need to target only modern browsers and their natively supported animations, you can do that and exclude the animation module entirely.

Sizzle CSS Selector Engine

jQuery’s selector engine has undergone a major rewrite in 1.8. The most notable benefit of this rewrite is a widespread performance improvement of selector matching as well as improved shortcuts for the most common selectors.

Additionally, Sizzle handles many more edge cases and bugs, including improved support for multiple combinators (~ > +) and better detection of browser bugs in querySelectorAll. See the bugs list below in the selector module for a complete list.

XSS Protection

By design, the $() method can create HTML elements, and will run scripts if it is passed a <script> tag with inline script or a src attribute. Developers have sometimes forgotten this, passing strings to jQuery that come from untrusted sources such as the URL or user input. In these cases, it is possible for someone to inject a script into the page that can steal cookies or compromise the page in some way.

These cross-site-scripting (XSS) attacks are common on many sites whether they use jQuery or not, but we want to ensure jQuery does not contribute to the problem. In jQuery 1.9 (the NEXT version following 1.8), we’re tightening down the “looks like HTML” rule for the $() method. A string will only be considered HTML if the first character is a less-than sign, otherwise it will be assumed to be a CSS selector.

As further protection against the inadvertent injection of scripts, jQuery 1.8 introduces a new method: $.parseHTML. It lets you specify strings as HTML and know that they will be parsed as HTML, something that $() cannot do since it also interprets strings as selectors. It also provides a way to parse HTML into a DOM fragment and control the execution of any scripts the HTML it may contain. This is particularly important in JavaScript environments controlled by Content Security Policy (CSP), since injected scripts may cause security warnings or exceptions.

For anything more than the simple case of creating single elements (e.g., $("<p/>")), and particularly for cases where strings are built from external data, we strongly recommend using $.parseHTML. As of jQuery 1.9, some HTML strings will no longer be recognized by $() as a result of these stricter rules.

Spring Cleaning

In jQuery 1.8 we’ll also be deprecating and removing “trip hazards”: APIs and features that are inefficient, ineffective or inadvisable. We realize that there will be existing jQuery code that still requires these features. To provide a low-hassle future upgrade path, we’ll be providing many of the deprecated items in a compatibility plugin after they are removed. You can follow the compatibility plugin as it is developed on its GitHub repo.

Tickets below that begin with “Deprecate” or “Remove” tell the whole story of what is changed, but here are a few changes of particular note:

$.browser: Ever since jQuery 1.4, we’ve been evangelizing that browser detection via the user agent string is a bad idea. Yet we’ve been an enabler of bad practice by continuing to offer $.browser. As of jQuery 1.9 we’ll remove it entirely and you’ll need to use the 1.9 compat plugin. If your code isn’t weaned off browser detection yet, check out Modernizr for a very thorough set of feature detections you can use instead. And of course, you’re welcome to read the tea leaves in the navigator.userAgent string directly, there’s nothing stopping you but your conscience.

$.sub: This method was introduced in jQuery 1.5, but hasn’t proved to be useful or robust enough to justify it staying in core. It will move to a compatibility plugin in jQuery 1.9.

Global ajax events: Events such as ajaxStart fired by $.ajax can currently be attached to any element–even to elements that are not in a document at all! This creates an inefficient special case, so we are deprecating that behavior in 1.8. Ajax events should be attached only on document as of 1.9.

And Much Much More…

There are many other changes in 1.8, perhaps the easiest way to see what we’ve been up to is to look at the list of issues that are being fixed, which includes both features and bug fixes. Here is a snapshot of 1.8 as it stands today, but it’s not set in stone. We welcome your feedback about specific issues or the direction of jQuery in general!

jQuery 1.8 Beta 1 Change Log

The current change log of the 1.8 Beta 1 release.

Ajax

  • #8205: JSONP random result is causing memory leak in IE8
  • #8653: jQuery.param outputs "null" and "undefined" in the query string
  • #10285: evalScript rcleanScript replacement fails in IE8
  • #10524: jQuery.fn.load does not merge data parameter with jQuery.ajaxSetup
  • #10944: $.ajax does not always return an object implementing the Promise interface
  • #11013: Deprecate/remove async option from $.ajax
  • #11402: evalScript function fails with error error 80020101 in IE
  • #11743: jQuery silently ignores errors during script tag ajax request in $.appendTo()
  • #11778: Cached XHR requests should still resolve asynchronously

Attributes

  • #11153: jQuery 1.7 Strips Carriage Returns in IE 8
  • #11212: Sizzle.getText converts unbreakable space into whitespace on IE

Build

  • #11767: Support custom build without effects
  • #11789: Update README to describe grunt build system
  • #11856: modularize dimensions
  • #11857: modularize css
  • #11865: modularize offset

Core

  • #10657: Deprecate/remove jQuery#size() in favor of jQuery#length
  • #11290: selector interpreted as HTML
  • #11470: Adding a builtin readyP promise

Css

  • #10373: `document.defaultView` => `window`
  • #10413: width, innerWidth, innerHeight, outerWidth, outerHeight are inaccurate for a "box-sizing: border-box" child of hidden parent
  • #10679: CSS3 vendor prefix support
  • #11004: getWH incorrectly removes padding and border width when box-sizing is border-box
  • #11787: Remove jQuery.curCSS

Data

  • #10589: Remove $.fn.data("events")

Deferred

  • #11010: Make Deferred.then == Deferred.pipe like Promise/A
  • #11011: Allow traditional options object for $.Callbacks flags
  • #11736: Remove Deferred .isResolved() and .isRejected()
  • #11749: Preserve context objects when multiple Deferred object are passed to $.when()

Dimensions

  • #6724: wrong $(window).height() in mobile safari (iphone)
  • #10877: Make outerWidth/Height a setter
  • #11293: Reading width or outerWidth of empty TDs alters columns width values
  • #11604: Switch $(elem).width(-val) from no-op to $(elem).width(0)
  • #11724: $(document).height() changed in Firefox 12

Effects

  • #7109: animate width starts with invalid width on webkit
  • #7157: Animation callback shows element is still ":animated"
  • #8387: flickering problem with jQuery 1.5 hide/show issue with inline and inline-block elements on webkit browsers
  • #8627: .animate() fails on letterSpacing in IE (regression in 1.5.1)
  • #8892: Callback is raised before objects are shown with fadeIn() and jQuery.fx.off = true
  • #9505: animate() issue when mixing percentages and pixels in WebKit
  • #11635: Explicit overflow:auto is overridden by inline overflow:hidden during animation
  • #11755: animate and it aliases should not use :hidden selector
  • #11854: percentage animations jump to end

Event

  • #8545: Leak with events in IE
  • #10067: Firing $.ready on document.readyState === 'interactive' too
  • #11101: Deprecate "exclusive" events option from trigger method
  • #11328: Ctrl key doesn't set event.metaKey to true on Windows
  • #11500: Bug : "change" event handler not executed when triggered manually on IE7 & IE8
  • #11621: Triggering a event on document doesn't bubble to window
  • #11718: Deprecate .data() events
  • #11719: Deprecate .bind("ready") event
  • #11731: Deprecate "hover" pseudo-event
  • #11733: Deprecate .load(), .unload(), and .error() methods
  • #11786: Deprecate .toggle( handler, handler, … ) signature

Manipulation

  • #8894: appendTo() and alike methods called after clone() returns incorrect jQuery set in IE
  • #10324: Clone does not copy innerHTML of object element in IE9
  • #11231: Append, Prepend, After, Before should accept an array as first argument
  • #11338: Inconsistent behavior with .replaceWith() and disconnected nodes.
  • #11566: node.append et al. does not work when node is a DocumentFragment
  • #11617: Define a $.parseHTML method for creating HTML fragments

Offset

  • #10996: Simplify offset()
  • #11823: Remove webkitConvertPointFromNodeToPage

Selector

  • #3778: selector matching issues
  • #5568: Selectors behave differently with comments tags on FF/IE
  • #8473: In IE9rc *[tabIndex] select all elements without tabindex also
  • #9400: Deprecate :text, :radio, :checkbox, etc. selector extensions
  • #10003: Regression/BC break from #6963
  • #10074: Chaining two [] selector with :first not working
  • #10570: :text selector throws an error in IE7 when there is a cross domain iframe on the page
  • #10697: Sizzle revamp
  • #10809: incorrect test using ".activeElement" in the :focus pseudo-class resolver
  • #11109: Sizzle: Expr.relative truncates prematurely
  • #11814: Sizzle's element-rooted QSA strategy (i.e. attaching a temporary id) does not account for comma and other other selector divisions
  • #11826: Explore a parsed caching system for matchesSelector within Sizzle

Support

  • #9385: Deprecate jQuery.browser
  • #11439: jQuery.support.parentNode used, but not defined any more.
  • #11721: deprecate and remove internal uses of jQuery.support.boxModel
  • #11766: Move jQuery.support to "unstable" status

Traversing

  • #9800: New method: .addBack (supersedes .andSelf)
  • #11543: .has doesn't work on detached elements
  • #11706: `.has()` fails on document fragments
  • #11738: Remove .closest(Array) returning Array

Unfiled

  • #11325: Improve domManip/buildFragment/clean
  • #11435: Obsolete test code to remove toJSON from .data's return value
  • #11777: Add jQuery Core support for EditorConfig file