diff --git a/src/js/CheckboxTree.js b/src/js/CheckboxTree.js index dff16766..d0b3d542 100644 --- a/src/js/CheckboxTree.js +++ b/src/js/CheckboxTree.js @@ -1,5 +1,6 @@ import classNames from 'classnames'; import isEqual from 'lodash/isEqual'; +import memoize from 'lodash/memoize'; import { nanoid } from 'nanoid'; import PropTypes from 'prop-types'; import React from 'react'; @@ -102,6 +103,8 @@ class CheckboxTree extends React.Component { this.onNodeClick = this.onNodeClick.bind(this); this.onExpandAll = this.onExpandAll.bind(this); this.onCollapseAll = this.onCollapseAll.bind(this); + + this.combineMemorized = memoize((icons1, icons2) => ({ ...icons1, ...icons2 })).bind(this); } // eslint-disable-next-line react/sort-comp @@ -250,7 +253,7 @@ class CheckboxTree extends React.Component { expandOnClick={expandOnClick} expanded={flatNode.expanded} icon={node.icon} - icons={{ ...defaultIcons, ...icons }} + icons={this.combineMemorized(defaultIcons, icons)} label={node.label} lang={lang} optimisticToggle={optimisticToggle} diff --git a/src/js/TreeNode.js b/src/js/TreeNode.js index 71ba66d7..3b4f7307 100644 --- a/src/js/TreeNode.js +++ b/src/js/TreeNode.js @@ -7,7 +7,7 @@ import NativeCheckbox from './NativeCheckbox'; import iconsShape from './shapes/iconsShape'; import languageShape from './shapes/languageShape'; -class TreeNode extends React.Component { +class TreeNode extends React.PureComponent { static propTypes = { checked: PropTypes.number.isRequired, disabled: PropTypes.bool.isRequired,