Skip to main content

Search and Top Navigation

#11197 closed bug (fixed)

Opened February 24, 2015 12:48AM UTC

Closed February 27, 2015 02:11PM UTC

Last modified February 27, 2015 02:11PM UTC

Feature detecting outerWidth setter API expensive

Reported by: igrunert Owned by: igrunert
Priority: minor Milestone: 1.12.0
Component: ui.core Version: 1.8.24
Keywords: Cc:
Blocked by: Blocking:
Description

jQuery UI core contains the following feature detection for the outerWidth setter:

if ( !$( "<a>" ).outerWidth( 1 ).jquery ) {

This causes a Recalculate Style / Layout operation in Chrome on jQuery 1.7.2, which is expensive (~25ms).

This code is present up to jQuery UI 1.11.3.

Attachments (0)
Change History (5)

Changed February 24, 2015 01:05AM UTC by scottgonzalez comment:1

I suppose we can infer based on the function length, but I'd really prefer to keep the real feature detect. Ideally we'll get this split out into a file for supporting old jQuery Core and then you can just exclude that in your build.

I'll leave this open until we can discuss it with the whole team.

Changed February 26, 2015 01:44PM UTC by scottgonzalez comment:2

owner: → igrunert
status: newpending

Can you provide the test page you're using that's showing ~25ms reflow time? My test page is admittedly simple, but I'm only getting ~1ms time spent on the detection, ~2ms total time spent on detection + implementation. I'm even seeing similar performance in IE8.

Changed February 26, 2015 11:50PM UTC by igrunert comment:3

status: pendingnew

Due to having jQuery UI in the head, and early on in our scripts, this triggers one of our first recalculate style / layout / rendering.

The cost of that reflow should be proportional to the size and complexity of the page. The 1ms / 2ms numbers you quote for a test page make sense to me, it's only on the large DOM we're dealing with that would cause the 20ms+ reflow time.

It's a little tricky to distill a meaningful test page that shows it - but it can be seen clear as day on one of our production systems. It's about 20ms on this page as seen in the chrome dev tools timeline: https://confluence.atlassian.com/404.action and here's a screenshot of the dev tools https://s3.amazonaws.com/uploads.hipchat.com/10804/51242/J7tb07lp7m6H7yj/Screen%20Shot%202015-02-27%20at%2010.48.43%20am.png

Changed February 27, 2015 02:11PM UTC by Scott González comment:4

resolution: → fixed
status: newclosed

Core: Drop feature detection for version check to support jQuery 1.7

Fixes #11197

Closes gh-1458

Changeset: c077e0a347826c7acca4ca2f775ca59e3b5f8d07

Changed February 27, 2015 02:11PM UTC by scottgonzalez comment:5

milestone: none1.12.0