From 7681374565c1c6baf77919b6b090a23ff49af503 Mon Sep 17 00:00:00 2001 From: hustcc Date: Thu, 26 Mar 2020 11:49:25 +0800 Subject: [PATCH] refactor(sync-scale): use Map for perf --- src/chart/util/scale-pool.ts | 32 ++++++++++--------- tests/unit/chart/chart-spec.ts | 2 +- .../scale-sync/multi-view-sync-scale-spec.ts | 19 ++++++----- .../view/scale-sync/simple-sync-scale-spec.ts | 12 +++---- 4 files changed, 35 insertions(+), 30 deletions(-) diff --git a/src/chart/util/scale-pool.ts b/src/chart/util/scale-pool.ts index 0e0976c21c..4e68d18ea0 100644 --- a/src/chart/util/scale-pool.ts +++ b/src/chart/util/scale-pool.ts @@ -16,9 +16,9 @@ interface ScaleMeta { /** @ignore */ export class ScalePool { /** 所有的 scales */ - private scales: Record = {}; + private scales = new Map(); /** 需要同步的 scale 分组， key: scaleKeyArray */ - private syncScales: Record = {}; + private syncScales= new Map(); /** * 创建 scale @@ -57,7 +57,7 @@ export class ScalePool { */ public sync() { // 对于 syncScales 中每一个 syncKey 下面的 scale 数组进行同步处理 - each(this.syncScales, (scaleKeys: string[], syncKey: string) => { + this.syncScales.forEach((scaleKeys: string[], syncKey: string) => { // min, max, values let min = Number.MAX_SAFE_INTEGER; let max = Number.MIN_SAFE_INTEGER; @@ -105,7 +105,6 @@ export class ScalePool { */ private cacheScale(scale: Scale, scaleDef: ScaleOption, key: string) { // 1. 缓存到 scales - let sm = this.getScaleMeta(key); // 存在则更新，同时检测类型是否一致 if (sm && sm.scale.type === scale.type) { @@ -119,7 +118,7 @@ export class ScalePool { scaleDef, }; - this.scales[key] = sm; + this.scales.set(key, sm); } // 2. 缓存到 syncScales，构造 Record 数据结构 @@ -131,10 +130,12 @@ export class ScalePool { // 存在 sync 标记才进行 sync if (syncKey) { // 不存在这个 syncKey，则创建一个空数组 - if (!this.syncScales[syncKey]) { - this.syncScales[syncKey] = []; + let scaleKeys = this.syncScales.get(syncKey); + if (!scaleKeys) { + scaleKeys = [] + this.syncScales.set(syncKey, scaleKeys); } - this.syncScales[syncKey].push(key); + scaleKeys.push(key); } } @@ -146,8 +147,9 @@ export class ScalePool { let scaleMeta = this.getScaleMeta(key); if (!scaleMeta) { const field = last(key.split('-')); - if (this.syncScales[field] && this.syncScales[field].length) { - scaleMeta = this.getScaleMeta(this.syncScales[field][0]); + const scaleKeys = this.syncScales.get(field); + if (scaleKeys && scaleKeys.length) { + scaleMeta = this.getScaleMeta(scaleKeys[0]); } } return scaleMeta && scaleMeta.scale; @@ -157,8 +159,8 @@ export class ScalePool { * 清空 */ public clear() { - this.scales = {}; - this.syncScales = {}; + this.scales.clear(); + this.syncScales.clear(); } /** @@ -166,7 +168,7 @@ export class ScalePool { * @param key */ private removeFromSyncScales(key: string) { - each(this.syncScales, (scaleKeys: string[], syncKey: string) => { + this.syncScales.forEach((scaleKeys: string[], syncKey: string) => { const idx = scaleKeys.indexOf(key); if (idx !== -1) { @@ -174,7 +176,7 @@ export class ScalePool { // 删除空数组值 if (scaleKeys.length === 0) { - delete this.syncScales[syncKey]; + this.syncScales.delete(syncKey); } return false; // 跳出循环 @@ -200,6 +202,6 @@ export class ScalePool { * @param key */ private getScaleMeta(key: string): ScaleMeta { - return this.scales[key]; + return this.scales.get(key); } } diff --git a/tests/unit/chart/chart-spec.ts b/tests/unit/chart/chart-spec.ts index 103f423a3b..0d26b16da8 100644 --- a/tests/unit/chart/chart-spec.ts +++ b/tests/unit/chart/chart-spec.ts @@ -153,7 +153,7 @@ describe('Chart', () => { // @ts-ignore expect(chart.filteredData).toEqual([]); // @ts-ignore - expect(chart.scalePool.scales).toEqual({}); + expect(chart.scalePool.scales.size).toBe(0); expect(!!chart.getCoordinate()).toBe(false); // @ts-ignore diff --git a/tests/unit/chart/view/scale-sync/multi-view-sync-scale-spec.ts b/tests/unit/chart/view/scale-sync/multi-view-sync-scale-spec.ts index 21e43c1310..17dc5d6f71 100644 --- a/tests/unit/chart/view/scale-sync/multi-view-sync-scale-spec.ts +++ b/tests/unit/chart/view/scale-sync/multi-view-sync-scale-spec.ts @@ -66,9 +66,9 @@ describe('sync scale with multi-view', () => { expect(v2Profit.min).toBe(0); expect(v2Profit.max).toBe(80); // @ts-ignore - expect(Object.keys(chart.scalePool.scales).length).toBe(7); + expect(chart.scalePool.scales.size).toBe(7); // @ts-ignore - expect(Object.keys(chart.scalePool.syncScales).length).toBe(0); + expect(chart.scalePool.syncScales.size).toBe(0); }); it('sync scale, and update', () => { @@ -114,9 +114,12 @@ describe('sync scale with multi-view', () => { // v1sale 和 v2sale 不同步 expect(v1Sale.max).not.toBe(v2Sale.max); // @ts-ignore - expect(Object.keys(chart.scalePool.syncScales)).toStrictEqual(['city', 'sale', 'value']); - // @ts-ignore - expect(chart.scalePool.syncScales.value.length).toBe(2); + const syncScales = chart.scalePool.syncScales; + expect(syncScales.get('city')).toBeDefined(); + expect(syncScales.get('sale')).toBeDefined(); + expect(syncScales.get('value')).toBeDefined(); + expect(syncScales.size).toBe(3); + expect(syncScales.get('value').length).toBe(2); // @ts-ignore expect(chart.scalePool.getScaleMeta('view2-sale').scaleDef.sync).toBe(true); @@ -131,7 +134,7 @@ describe('sync scale with multi-view', () => { // 分类 scale 在同步之后，进行调整左右 range // @ts-ignore - expect(chart.scalePool.scales['view3-city'].scale.range).toEqual([0.125, 0.875]); + expect(chart.scalePool.scales.get('view3-city').scale.range).toEqual([0.125, 0.875]); }); it('sync = false', () => { @@ -165,9 +168,9 @@ describe('sync scale with multi-view', () => { expect(v1Sale.max).not.toBe(v2Profit.max); expect(v2Sale.max).not.toBe(v2Profit.max); // @ts-ignore - expect(Object.keys(chart.scalePool.scales).length).toBe(7); + expect(chart.scalePool.scales.size).toBe(7); // @ts-ignore - expect(Object.keys(chart.scalePool.syncScales).length).toBe(0); + expect(chart.scalePool.syncScales.size).toBe(0); // @ts-ignore expect(chart.scalePool.getScaleMeta('view2-sale').scaleDef.sync).toBe(false); }); diff --git a/tests/unit/chart/view/scale-sync/simple-sync-scale-spec.ts b/tests/unit/chart/view/scale-sync/simple-sync-scale-spec.ts index e8c71fc80b..656de9cc6b 100644 --- a/tests/unit/chart/view/scale-sync/simple-sync-scale-spec.ts +++ b/tests/unit/chart/view/scale-sync/simple-sync-scale-spec.ts @@ -34,9 +34,9 @@ describe('sync scale', () => { expect(profit.min).toBe(3); expect(profit.max).toBe(130); // @ts-ignore - expect(Object.keys(chart.scalePool.scales).length).toBe(4); + expect(chart.scalePool.scales.size).toBe(4); // @ts-ignore - expect(Object.keys(chart.scalePool.syncScales).length).toBe(0); + expect(chart.scalePool.syncScales.size).toBe(0); }); it('sync scale, and update', () => { @@ -60,9 +60,9 @@ describe('sync scale', () => { expect(profit.min).toBe(0); expect(profit.max).toBe(310); // @ts-ignore - expect(Object.keys(chart.scalePool.syncScales).length).toBe(1); + expect(chart.scalePool.syncScales.size).toBe(1); // @ts-ignore - expect(chart.scalePool.syncScales.value.length).toBe(2); + expect(chart.scalePool.syncScales.get('value').length).toBe(2); }); it('sync = false', () => { @@ -86,9 +86,9 @@ describe('sync scale', () => { expect(profit.min).toBe(3); expect(profit.max).toBe(130); // @ts-ignore - expect(Object.keys(chart.scalePool.scales).length).toBe(4); + expect(chart.scalePool.scales.size).toBe(4); // @ts-ignore - expect(Object.keys(chart.scalePool.syncScales).length).toBe(0); + expect(chart.scalePool.syncScales.size).toBe(0); }); afterAll(() => {