[dashboard scoped filter] Reduce calls to expensive safeStringify (#8595)

* [dashboard scoped filter] Reduce calls to expensive safeStringify

* better handle empty or null scope settings
This commit is contained in:
Grace Guo 2019-11-18 20:49:28 -08:00 committed by GitHub
parent 7d14b71a93
commit f42aae843c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 18 deletions

View File

@ -31,7 +31,7 @@ import {
} from '../util/propShapes';
import { LOG_ACTIONS_MOUNT_DASHBOARD } from '../../logger/LogUtils';
import OmniContainer from '../../components/OmniContainer';
import { safeStringify } from '../../utils/safeStringify';
import { areObjectsEqual } from '../../reduxUtils';
import '../stylesheets/index.less';
@ -117,10 +117,7 @@ class Dashboard extends React.PureComponent {
const appliedFilters = this.appliedFilters;
const { activeFilters } = this.props;
// do not apply filter when dashboard in edit mode
if (
!editMode &&
safeStringify(appliedFilters) !== safeStringify(activeFilters)
) {
if (!editMode && !areObjectsEqual(appliedFilters, activeFilters)) {
// refresh charts if a filter was removed, added, or changed
const currFilterKeys = Object.keys(activeFilters);
const appliedFilterKeys = Object.keys(appliedFilters);
@ -134,15 +131,10 @@ class Dashboard extends React.PureComponent {
} else if (!appliedFilterKeys.includes(filterKey)) {
// added filter?
[].push.apply(affectedChartIds, activeFilters[filterKey].scope);
} else if (
safeStringify(activeFilters[filterKey].values) !==
safeStringify(appliedFilters[filterKey].values) ||
safeStringify(activeFilters[filterKey].scope) !==
safeStringify(appliedFilters[filterKey].scope)
) {
// changed filter field value?
const affectedScope = activeFilters[filterKey].scope.concat(
appliedFilters[filterKey].scope,
} else {
// changed filter field value or scope?
const affectedScope = (activeFilters[filterKey].scope || []).concat(
appliedFilters[filterKey].scope || [],
);
[].push.apply(affectedChartIds, affectedScope);
}

View File

@ -30,7 +30,6 @@ import {
LOG_ACTIONS_EXPORT_CSV_DASHBOARD_CHART,
LOG_ACTIONS_FORCE_REFRESH_CHART,
} from '../../../logger/LogUtils';
import { safeStringify } from '../../../utils/safeStringify';
import { isFilterBox } from '../../util/activeDashboardFilters';
import getFilterValuesByFilterId from '../../util/getFilterValuesByFilterId';
@ -119,9 +118,7 @@ class Chart extends React.Component {
for (let i = 0; i < SHOULD_UPDATE_ON_PROP_CHANGES.length; i += 1) {
const prop = SHOULD_UPDATE_ON_PROP_CHANGES[i];
if (
safeStringify(nextProps[prop]) !== safeStringify(this.props[prop])
) {
if (nextProps[prop] !== this.props[prop]) {
return true;
}
}