Skip to content

Commit

Permalink
Don't use inlined arrow functions in component props/attributes. It w…
Browse files Browse the repository at this point in the history
…ill create new function every time causing performance degradation in React applications.
  • Loading branch information
LiborOl committed Jan 17, 2018
1 parent c208681 commit 54bc126
Showing 1 changed file with 13 additions and 2 deletions.
15 changes: 13 additions & 2 deletions lib/AnimakitExpander.es6
Expand Up @@ -16,6 +16,9 @@ export default class AnimakitExpander extends Component {

duration: 0,
};

this.setRootNode = this.setRootNode.bind(this);
this.setContentNode = this.setContentNode.bind(this);
}

componentWillMount() {
Expand Down Expand Up @@ -233,18 +236,26 @@ export default class AnimakitExpander extends Component {
}
}

setRootNode(c) {
this.rootNode = c;
}

setContentNode(c) {
this.contentNode = c;
}

render() {
const { animation, expanded, prepare } = this.state;
const showChildren = expanded || prepare || animation;
const hasChildren = !!this.props.children;

return (
<div
ref={(c) => { this.rootNode = c; }}
ref={this.setRootNode}
style={ showChildren ? this.getRootStyles() : {} }
>
<div
ref={(c) => { this.contentNode = c; }}
ref={this.setContentNode}
style={ showChildren ? this.getContentStyles() : {} }
>
{ showChildren && hasChildren && this.getClearance() }
Expand Down

0 comments on commit 54bc126

Please sign in to comment.