diff --git a/package.json b/package.json index ecccc6f..d56d46f 100644 --- a/package.json +++ b/package.json @@ -40,9 +40,9 @@ }, "dependencies": { "eventemitter3": "^1.1.0", + "fbjs": "^0.8.3", "lodash": "^4.6.1", "point-geometry": "0.0.0", - "react-pure-render": "^1.0.1", "scriptjs": "^2.5.7" }, "devDependencies": { diff --git a/src/google_map.js b/src/google_map.js index e932162..8aa26b5 100644 --- a/src/google_map.js +++ b/src/google_map.js @@ -1,7 +1,7 @@ import React, {PropTypes, Component} from 'react'; import ReactDOM from 'react-dom'; -import shouldPureComponentUpdate from 'react-pure-render/function'; +import shallowEqual from 'fbjs/lib/shallowEqual'; import MarkerDispatcher from './marker_dispatcher'; @@ -22,7 +22,7 @@ import log2 from './utils/math/log2'; import assign from 'lodash/assign'; import isNumber from 'lodash/isNumber'; - +import omit from './utils/omit'; const kEPS = 0.00001; const K_GOOGLE_TILE_SIZE = 256; @@ -262,7 +262,13 @@ export default class GoogleMap extends Component { } } - shouldComponentUpdate = shouldPureComponentUpdate; + shouldComponentUpdate(nextProps) { + // draggable does not affect inner components + return !shallowEqual( + omit(this.props, ['draggable']), + omit(nextProps, ['draggable']) + ); + } componentDidUpdate(prevProps) { this.markersDispatcher_.emit('kON_CHANGE'); diff --git a/src/google_map_markers.js b/src/google_map_markers.js index e606938..afab1ed 100644 --- a/src/google_map_markers.js +++ b/src/google_map_markers.js @@ -1,6 +1,5 @@ import React, {PropTypes, Component} from 'react'; - -import shouldPureComponentUpdate from 'react-pure-render/function'; +import shallowEqual from 'fbjs/lib/shallowEqual'; const mainStyle = { width: '100%', @@ -56,7 +55,9 @@ export default class GoogleMapMarkers extends Component { this.state = {...this._getState(), hoverKey: null}; } - shouldComponentUpdate = shouldPureComponentUpdate; + shouldComponentUpdate(nextProps) { + return !shallowEqual(this.props, nextProps); + } componentWillUnmount() { this.props.dispatcher.removeListener('kON_CHANGE', this._onChangeHandler); diff --git a/src/utils/omit.js b/src/utils/omit.js new file mode 100644 index 0000000..8a27b3c --- /dev/null +++ b/src/utils/omit.js @@ -0,0 +1,13 @@ +// https://github.com/acdlite/recompose/blob/master/src/packages/recompose/utils/omit.js +const omit = (obj, keys) => { + const { ...rest } = obj; + for (let i = 0; i < keys.length; i++) { + const key = keys[i]; + if (rest.hasOwnProperty(key)) { + delete rest[key]; + } + } + return rest; +}; + +export default omit;