Skip to content

Conversation

@Deraen
Copy link

@Deraen Deraen commented Apr 3, 2018

Continuing from #12370 with different solution (ping @gaearon)

  • Should be even faster than previous checks using hasOwnProperty (if my benchmark works correctly anyway)
  • Google Closure Compiler will optimize away static properties from
    objects if properties aren't accessed dynamically. Using bracket access
    will make Closure to keep these properties in optimized code.

I thought preserveTypeAnnotations would keep all JSDoc annotations but @nocollapse seems to be different than "general" JSDoc comments, so it is not kept.

After failure with that approach I started looking into why https://github.com/facebook/react/blob/master/packages/shared/isTextInputElement.js#L13-L29 works with Closure optimizations (with externs to keep the property names). The function is transpiled into static object and a function which uses brackets to access the object. Turns out, that because the code is using brackets to access the object Closure doesn't optimize the properties away.

I checked performance difference between hasOwnProperty and brackets, and looks like object bracket access is faster: https://jsperf.com/static-object-check-if-prop-exists/1

@pull-bot
Copy link

pull-bot commented Apr 3, 2018

Details of bundled changes.

Comparing: 00a0e3c...cb8923d

react-is

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
ReactIs-dev.js n/a n/a 0 B 4.13 KB 0 B 1.17 KB FB_DEV
ReactIs-prod.js n/a n/a 0 B 3.3 KB 0 B 932 B FB_PROD

Generated by 🚫 dangerJS

- Should be faster
- Google Closure Compiler will optimize away static properties from
objects if properties aren't accessed dynamically. Using bracket access
will make Closure to keep these properties in optimized code.
let markup = null;
if (isCustomComponent(tagLowercase, props)) {
if (!RESERVED_PROPS.hasOwnProperty(propKey)) {
if (!RESERVED_PROPS[propKey]) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I feel hesitant because there might've been some reason it was written this way. For example I think this will have a false positive for hasOwnProperty. And potentially will make adding anything to Object prototype in JS spec a breaking change.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh right. I forgot how JS objects work.

I think I'm out of ideas for fixing #12368 here. I'll check on Closure side if it can be made to understand hasOwnProperty as dynamic access so it can keep the properties like with bracket access.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you give me more details on your strategy in general? Is this the only issue blocking you? It's a bit hard to believe given in how many places we use dot-access.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants