Skip to content

Commit

Permalink
feat: 更新 g 到最新版 (#2631)
Browse files Browse the repository at this point in the history
* WIP

* 更新至 G 最新版本 (#2629)

* chore: update to latest g deps

* chore: update to latest g deps

* chore: update to latest g deps

* chore: update to latest g deps

* chore: update to latest g deps

* fix: 修复序号列 clipPath

* fix: 处理 bbox 惰性计算的问题

* test: 单测修复

* test: 单测修复

* test: 更新 react snapshot

* test: 增加 benchmark

* chore: 升级 @antv/g2

* test: 单测修复

* chore: 更新 s2-site g 相关依赖

---------

Co-authored-by: xiaoiver <[email protected]>
  • Loading branch information
wjgogogo and xiaoiver authored May 7, 2024
1 parent 4ca1918 commit 7647605
Show file tree
Hide file tree
Showing 30 changed files with 4,578 additions and 4,754 deletions.
196 changes: 196 additions & 0 deletions packages/s2-core/__tests__/benchmark/pivot-sheet-spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,196 @@
/* eslint-disable no-console */
import { PivotSheet, S2DataConfig } from '../../src';
import { generateRawData, getContainer } from '../util/helpers';

async function measurePivotSheetRender(s2DataCfg: S2DataConfig, title) {
performance.mark('startTask');
const s2 = new PivotSheet(getContainer(), s2DataCfg, null);

await s2.render();
performance.mark('endTask');

const measure = performance.measure('render', 'startTask', 'endTask');

console.log(title, measure.duration);
}

describe('pivot sheet benchmark', () => {
describe('single values', () => {
const baseDataCfg = {
fields: {
rows: ['province', 'city'],
columns: ['type', 'subType'],
values: ['number'],
},
data: [],
};

test('should render 10 * 100', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 10],
['city', 1],
['type', 10],
['subType', 10],
],
['number'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 10 * 100 for single measure',
);
});

test('should render 100 * 100', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 10],
['city', 10],
['type', 10],
['subType', 10],
],
['number'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 100 * 100 for single measure',
);
});

test('should render 1000 * 100', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 100],
['city', 10],
['type', 10],
['subType', 10],
],
['number'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 1000 * 100 for single measure',
);
});

test('should render 1000 * 1000', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 100],
['city', 10],
['type', 100],
['subType', 10],
],
['number'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 1000 * 1000 for single measure',
);
});
});

describe('multi values', () => {
const baseDataCfg = {
fields: {
rows: ['province', 'city'],
columns: ['type', 'subType'],
values: ['number'],
},
data: [],
};

test('should render 10 * 100', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 10],
['city', 1],
['type', 10],
['subType', 10],
],
['number1', 'number2', 'number3', 'number4', 'number5'],
),
};

await measurePivotSheetRender(s2DataCfg, '🚀 10 * 100 for multi measure');
});

test('should render 100 * 100', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 10],
['city', 10],
['type', 10],
['subType', 10],
],
['number1', 'number2', 'number3', 'number4', 'number5'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 100 * 100 for multi measure',
);
});

test('should render 1000 * 100', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 100],
['city', 10],
['type', 10],
['subType', 10],
],
['number1', 'number2', 'number3', 'number4', 'number5'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 1000 * 100 for multi measure',
);
});

test('should render 1000 * 1000', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 100],
['city', 10],
['type', 100],
['subType', 10],
],
['number1', 'number2', 'number3', 'number4', 'number5'],
),
};

await measurePivotSheetRender(
s2DataCfg,
'🚀 1000 * 1000 for multi measure',
);
});
});
});
92 changes: 92 additions & 0 deletions packages/s2-core/__tests__/benchmark/table-sheet-spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
/* eslint-disable no-console */
import { S2DataConfig, TableSheet } from '../../src';
import { generateRawData, getContainer } from '../util/helpers';

async function measureTableSheetRender(s2DataCfg: S2DataConfig, title) {
performance.mark('startTask');
const s2 = new TableSheet(getContainer(), s2DataCfg, null);

await s2.render();
performance.mark('endTask');

const measure = performance.measure('render', 'startTask', 'endTask');

console.log(title, measure.duration);
}

describe('table sheet benchmark', () => {
const baseDataCfg = {
fields: {
columns: ['province', 'city', 'type', 'subType', 'number'],
},
data: [],
};

test('should render 1000 items', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 10],
['city', 1],
['type', 10],
['subType', 10],
],
['number'],
),
};

await measureTableSheetRender(s2DataCfg, '🚀 1000 items');
});

test('should render 10000 items', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 10],
['city', 10],
['type', 10],
['subType', 10],
],
['number'],
),
};

