Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add React.PureComponent to documentation #7730

Closed
wants to merge 1 commit into from
Closed

Conversation

Daniel15
Copy link
Member

Documents React.PureComponent on the PureRenderMixin documentation page.

super(props);
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
}
When using ES6 class syntax, you can instead use the `React.PureComponent` base class, which achieves the same result:
Copy link
Contributor

Choose a reason for hiding this comment

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

Let's say "ES6 classes" instead and remove the comma.

Copy link
Contributor

@aweary aweary Sep 14, 2016

Choose a reason for hiding this comment

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

I think we'd also need to mention that PureComponent isn't exactly the same as pure-render-mixin, as it also affects the behavior of functional children. See #6914 for @spicyj's overview of what it does

Copy link
Contributor

Choose a reason for hiding this comment

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

@aweary the SFC heuristics didn't get included; see #7195 (comment)

Copy link
Member Author

Choose a reason for hiding this comment

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

The old text used "ES6 class syntax", so I kept that the same for consistency. I can change it though.

Copy link
Contributor

Choose a reason for hiding this comment

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

"ES6 class syntax" sounds weird to me, but I don't feel strongly either way

Copy link
Contributor

@aweary aweary left a comment

Choose a reason for hiding this comment

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

I wonder if we should give PureComponent it's own page in the documentation rather than just inserting it into the pure-render-mixin doc.

@Daniel15
Copy link
Member Author

I wonder if we should give PureComponent it's own page in the documentation

Are there any advantages to that? Conceptually it's the same thing as the PureRenderMixin.

@sophiebits
Copy link
Collaborator

We should at least add this on the API reference page too, but this seems good by itself too.

@aweary
Copy link
Contributor

aweary commented Sep 14, 2016

I didn't realize that the SFC heuristics weren't actually included yet, so at this point, it is conceptually the same thing, but long term it will diverge from PureRenderMixin in how it treats SFCs.

So yeah, at this point this seems fine to me.

@GGAlanSmithee
Copy link

GGAlanSmithee commented Sep 15, 2016

Sorry for barging in. While this PR makes PureComponent more discoverable (right now it is only mentioned in the github release notes AFAICT), it feels a bit weird to have it in a page which is a subpage to Add-Ons, since it is not an addon if I'm not misstaken (import {PureComponent} from 'react)?

In a idiomatic react application, wouldn't the majority of your components extend PureComponent? If so, I think it should get some more attention. This feels kind of second citizen.

*EDIT: I guess in an idiomatic react application the majority of your components would be pure functions, but the first part of my comment should still be valid.

@shamrin
Copy link
Contributor

shamrin commented Sep 26, 2016

Update: added "no setState calls" clarification

What is the difference between pure function and PureComponent with single render method and no setState calls?

const MyComponent = (props) => { … }

vs

class MyComponent extends React.PureComponent { render() { … } }

I think PureComponent documentation should mention pure functions and show reader the difference (if there's any).

@GGAlanSmithee
Copy link

@shamrin One important difference is that the pure function is stateless, whereas PureComponent is not.

@shamrin
Copy link
Contributor

shamrin commented Sep 26, 2016

@GGAlanSmithee I forgot to mention "no setState calls". I've updated my comment above.

Do pure function components have the same optimisation as PureComponent?

@Daniel15
Copy link
Member Author

Daniel15 commented Sep 26, 2016

Do pure function components have the same optimisation as PureComponent?

They do not, see this: https://jsfiddle.net/Daniel15/8t39ov1z/1/

@gaearon
Copy link
Collaborator

gaearon commented Oct 23, 2016

Thanks for PR! We set up a separate place for PureComponent in new docs, and now link there from PureRenderMixin doc.

@gaearon gaearon closed this Oct 23, 2016
@gaearon gaearon deleted the Daniel15-patch-2 branch October 23, 2016 14:35
@Daniel15
Copy link
Member Author

Thank you Dan! :D

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.

7 participants