Avoid reading outside of collection bounds

[mathiasbynens]

Summary

Consider the following collection:

const array = ['a', 'b', 'c'];

Retrieving array[0] can be done relatively quickly. However, when the property doesn’t exist on the receiver, JavaScript engines must continue to look up the prototype chain until either the property is found or the chain ends. This is inherently slower than not doing any prototype chain lookups. Retrieving an out-of-bounds index, e.g. array[3], triggers this scenario, resulting in decreased performance.

This patch changes the way the cleanData loop is written to avoid running into the slow case unnecessarily.

A more in-depth explanation can be found here: https://ripsawridge.github.io/articles/blink-mysterium/

Checklist

• All authors have signed the CLA at https://cla.js.foundation/jquery/jquery
• New tests have been added to show the fix or feature works: N/A
• Grunt build and unit tests pass locally with these changes
• If needed, a docs issue/PR was created at https://github.com/jquery/api.jquery.com: N/A

---

Similar patch for Sizzle: jquery/sizzle#407

[mention-bot]

@mathiasbynens, thanks for your PR! By analyzing the history of the files in this pull request, we identified @timmywil, @markelog and @gibson042 to be potential reviewers.

[markelog]

Will duplicate sizzle comment here as well :) –

Hey.

This looks nice to me. How this reflects on the byte size though? Maybe you could provide a small jsperf as well?

[mathiasbynens]

How this reflects on the byte size though?

This change adds 6 bytes after minification + gzip.

Running "compare_size:files" (compare_size) task
   raw     gz Sizes
271593  80434 dist/jquery.js
 87296  30177 dist/jquery.min.js

   raw     gz Compared to avoid-reading-past-end-of-array @
              9d8431c8329198770212cc8952804bc83d0a8dfd
     =      = dist/jquery.js
     =      = dist/jquery.min.js

   raw     gz Compared to master @ 692f9d4db30c9c6c4f6bc76005cf153586202fa6
   +50     +6 dist/jquery.js
   +19     +6 dist/jquery.min.js

   raw     gz Compared to last run
   +50     +6 dist/jquery.js
   +19     +6 dist/jquery.min.js

[markelog]

This change adds 6 bytes after minification + gzip.

Nice, I think it's worth it. Blog post has interesting insights, but it seems you have to understand Chrome internals to fully appreciate it, that's why I was thinking to check it with our usual approach to the perf pulls.

Thinking a bit further, internally, we were thinking to write loops in same matter across the code base. Maybe this even worth to write a custom eslint rule, so we could put in the jquery preset and all. Since such cases are fairly generalised?

[mathiasbynens]

Thinking a bit further, internally, we were thinking to write loops in same matter across the code base.

Great idea!

Maybe this even worth to write a custom eslint rule, we can even put in the jquery preset and all. Since such cases are fairly generalised?

👍

[dmethvin]

Do we really need to put the lengths in a variable? I thought most JS engines optimize for this, or at least that the perf difference isn't significant.

[dmethvin]

Were there only two cases in the code base? I guess the others are in Sizzle and you have that covered with a separate PR. Like @markelog I would be interested in a jsperf to show the difference this makes.

[dmethvin]

@mathiasbynens did you want to put together a jsperf for this? Given what the cleanData loop does I am not sure this will realy make a difference.

[mgol]

Key @mathiasbynens, are you still interested in finishing this, including addressing @dmethvin's comments?

[mgol]

Closing & re-opening the PR to trigger the EasyCLA check...

[linux-foundation-easycla]

• ❌ - Mathias Bynens The commit (9d8431c) is not authorized under a signed CLA. Please click here to be authorized. For further assistance with EasyCLA, please submit a support request ticket.