await measureTableSheetRender(s2DataCfg, '🚀 10000 items');
});

test('should render 10_0000 items', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 100],
['city', 10],
['type', 10],
['subType', 10],
],
['number'],
),
};

await measureTableSheetRender(s2DataCfg, '🚀 10_0000 items');
});

test('should render 100_0000 items', async () => {
const s2DataCfg: S2DataConfig = {
...baseDataCfg,
data: generateRawData(
[
['province', 100],
['city', 10],
['type', 100],
['subType', 10],
],
['number'],
),
};

await measureTableSheetRender(s2DataCfg, '🚀 100_0000 items');
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ const expectScrollBrush = async (
s2.on(S2Event.DATA_CELL_BRUSH_SELECTION, dataCellBrushSelectionFn);

// g5.0 异步渲染,第一时刻底层 base-brush 可能无法通过 elementsFromPointSync 取到元素
await sleep(50);
await sleep(500);

s2.emit(mouseDownEventType, {
target: targetCell,
Expand Down Expand Up @@ -275,10 +275,12 @@ describe('PivotSheet Brush Selection Scroll Tests', () => {
);

await s2.render();
await sleep(20); // wait for anthor loop;
await sleep(20); // wait for another loop;

const rowCell = s2.facet.getRowCells()[0];

s2.getCell = jest.fn(() => rowCell);

s2.emit(S2Event.ROW_CELL_MOUSE_DOWN, {
target: rowCell,
x: 1,
Expand Down
12 changes: 6 additions & 6 deletions packages/s2-core/__tests__/spreadsheet/table-sheet-spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -194,7 +194,7 @@ describe('TableSheet normal spec', () => {

await s2.render();

await sleep(30);
await sleep(100);

let columnNodes = s2.facet.getColNodes();

Expand All @@ -203,8 +203,8 @@ describe('TableSheet normal spec', () => {

s2.getCanvasElement().dispatchEvent(
new PointerEvent('pointerdown', {
clientX: x + width - 0.4,
clientY: top + 25,
clientX: x + width,
clientY: top,
pointerType: 'mouse',
}),
);
Expand All @@ -216,7 +216,7 @@ describe('TableSheet normal spec', () => {
document.dispatchEvent(
new PointerEvent('pointermove', {
clientX: x + width + resizeLength,
clientY: top + 25,
clientY: top,
bubbles: true,
}),
);
Expand All @@ -225,7 +225,7 @@ describe('TableSheet normal spec', () => {
document.dispatchEvent(
new PointerEvent('pointerup', {
clientX: x + width + resizeLength,
clientY: top + 25,
clientY: top,
bubbles: true,
}),
);
Expand All @@ -235,7 +235,7 @@ describe('TableSheet normal spec', () => {
columnNodes = s2.facet.getColNodes();
const endCellWidth = columnNodes[columnNodes.length - 1].width;

expect(Math.floor(endCellWidth - startCellWidth)).toBe(140);
expect(endCellWidth - startCellWidth).toBeGreaterThanOrEqual(resizeLength);
});

test('should render link shape', async () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ describe('GuiIcon Tests', () => {
});

const spy = jest.spyOn(icon, 'getImage');
const oldVal = icon.iconImageShape.style.img;
const oldVal = icon.iconImageShape.style.src;

expect(oldVal).toBeDefined();
icon.setImageAttrs({ fill: 'red' });
Expand Down
2 changes: 1 addition & 1 deletion packages/s2-core/__tests__/unit/facet/pivot-facet-spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ jest.mock('@/sheet-type', () => {
container.getContextService().getDomElement() as HTMLCanvasElement,
hideTooltip: jest.fn(),
interaction: {
intercepts: new Set(),
clearHoverTimer: jest.fn(),
},
measureTextWidth:
Expand Down Expand Up @@ -323,7 +324,6 @@ describe('Pivot Mode Facet Test', () => {

expect(cornerHeader instanceof CornerHeader).toBeTrue();
expect(cornerHeader.children).toHaveLength(3);
expect(cornerHeader.parsedStyle.visibility).toEqual('visible');

expect(
(cornerHeader.children as CornerCell[]).every(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -942,7 +942,7 @@ describe('Interaction Event Controller Tests', () => {
const image = new Image({
name: 'test',
style: {
img: 'https://gw.alipayobjects.com/zos/antfincdn/og1XQOMyyj/1e3a8de1-3b42-405d-9f82-f92cb1c10413.png',
src: 'https://gw.alipayobjects.com/zos/antfincdn/og1XQOMyyj/1e3a8de1-3b42-405d-9f82-f92cb1c10413.png',
},
});

Expand Down
Loading

0 comments on commit 7647605

Please sign in to comment.