Release (#1819)

* fix: when an element is destroyed, its child elements are not destroyed (#1817)

* fix: when an element is destroyed, its child elements are not destroyed

* chore: add changeset

* Version Packages (#1818)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

__tests__/demos/perf/canvas-api.ts

@@ -0,0 +1,76 @@
+import * as lil from 'lil-gui';
+import { type Canvas } from '@antv/g';
+import * as tinybench from 'tinybench';
+
+export async function canvasApi(context: { canvas: Canvas; gui: lil.GUI }) {
+  const { canvas } = context;
+  console.log(canvas);
+
+  await canvas.ready;
+
+  // benchmark
+  // ----------
+  const bench = new tinybench.Bench({ name: 'canvas benchmark', time: 100 });
+
+  const canvasContext = canvas
+    .getContextService()
+    .getContext() as CanvasRenderingContext2D;
+  const offscreenCanvas = new OffscreenCanvas(
+    canvas.getConfig().width,
+    canvas.getConfig().height,
+  ).getContext('2d');
+  const props = {
+    fillStyle: '#000',
+    strokeStyle: '#000',
+    globalAlpha: 1,
+    globalCompositeOperation: 'source-over',
+    filter: 'none',
+  };
+  const propsKeys = Object.keys(props);
+
+  bench.add('get object props', () => {
+    propsKeys.forEach((key) => {
+      props[key];
+    });
+  });
+  bench.add('set object props', () => {
+    propsKeys.forEach((key) => {
+      props[key] = props[key];
+    });
+  });
+
+  propsKeys.forEach((key) => {
+    bench.add(`get canvas context props - ${key}`, async () => {
+      canvasContext[key];
+    });
+    bench.add(`set canvas context props - ${key}`, async () => {
+      canvasContext[key] = canvasContext[key];
+    });
+  });
+  bench.add('canvas context save() & restore()', async () => {
+    canvasContext.save();
+    canvasContext.restore();
+  });
+
+  propsKeys.forEach((key) => {
+    bench.add(`get offscreenCanvas context props - ${key}`, async () => {
+      offscreenCanvas[key];
+    });
+    bench.add(`set offscreenCanvas context props - ${key}`, async () => {
+      offscreenCanvas[key] = canvasContext[key];
+    });
+  });
+  bench.add('canvas offscreenCanvas save() & restore()', async () => {
+    offscreenCanvas.save();
+    offscreenCanvas.restore();
+  });
+
+  await bench.run();
+
+  console.log(bench.name);
+  console.table(bench.table());
+  console.log(bench.results);
+  console.log(bench.tasks);
+
+  // ----------
+}

__tests__/demos/perf/image.ts

@@ -1,11 +1,12 @@
-import { Canvas, Image as GImage } from '@antv/g';
+import { Canvas, Group, Image as GImage } from '@antv/g';
 import * as lil from 'lil-gui';
 
 export async function image(context: { canvas: Canvas; gui: lil.GUI }) {
   const { canvas, gui } = context;
   await canvas.ready;
   console.log(canvas);
 
+  const group = new Group();
   let image = new GImage({
     style: {
       x: 0,
@@ -17,7 +18,9 @@ export async function image(context: { canvas: Canvas; gui: lil.GUI }) {
       src: 'https://mdn.alipayobjects.com/huamei_fr7vu1/afts/img/A*SqloToP7R9QAAAAAAAAAAAAADkn0AQ/original',
     },
   });
-  canvas.appendChild(image);
+
+  group.appendChild(image);
+  canvas.appendChild(group);
 
   // ---
   const $dom = canvas.getContextService().getDomElement() as HTMLCanvasElement;

__tests__/demos/perf/javascript.ts

@@ -0,0 +1,120 @@
+import * as lil from 'lil-gui';
+import { type Canvas } from '@antv/g';
+import * as tinybench from 'tinybench';
+import { isNil } from '@antv/util';
+
+export async function javascript(context: { canvas: Canvas; gui: lil.GUI }) {
+  const { canvas } = context;
+  console.log(canvas);
+
+  await canvas.ready;
+
+  // benchmark
+  // ----------
+  const bench = new tinybench.Bench({ name: 'canvas benchmark', time: 1e2 });
+  const array = [
+    'stroke',
+    'shadowType',
+    'shadowOffsetX',
+    'shadowOffsetY',
+    'shadowBlur',
+    'lineWidth',
+    'increasedLineWidthForHitTesting',
+    'lineJoin',
+    'lineCap',
+    'dx',
+    'dy',
+    'filter',
+    'textPathStartOffset',
+    'transformOrigin',
+    'cx',
+    'cy',
+    'cz',
+    'r',
+    'rx',
+    'ry',
+    'x',
+    'y',
+    'z',
+    'width',
+    'height',
+    'radius',
+    'x1',
+    'y1',
+    'z1',
+    'x2',
+    'y2',
+    'z2',
+    'd',
+    'points',
+    'text',
+    'textTransform',
+    'font',
+    'fontSize',
+    'fontFamily',
+    'fontStyle',
+    'fontWeight',
+    'fontVariant',
+    'lineHeight',
+    'letterSpacing',
+    'miterLimit',
+    'wordWrap',
+    'wordWrapWidth',
+    'maxLines',
+    'textOverflow',
+    'leading',
+    'textBaseline',
+    'textAlign',
+    'markerStartOffset',
+    'markerEndOffset',
+  ];
+  const object = { stroke: '', fill: '' };
+
+  // bench.add('for', async () => {
+  //   for (let i = 0; i < array.length; i++) {
+  //     if (array[i] in object) {
+  //       break;
+  //     }
+  //   }
+  // });
+  // bench.add('for & typeof', async () => {
+  //   for (let i = 0; i < array.length; i++) {
+  //     if (typeof object[array[i]] !== 'undefined') {
+  //       break;
+  //     }
+  //   }
+  // });
+  // bench.add('object.keys', async () => {
+  //   Object.keys(object).some((name) => array.includes(name));
+  // });
+  // bench.add('array.some', async () => {
+  //   array.some((name) => name in object);
+  // });
+
+  // const value = '';
+  // bench.add('typeof - isNil', async () => {
+  //   !(typeof value === 'undefined' || value === null);
+  // });
+  // bench.add('@antv/util - isNil', async () => {
+  //   !isNil(value);
+  // });
+
+  const stringKey = 'fill';
+  const objectKey = { a: 1 };
+  const map = new Map();
+  bench.add('Map set - stringKey', async () => {
+    map.set(stringKey, 1);
+  });
+  bench.add('Map set - objectKey', async () => {
+    map.set(objectKey, 1);
+  });
+
+  await bench.run();
+
+  console.log(bench.name);
+  console.table(bench.table());
+  console.log(bench.results);
+  console.log(bench.tasks);
+
+  // ----------
+}

package.json

@@ -112,6 +112,7 @@
     "simplex-noise": "^3.0.0",
     "sinon": "^11.1.2",
     "stats.js": "^0.17.0",
+    "tinybench": "^3.0.3",
     "ts-jest": "^29.1.1",
     "typescript": "^5.6.2",
     "vite": "^3.2.7",

packages/g-camera-api/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @antv/g-camera-api
 
+## 2.0.20
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+
 ## 2.0.19
 
 ### Patch Changes

packages/g-camera-api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-camera-api",
-  "version": "2.0.19",
+  "version": "2.0.20",
   "description": "A simple implementation of Camera API.",
   "keywords": [
     "antv",

packages/g-canvas/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @antv/g-canvas
 
+## 2.0.22
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+    -   @antv/g-plugin-canvas-path-generator@2.1.1
+    -   @antv/g-plugin-canvas-picker@2.1.1
+    -   @antv/g-plugin-canvas-renderer@2.2.1
+    -   @antv/g-plugin-dom-interaction@2.1.6
+    -   @antv/g-plugin-html-renderer@2.1.6
+    -   @antv/g-plugin-image-loader@2.1.1
+
 ## 2.0.21
 
 ### Patch Changes

packages/g-canvas/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-canvas",
-  "version": "2.0.21",
+  "version": "2.0.22",
   "description": "A renderer implemented by Canvas 2D API",
   "keywords": [
     "antv",

packages/g-canvaskit/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @antv/g-canvaskit
 
+## 1.0.21
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+    -   @antv/g-plugin-canvas-path-generator@2.1.1
+    -   @antv/g-plugin-canvas-picker@2.1.1
+    -   @antv/g-plugin-canvaskit-renderer@2.1.1
+    -   @antv/g-plugin-dom-interaction@2.1.6
+    -   @antv/g-plugin-html-renderer@2.1.6
+    -   @antv/g-plugin-image-loader@2.1.1
+
 ## 1.0.20
 
 ### Patch Changes

packages/g-canvaskit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-canvaskit",
-  "version": "1.0.20",
+  "version": "1.0.21",
   "description": "A renderer implemented by CanvasKit",
   "keywords": [
     "antv",

packages/g-components/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @antv/g-components
 
+## 2.0.17
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+
 ## 2.0.16
 
 ### Patch Changes

packages/g-components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-components",
-  "version": "2.0.16",
+  "version": "2.0.17",
   "description": "Components for g",
   "keywords": [
     "antv",

packages/g-dom-mutation-observer-api/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @antv/g-dom-mutation-observer-api
 
+## 2.0.17
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+
 ## 2.0.16
 
 ### Patch Changes

packages/g-dom-mutation-observer-api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-dom-mutation-observer-api",
-  "version": "2.0.16",
+  "version": "2.0.17",
   "description": "A simple implementation of DOM MutationObserver API.",
   "keywords": [
     "antv",

packages/g-gesture/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @antv/g-gesture
 
+## 3.0.17
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+
 ## 3.0.16
 
 ### Patch Changes

packages/g-gesture/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-gesture",
-  "version": "3.0.16",
+  "version": "3.0.17",
   "description": "G Gesture",
   "keywords": [
     "antv",

packages/g-image-exporter/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @antv/g-image-exporter
 
+## 1.0.17
+
+### Patch Changes
+
+-   Updated dependencies [939663c2]
+    -   @antv/g-lite@2.2.1
+
 ## 1.0.16
 
 ### Patch Changes

packages/g-image-exporter/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-image-exporter",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "description": "A image exporter for G using DOM API",
   "keywords": [
     "antv",