QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-19 08:04:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf(dashboard): reduce number of rerenders of Charts (#16444)

Browse Source 
* perf(dashboard): reduce number of rerenders of Charts

* Remove static property

* Cleanup
This commit is contained in:
Kamil Gabryjelski
2021-08-26 21:53:44 +02:00
committed by GitHub
parent ac1d779a30
commit 8ad495a572
4 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
superset-frontend/src/dashboard/actions/hydrate.js
View File

@@ -371,8 +371,8 @@ export const hydrateDashboard = (dashboardData, chartData) => (
// only persistent refreshFrequency will be saved to backend
shouldPersistRefreshFrequency: false,
css: dashboardData.css || '',
colorNamespace: metadata?.color_namespace || null,
colorScheme: metadata?.color_scheme || null,
colorNamespace: metadata?.color_namespace,
colorScheme: metadata?.color_scheme,
editMode: canEdit && editMode,
isPublished: dashboardData.published,
hasUnsavedChanges: false,

3
superset-frontend/src/dashboard/components/gridComponents/Chart.jsx
View File

@@ -87,7 +87,8 @@ const defaultProps = {
// resizing across all slices on a dashboard on every update
const RESIZE_TIMEOUT = 350;
const SHOULD_UPDATE_ON_PROP_CHANGES = Object.keys(propTypes).filter(
prop => prop !== 'width' && prop !== 'height',
prop =>
prop !== 'width' && prop !== 'height' && prop !== 'isComponentVisible',
);
const OVERFLOWABLE_VIZ_TYPES = new Set(['filter_box']);
const DEFAULT_HEADER_HEIGHT = 22;

6
superset-frontend/src/dashboard/containers/Chart.jsx
View File

@@ -37,7 +37,7 @@ import getFormDataWithExtraFilters from '../util/charts/getFormDataWithExtraFilt
import Chart from '../components/gridComponents/Chart';
import { PLACEHOLDER_DATASOURCE } from '../constants';
const EMPTY_FILTERS = {};
const EMPTY_OBJECT = {};
function mapStateToProps(
{
@@ -54,7 +54,7 @@ function mapStateToProps(
ownProps,
) {
const { id } = ownProps;
const chart = chartQueries[id] || {};
const chart = chartQueries[id] || EMPTY_OBJECT;
const datasource =
(chart && chart.form_data && datasources[chart.form_data.datasource]) ||
PLACEHOLDER_DATASOURCE;
@@ -82,7 +82,7 @@ function mapStateToProps(
datasource,
slice: sliceEntities.slices[id],
timeout: dashboardInfo.common.conf.SUPERSET_WEBSERVER_TIMEOUT,
filters: getActiveFilters() || EMPTY_FILTERS,
filters: getActiveFilters() || EMPTY_OBJECT,
formData,
editMode: dashboardState.editMode,
isExpanded: !!dashboardState.expandedSlices[id],

19
superset-frontend/src/dashboard/util/charts/getFormDataWithExtraFilters.ts
View File

@@ -25,6 +25,7 @@ import {
import { ChartQueryPayload, Charts, LayoutItem } from 'src/dashboard/types';
import { getExtraFormData } from 'src/dashboard/components/nativeFilters/utils';
import { DataMaskStateWithId } from 'src/dataMask/types';
import { areObjectsEqual } from 'src/reduxUtils';
import getEffectiveExtraFilters from './getEffectiveExtraFilters';
import { ChartConfiguration, NativeFiltersState } from '../../reducers/types';
import { getAllActiveFilters } from '../activeAllDashboardFilters';
@@ -67,16 +68,18 @@ export default function getFormDataWithExtraFilters({
const labelColors = scale.getColorMap();
// if dashboard metadata + filters have not changed, use cache if possible
const cachedFormData = cachedFormdataByChart[sliceId];
if (
(cachedFiltersByChart[sliceId] || {}) === filters &&
(colorScheme == null ||
cachedFormdataByChart[sliceId].color_scheme === colorScheme) &&
cachedFormdataByChart[sliceId].color_namespace === colorNamespace &&
isEqual(cachedFormdataByChart[sliceId].label_colors, labelColors) &&
!!cachedFormdataByChart[sliceId] &&
dataMask === undefined
cachedFiltersByChart[sliceId] === filters &&
cachedFormData?.color_scheme === colorScheme &&
cachedFormData?.color_namespace === colorNamespace &&
isEqual(cachedFormData?.label_colors, labelColors) &&
!!cachedFormData &&
areObjectsEqual(cachedFormData?.dataMask, dataMask, {
ignoreUndefined: true,
})
) {
return cachedFormdataByChart[sliceId];
return cachedFormData;
}
let extraData: { extra_form_data?: JsonObject } = {};