Merge pull request #13339 from apache/list-remove-chunk

[5.0] [Performance] Remove chunk in List storage

src/chart/line/poly.ts

@@ -77,7 +77,7 @@ function drawSegment(
             const dy = y - prevY;
 
             // Ignore tiny segment.
-            if ((dx * dx + dy * dy) < 1) {
+            if ((dx * dx + dy * dy) < 0.5) {
                 idx += dir;
                 continue;
             }

src/data/helper/dataProvider.ts

@@ -34,11 +34,10 @@ import {
     SERIES_LAYOUT_BY_COLUMN,
     SERIES_LAYOUT_BY_ROW,
     DimensionName, DimensionIndex, OptionSourceData,
-    DimensionIndexLoose, OptionDataItem, OptionDataValue, SourceFormat, SeriesLayoutBy
+    DimensionIndexLoose, OptionDataItem, OptionDataValue, SourceFormat, SeriesLayoutBy, ParsedValue
 } from '../../util/types';
 import List from '../List';
 
-
 export interface DataProvider {
     // If data is pure without style configuration
     pure: boolean;
@@ -48,6 +47,12 @@ export interface DataProvider {
     getSource(): Source;
     count(): number;
     getItem(idx: number, out?: OptionDataItem): OptionDataItem;
+    fillStorage?(
+        start: number,
+        end: number,
+        out: ArrayLike<ParsedValue>[],
+        extent: number[][]
+    ): void
     appendData(newData: ArrayLike<OptionDataItem>): void;
     clean(): void;
 }
@@ -56,6 +61,14 @@ export interface DataProvider {
 let providerMethods: Dictionary<any>;
 let mountMethods: (provider: DefaultDataProvider, data: OptionSourceData, source: Source) => void;
 
+export interface DefaultDataProvider {
+    fillStorage?(
+        start: number,
+        end: number,
+        out: ArrayLike<ParsedValue>[],
+        extent: number[][]
+    ): void
+}
 /**
  * If normal array used, mutable chunk size is supported.
  * If typed array used, chunk size must be fixed.
@@ -144,6 +157,7 @@ export class DefaultDataProvider implements DataProvider {
             if (sourceFormat === SOURCE_FORMAT_TYPED_ARRAY) {
                 provider.getItem = getItemForTypedArray;
                 provider.count = countForTypedArray;
+                provider.fillStorage = fillStorageForTypedArray;
             }
             else {
                 const rawItemGetter = getRawSourceItemGetter(sourceFormat, seriesLayoutBy);
@@ -167,6 +181,29 @@ export class DefaultDataProvider implements DataProvider {
             return out;
         };
 
+        const fillStorageForTypedArray: DefaultDataProvider['fillStorage'] = function (
+            this: DefaultDataProvider, start: number, end: number, storage: ArrayLike<ParsedValue>[], extent: number[][]
+        ) {
+            const data = this._data as ArrayLike<number>;
+            const dimSize = this._dimSize;
+
+            for (let dim = 0; dim < dimSize; dim++) {
+                const dimExtent = extent[dim];
+                let min = dimExtent[0] == null ? Infinity : dimExtent[0];
+                let max = dimExtent[1] == null ? -Infinity : dimExtent[1];
+                const count = end - start;
+                const arr = storage[dim];
+                for (let i = 0; i < count; i++) {
+                    const val = data[(start + i) * dimSize + dim];
+                    arr[start + i] = val;
+                    val < min && (min = val);
+                    val > max && (max = val);
+                }
+                dimExtent[0] = min;
+                dimExtent[1] = max;
+            }
+        };
+
         const countForTypedArray: DefaultDataProvider['count'] = function (
             this: DefaultDataProvider
         ) {

src/processor/dataSample.ts

@@ -83,20 +83,20 @@ export default function (seriesType: string): StageHandler {
             const data = seriesModel.getData();
             const sampling = seriesModel.get('sampling');
             const coordSys = seriesModel.coordinateSystem;
-            // Only cartesian2d support down sampling
-            if (coordSys.type === 'cartesian2d' && sampling) {
+            const count = data.count();
+            // Only cartesian2d support down sampling. Disable it when there is few data.
+            if (count > 10 && coordSys.type === 'cartesian2d' && sampling) {
                 const baseAxis = coordSys.getBaseAxis();
                 const valueAxis = coordSys.getOtherAxis(baseAxis);
                 const extent = baseAxis.getExtent();
+                const dpr = api.getDevicePixelRatio();
                 // Coordinste system has been resized
-                const size = Math.abs(extent[1] - extent[0]);
-                const rate = Math.round(data.count() / size);
+                const size = Math.abs(extent[1] - extent[0]) * (dpr || 1);
+                const rate = Math.round(count / size);
 
                 if (rate > 1) {
                     if (sampling === 'lttb') {
-                        seriesModel.setData(data.lttbDownSample(
-                            data.mapDimension(baseAxis.dim), data.mapDimension(valueAxis.dim), size
-                        ));
+                        seriesModel.setData(data.lttbDownSample(data.mapDimension(valueAxis.dim), 1 / rate));
                     }
                     let sampler;
                     if (typeof sampling === 'string') {

test/sample-compare.html

@@ -167,9 +167,11 @@ under the License.
 							}]
 						};
 						const startTime = performance.now();
-						myChart.setOption(opts, true);
+						myChart.setOption(opts, {
+							notMerge: true
+						});
 						const endTime = performance.now();
-						titleDom.innerHTML = `${title}(${data.length / 4}) ${(endTime - startTime).toFixed(0)} ms`;
+						titleDom.innerHTML = `${title}(${data.length / 4 * 3}) ${(endTime - startTime).toFixed(0)} ms`;
 					}
 					let status = document.getElementById('status');
 					status.textContent = 'Fetching data.json (2.07MB)....';
@@ -185,10 +187,12 @@ under the License.
 									makeChart(data, 'warmup');
 									makeChart(data, 'warmup', 'lttb');
 									makeChart(data, 'warmup', 'average');
+									makeChart(data, 'warmup', 'max');
 								}
 								status.textContent = 'Running';
 								setTimeout(() => makeChart(data, 'No Sampling', null), 500);
 								setTimeout(() => makeChart(data, 'LTTB Sampling', 'lttb'), 1000);
+								setTimeout(() => makeChart(data, 'Max Sampling', 'max'), 1500);
 								setTimeout(() => makeChart(data, 'Average Sampling', 'average'), 1500);
 							});
 						});