webgpu-computed 0.0.9 → 0.0.10

package/README.md

@@ -1,76 +1,76 @@
 # webgpu-computed
 
-🌐 其他语言版本：
-- [English](./README.en.md)
+🌐 Other language versions:
+- [简体中文](https://github.com/xiaguochuqiu/webgpu-computed/blob/main/README.zh.md)
 
-一个简化的 WebGPU 计算库，封装了繁琐的初始化和缓冲区管理，让开发者专注于 WGSL 着色器逻辑。
+A simplified WebGPU computing library that encapsulates tedious initialization and buffer management, allowing developers to focus on WGSL shader logic.
 
-## 特性
+## Features
 
-- 🚀 简化的 WebGPU 初始化
-- 📦 自动缓冲区管理和布局计算
-- 🔧 支持复杂数据结构（向量、矩阵）
-- ⚡ 高性能 GPU 计算
-- 📚 内置常用 WGSL 函数
-- ✅ 支持 Node.js 环境
-- 🛠️ TypeScript 支持
-- 📖 详细的中文文档和示例
+- 🚀 Simplified WebGPU initialization
+- 📦 Automatic buffer management and layout calculation
+- 🔧 Support for complex data structures (vectors, matrices)
+- ⚡ High-performance GPU computing
+- 📚 Built-in common WGSL functions
+- ✅ Support for Node.js environment
+- 🛠️ TypeScript support
+- 📖 Detailed English documentation and examples
 
-## 安装
+## Installation
 
 ```bash
 npm install webgpu-computed
 ```
 
-## 快速开始
+## Quick Start
 
-### 1. 初始化 WebGPU
+### 1. Initialize WebGPU
 
-在使用任何计算功能之前，需要初始化 WebGPU 环境：
+Before using any computing features, you need to initialize the WebGPU environment:
 
 ```javascript
 import { GpuComputed } from 'webgpu-computed';
 
-// 初始化 WebGPU
+// Initialize WebGPU
 await GpuComputed.init();
 
-// 在 Node.js 环境中使用后，请调用：
+// After using in Node.js environment, please call:
 // GpuComputed.destroy()
 ```
 
-### 2. 执行简单计算
+### 2. Perform Simple Computation
 
-以下是一个简单的向量加法示例：
+Here is a simple vector addition example:
 
 ```javascript
 import { GpuComputed } from 'webgpu-computed';
 
-// 准备数据
+// Prepare data
 const data = {
   inputA: [1.0, 2.0, 3.0, 4.0],
   inputB: [0.5, 1.5, 2.5, 3.5],
-  output: new Array(4).fill(0) // 输出缓冲区
+  output: new Array(4).fill(0) // Output buffer
 };
 
-// WGSL 计算代码
+// WGSL computation code
 const code = `
   output[index] = inputA[index] + inputB[index];
 `;
 
-// 执行计算
+// Execute computation
 GpuComputed.computed({
   code,
   data,
-  synchronize: ["output"], // 需要返回的数据字段
-  workgroupCount: [1] // 工作组数量
+  synchronize: ["output"], // Fields to return
+  workgroupCount: [1] // Number of workgroups
 }).then(results => {
     console.log(results); // [[1.5, 3.5, 5.5, 7.5]]
 })
 ```
 
-### 3. 使用复杂数据结构
+### 3. Using Complex Data Structures
 
-该库支持向量和矩阵类型：
+The library supports vector and matrix types:
 
 ```javascript
 const data = {
@@ -86,62 +86,62 @@ const code = `
   output[index].vel = positions[index].vel * 2.0;
 `;
 
-// 执行计算
+// Execute computation
 GpuComputed.computed({
   code,
   data,
-  synchronize: ["output"], // 需要返回的数据字段
-  workgroupCount: [1] // 工作组数量
+  synchronize: ["output"], // Fields to return
+  workgroupCount: [1] // Number of workgroups
 }).then(results => {
     console.log(results); // [[1.100000023841858,2.200000047683716,3.299999952316284,0,0.20000000298023224,0.4000000059604645,0.6000000238418579,0,4.400000095367432,5.5,6.599999904632568,0,0.800000011920929,1,1.2000000476837158,0]]
 })
 ```
 
-### 4. 手动创建 GpuComputed 实例
+### 4. Manually Create GpuComputed Instance
 
-如果您需要更精细的控制，可以直接创建 GpuComputed 实例：
+If you need more fine-grained control, you can directly create a GpuComputed instance:
 
 ```javascript
 import { GpuComputed } from 'webgpu-computed';
 
-// 1. 定义数据模板
+// 1. Define data template
 const template = {
   inputA: [] as number[],
   inputB: [] as number[],
   output: [] as number[]
 };
 
-// 2. 创建实例
+// 2. Create instance
 const gpuComputed = new GpuComputed(template, {
   code: `
     output[index] = inputA[index] + inputB[index];
   `,
-  workgroupSize: [32, 1, 1] // 可选：自定义工作组大小
+  workgroupSize: [32, 1, 1] // Optional: custom workgroup size
 });
 
-// 3. 初始化管线
+// 3. Initialize pipeline
 await gpuComputed.initPipeline();
 
-// 4. 准备数据
+// 4. Prepare data
 const data = {
   inputA: [1.0, 2.0, 3.0, 4.0],
   inputB: [0.5, 1.5, 2.5, 3.5],
   output: new Array(4).fill(0)
 };
 
-// 5. 创建绑定组
+// 5. Create bind group
 const bindGroup = gpuComputed.createBindGroup(data);
 
-// 6. 执行计算
+// 6. Execute computation
 const results = await gpuComputed.computed(bindGroup, [1], ['output']);
 
 console.log(results[0]); // [1.5, 3.5, 5.5, 7.5]
 ```
 
-#### 使用结构体数据
+#### Using Struct Data
 
 ```javascript
-// 定义结构体模板
+// Define struct template
 const structTemplate = {
   particles: {
     layout: [
@@ -183,72 +183,72 @@ const data = {
 const bindGroup = gpuComputed.createBindGroup(data);
 const results = await gpuComputed.computed(bindGroup, [1], ['output']);
 
-console.log(results[0]); // 映射后的数据
+console.log(results[0]); // Mapped data
 ```
 
-#### 数据映射
+#### Data Mapping
 
-当使用结构体时，可以使用 `dataMap` 方法将结果映射回原始结构：
+When using structs, you can use the `dataMap` method to map results back to the original structure:
 
 ```javascript
 const mappedData = gpuComputed.dataMap(results[0], 'output');
-console.log(mappedData); // 返回结构化的对象数组
+console.log(mappedData); // Returns structured object array
 ```
 
-## API 参考
+## API Reference
 
-### GpuComputed 类
+### GpuComputed Class
 
-#### 静态方法
+#### Static Methods
 
 ##### `GpuComputed.init()`
 
-初始化 WebGPU 环境。必须在使用其他功能之前调用。
+Initializes the WebGPU environment. Must be called before using other features.
 
-**返回值**: `Promise<void>`
+**Returns**: `Promise<void>`
 
-**抛出异常**: 如果浏览器不支持 WebGPU 或获取适配器/设备失败
+**Throws**: If the browser does not support WebGPU or fails to obtain adapter/device
 
 ##### `GpuComputed.computed(options)`
 
-执行 GPU 计算任务。
+Executes a GPU computation task.
 
-**参数**:
+**Parameters**:
 
-- `code` (string): WGSL 计算代码
-- `data` (object): 输入/输出数据对象
-- `workgroupCount` (array): 工作组数量 [x, y?, z?]
-- `workgroupSize` (array, 可选): 工作组大小，默认 [32, 1, 1]
-- `globalInvocationIdName` (string, 可选): 全局调用 ID 变量名，默认 "grid"
-- `workgroupIndexName` (string, 可选): 工作组索引变量名，默认 "index"
-- `synchronize` (array, 可选): 需要同步回 CPU 的缓冲区名称数组
-- `beforeCodes` (array, 可选): 计算函数之前的 WGSL 代码片段
-- `onSuccess` (function, 可选): 成功回调函数
+- `code` (string): WGSL computation code
+- `data` (object): Input/output data object
+- `workgroupCount` (array): Number of workgroups [x, y?, z?]
+- `workgroupSize` (array, optional): Workgroup size, default [32, 1, 1]
+- `globalInvocationIdName` (string, optional): Global invocation ID variable name, default "grid"
+- `workgroupIndexName` (string, optional): Workgroup index variable name, default "index"
+- `synchronize` (array, optional): Array of buffer names to synchronize back to CPU
+- `beforeCodes` (array, optional): WGSL code snippets before the computation function
+- `onSuccess` (function, optional): Success callback function
 
-**返回值**: `Promise<Array<Float32Array>>` - 同步缓冲区的数据
+**Returns**: `Promise<Array<Float32Array>>` - Data from synchronized buffers
 
-### 数据类型
+### Data Types
 
-支持以下 WGSL 类型：
+Supports the following WGSL types:
 
-- `f32`: 单精度浮点数
-- `vec2`: 2D 向量
-- `vec3`: 3D 向量
-- `vec4`: 4D 向量
-- `mat3x3`: 3x3 矩阵
-- `mat4x4`: 4x4 矩阵
+- `f32`: Single-precision float
+- `vec2`: 2D vector
+- `vec3`: 3D vector
+- `vec4`: 4D vector
+- `mat3x3`: 3x3 matrix
+- `mat4x4`: 4x4 matrix
 
-### 内置 WGSL 函数
+### Built-in WGSL Functions
 
-该库提供了一些常用的 WGSL 辅助函数：
+The library provides some commonly used WGSL helper functions:
 
-#### 四元数旋转
+#### Quaternion Rotation
 
 ```wgsl
 fn quat_rotate(q: vec4<f32>, v: vec3<f32>) -> vec3<f32>
 ```
 
-使用示例：
+Usage example:
 
 ```javascript
 import { WGSL_Fun } from 'webgpu-computed';
@@ -260,64 +260,64 @@ await GpuComputed.computed({
 })
 ```
 
-#### 点在 OBB 中的检测
+#### Point in OBB Detection
 
 ```wgsl
 fn point_in_obb(point: vec3<f32>, center: vec3<f32>, halfSize: vec3<f32>, quat: vec4<f32>) -> bool
 ```
 
-## 高级用法
+## Advanced Usage
 
-### 自定义工作组配置
+### Custom Workgroup Configuration
 
 ```javascript
 await GpuComputed.computed({
   code: '...',
   data: {...},
-  workgroupCount: [4, 4], // 16 个工作组
-  workgroupSize: [16, 16], // 每个工作组 256 个线程
+  workgroupCount: [4, 4], // 16 workgroups
+  workgroupSize: [16, 16], // 256 threads per workgroup
 });
 ```
 
-### 将数据同步回 CPU
+### Synchronizing Data Back to CPU
 
 ```javascript
 const results = await GpuComputed.computed({
   code: '...',
   data: {...},
-  synchronize: ['output'], // 指定要同步的缓冲区
+  synchronize: ['output'], // Specify buffers to synchronize
   workgroupCount: [1]
 });
 
-// results 包含同步的数据
+// results contains synchronized data
 ```
 
-### 回调函数
+### Callback Function
 
 ```javascript
 await GpuComputed.computed({
   code: '...',
   data: {...},
   workgroupCount: [1],
-  onSuccess: ({ code, bufferInfoList, results }) => {
-    console.log('计算完成', results);
+  onSuccess: ({ gpuComputed, group, results }) => {
+    console.log('Computation completed', results);
   }
 });
 ```
 
-## 示例项目
+## Example Project
 
 ```js
 import { GpuComputed } from "webgpu-computed"
 import * as WGSL_Fun from "webgpu-computed"
 
-// 1. 初始化 WebGPU
-console.log('初始化 WebGPU...');
+// 1. Initialize WebGPU
+console.log('Initializing WebGPU...');
 await GpuComputed.init();
-console.log('WebGPU 初始化成功');
+console.log('WebGPU initialized successfully');
 
-// 2. 简单数组计算示例
-console.log('\n=== 简单数组计算 ===');
+// 2. Simple array computation example
+console.log('\n=== Simple Array Computation ===');
 const simpleData = {
     inputA: [1.0, 2.0, 3.0, 4.0],
     inputB: [0.5, 1.5, 2.5, 3.5],
@@ -335,10 +335,10 @@ const simpleResults = await GpuComputed.computed({
     synchronize: ['output']
 });
 
-console.log('简单计算结果:', simpleResults[0]); // [1.5, 3.5, 5.5, 7.5]
+console.log('Simple computation result:', simpleResults[0]); // [1.5, 3.5, 5.5, 7.5]
 
-// 3. 复杂数据结构示例（结构体）
-console.log('\n=== 复杂数据结构计算 ===');
+// 3. Complex data structure example (struct)
+console.log('\n=== Complex Data Structure Computation ===');
 const complexData = {
     particles: [
         { position: [1.0, 2.0, 3.0], velocity: [0.1, 0.2, 0.3], mass: 1.0 },
@@ -363,10 +363,10 @@ const complexResults = await GpuComputed.computed({
     synchronize: ['output']
 });
 
-console.log('复杂计算结果:', complexResults[0]);
+console.log('Complex computation result:', complexResults[0]);
 
-// 4. 使用内置 WGSL 函数示例
-console.log('\n=== 使用内置 WGSL 函数 ===');
+// 4. Using built-in WGSL functions example
+console.log('\n=== Using Built-in WGSL Functions ===');
 const wgslFunData = {
     points: [
         {
@@ -381,7 +381,7 @@ const wgslFunData = {
     ],
     obbCenter: [0.0, 0.0, 0.0],
     obbHalfSize: [2.0, 2.0, 2.0],
-    obbRotation: [0.0, 0.0, 0.0, 1.0], // 单位四元数，无旋转
+    obbRotation: [0.0, 0.0, 0.0, 1.0], // Unit quaternion, no rotation
     results: new Array(3).fill(0)
 };
 
@@ -402,14 +402,14 @@ const wgslFunResults = await GpuComputed.computed({
     code: wgslFunCode,
     data: wgslFunData,
     workgroupCount: [1],
-    beforeCodes: [WGSL_Fun.quat_rotate, WGSL_Fun.point_in_obb, /** 可添加自己的函数代码 */],
+    beforeCodes: [WGSL_Fun.quat_rotate, WGSL_Fun.point_in_obb, /** Add your own function code */],
     synchronize: ['results']
 });
 
-console.log('OBB 检测结果:', wgslFunResults[0]); // [1, 1, 1] 所有点都在 OBB 内
+console.log('OBB detection result:', wgslFunResults[0]); // [1, 1, 1] All points are inside the OBB
 
-// 5. 自定义工作组配置示例
-console.log('\n=== 自定义工作组配置 ===');
+// 5. Custom workgroup configuration example
+console.log('\n=== Custom Workgroup Configuration ===');
 const largeData = {
     largeArray: new Array(1024).fill(0).map((_, i) => i * 1.0),
     output: new Array(1024).fill(0)
@@ -422,15 +422,15 @@ const largeCode = `
 const largeResults = await GpuComputed.computed({
     code: largeCode,
     data: largeData,
-    workgroupCount: [32], // 32 个工作组
-    workgroupSize: [32, 1, 1], // 每个工作组 32 个线程，总共 1024 个线程
+    workgroupCount: [32], // 32 workgroups
+    workgroupSize: [32, 1, 1], // 32 threads per workgroup, total 1024 threads
     synchronize: ['output']
 });
 
-console.log('大数组计算结果 (前 10 个):', largeResults[0].slice(0, 10));
+console.log('Large array computation result (first 10):', largeResults[0].slice(0, 10));
 
-// 6. 使用回调函数示例
-console.log('\n=== 使用回调函数 ===');
+// 6. Using callback function example
+console.log('\n=== Using Callback Function ===');
 const callbackData = {
     values: [10.0, 20.0, 30.0],
     squares: new Array(3).fill(0)
@@ -445,13 +445,13 @@ await GpuComputed.computed({
     data: callbackData,
     workgroupCount: [1],
     synchronize: ['squares'],
-    onSuccess: ({ code, bufferInfoList, results }) => {
-        console.log('回调触发，平方计算结果:', results[0]); // [100, 400, 900]
+    onSuccess: ({ gpuComputed, group, results }) => {
+        console.log('Callback triggered, square computation result:', results[0]); // [100, 400, 900]
     }
 });
 
-// 7. 多维工作组示例
-console.log('\n=== 多维工作组 ===');
+// 7. Multi-dimensional workgroup example
+console.log('\n=== Multi-dimensional Workgroup ===');
 const matrixData = {
     matrixA: new Array(16).fill(0).map((_, i) => i * 1.0),
     matrixB: new Array(16).fill(0).map((_, i) => (i + 1) * 1.0),
@@ -468,30 +468,29 @@ const matrixCode = `
 const matrixResults = await GpuComputed.computed({
     code: matrixCode,
     data: matrixData,
-    workgroupCount: [4, 4], // 4x4 工作组网格
-    workgroupSize: [1, 1, 1], // 每个工作组 1 个线程
+    workgroupCount: [4, 4], // 4x4 workgroup grid
+    workgroupSize: [1, 1, 1], // 1 thread per workgroup
     synchronize: ['result']
 });
 
-console.log('矩阵计算结果:', matrixResults[0]);
+console.log('Matrix computation result:', matrixResults[0]);
 
-console.log('\n所有功能示例完成！');
+console.log('\nAll feature examples completed!');
 ```
 
-## 浏览器支持
+## Browser Support
 
 - Chrome 113+
 - Edge 113+
-- Firefox (部分支持)
-- Safari (部分支持)
+- Firefox (partial support)
+- Safari (partial support)
 
-确保浏览器支持 WebGPU API。
+Ensure the browser supports the WebGPU API.
 
-## 贡献
+## Contributing
 
-欢迎提交 Issue 和 Pull Request！
+Welcome to submit Issues and Pull Requests!
 
-## 许可证
-
-ISC License
+## License
 
+ISC License

package/package.json

@@ -1,12 +1,19 @@
 {
   "name": "webgpu-computed",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "description": "对webgpu的封装，处理了繁琐的前置工作，只关注wgsl本身逻辑",
   "main": "./src/index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "keywords": ["webgpu", "gpu", "compute", "wgsl", "typescript", "javascript"],
+  "keywords": [
+    "webgpu",
+    "gpu",
+    "compute",
+    "wgsl",
+    "typescript",
+    "javascript"
+  ],
   "dependencies": {
     "webgpu": "^0.3.8"
   },

package/README.en.md

@@ -1,496 +0,0 @@
-# webgpu-computed
-
-🌐 Other language versions:
-- [简体中文](./README.md)
-
-A simplified WebGPU computing library that encapsulates tedious initialization and buffer management, allowing developers to focus on WGSL shader logic.
-
-## Features
-
-- 🚀 Simplified WebGPU initialization
-- 📦 Automatic buffer management and layout calculation
-- 🔧 Support for complex data structures (vectors, matrices)
-- ⚡ High-performance GPU computing
-- 📚 Built-in common WGSL functions
-- ✅ Support for Node.js environment
-- 🛠️ TypeScript support
-- 📖 Detailed English documentation and examples
-
-## Installation
-
-```bash
-npm install webgpu-computed
-```
-
-## Quick Start
-
-### 1. Initialize WebGPU
-
-Before using any computing features, you need to initialize the WebGPU environment:
-
-```javascript
-import { GpuComputed } from 'webgpu-computed';
-
-// Initialize WebGPU
-await GpuComputed.init();
-
-// After using in Node.js environment, please call:
-// GpuComputed.destroy()
-```
-
-### 2. Perform Simple Computation
-
-Here is a simple vector addition example:
-
-```javascript
-import { GpuComputed } from 'webgpu-computed';
-
-// Prepare data
-const data = {
-  inputA: [1.0, 2.0, 3.0, 4.0],
-  inputB: [0.5, 1.5, 2.5, 3.5],
-  output: new Array(4).fill(0) // Output buffer
-};
-
-// WGSL computation code
-const code = `
-  output[index] = inputA[index] + inputB[index];
-`;
-
-// Execute computation
-GpuComputed.computed({
-  code,
-  data,
-  synchronize: ["output"], // Fields to return
-  workgroupCount: [1] // Number of workgroups
-}).then(results => {
-    console.log(results); // [[1.5, 3.5, 5.5, 7.5]]
-})
-```
-
-### 3. Using Complex Data Structures
-
-The library supports vector and matrix types:
-
-```javascript
-const data = {
-  positions: [
-    { pos: [1.0, 2.0, 3.0], vel: [0.1, 0.2, 0.3] },
-    { pos: [4.0, 5.0, 6.0], vel: [0.4, 0.5, 0.6] }
-  ],
-  output: new Array(2).fill({ pos: [0,0,0], vel: [0,0,0] })
-};
-
-const code = `
-  output[index].pos = positions[index].pos + positions[index].vel;
-  output[index].vel = positions[index].vel * 2.0;
-`;
-
-// Execute computation
-GpuComputed.computed({
-  code,
-  data,
-  synchronize: ["output"], // Fields to return
-  workgroupCount: [1] // Number of workgroups
-}).then(results => {
-    console.log(results); // [[1.100000023841858,2.200000047683716,3.299999952316284,0,0.20000000298023224,0.4000000059604645,0.6000000238418579,0,4.400000095367432,5.5,6.599999904632568,0,0.800000011920929,1,1.2000000476837158,0]]
-})
-```
-
-### 4. Manually Create GpuComputed Instance
-
-If you need more fine-grained control, you can directly create a GpuComputed instance:
-
-```javascript
-import { GpuComputed } from 'webgpu-computed';
-
-// 1. Define data template
-const template = {
-  inputA: [] as number[],
-  inputB: [] as number[],
-  output: [] as number[]
-};
-
-// 2. Create instance
-const gpuComputed = new GpuComputed(template, {
-  code: `
-    output[index] = inputA[index] + inputB[index];
-  `,
-  workgroupSize: [32, 1, 1] // Optional: custom workgroup size
-});
-
-// 3. Initialize pipeline
-await gpuComputed.initPipeline();
-
-// 4. Prepare data
-const data = {
-  inputA: [1.0, 2.0, 3.0, 4.0],
-  inputB: [0.5, 1.5, 2.5, 3.5],
-  output: new Array(4).fill(0)
-};
-
-// 5. Create bind group
-const bindGroup = gpuComputed.createBindGroup(data);
-
-// 6. Execute computation
-const results = await gpuComputed.computed(bindGroup, [1], ['output']);
-
-console.log(results[0]); // [1.5, 3.5, 5.5, 7.5]
-```
-
-#### Using Struct Data
-
-```javascript
-// Define struct template
-const structTemplate = {
-  particles: {
-    layout: [
-      { name: 'position', type: 'vec3' },
-      { name: 'velocity', type: 'vec3' },
-      { name: 'mass', type: 'f32' }
-    ]
-  },
-  output: {
-    layout: [
-      { name: 'position', type: 'vec3' },
-      { name: 'velocity', type: 'vec3' },
-      { name: 'mass', type: 'f32' }
-    ]
-  }
-};
-
-const gpuComputed = new GpuComputed(structTemplate, {
-  code: `
-    output[index].position = particles[index].position + particles[index].velocity;
-    output[index].velocity = particles[index].velocity * 2.0;
-    output[index].mass = particles[index].mass * 1.5;
-  `
-});
-
-await gpuComputed.initPipeline();
-
-const data = {
-  particles: [
-    { position: [1, 2, 3], velocity: [0.1, 0.2, 0.3], mass: 1.0 },
-    { position: [4, 5, 6], velocity: [0.4, 0.5, 0.6], mass: 2.0 }
-  ],
-  output: [
-    { position: [0, 0, 0], velocity: [0, 0, 0], mass: 0 },
-    { position: [0, 0, 0], velocity: [0, 0, 0], mass: 0 }
-  ]
-};
-
-const bindGroup = gpuComputed.createBindGroup(data);
-const results = await gpuComputed.computed(bindGroup, [1], ['output']);
-
-console.log(results[0]); // Mapped data
-```
-
-#### Data Mapping
-
-When using structs, you can use the `dataMap` method to map results back to the original structure:
-
-```javascript
-const mappedData = gpuComputed.dataMap(results[0], 'output');
-console.log(mappedData); // Returns structured object array
-```
-
-## API Reference
-
-### GpuComputed Class
-
-#### Static Methods
-
-##### `GpuComputed.init()`
-
-Initializes the WebGPU environment. Must be called before using other features.
-
-**Returns**: `Promise<void>`
-
-**Throws**: If the browser does not support WebGPU or fails to obtain adapter/device
-
-##### `GpuComputed.computed(options)`
-
-Executes a GPU computation task.
-
-**Parameters**:
-
-- `code` (string): WGSL computation code
-- `data` (object): Input/output data object
-- `workgroupCount` (array): Number of workgroups [x, y?, z?]
-- `workgroupSize` (array, optional): Workgroup size, default [32, 1, 1]
-- `globalInvocationIdName` (string, optional): Global invocation ID variable name, default "grid"
-- `workgroupIndexName` (string, optional): Workgroup index variable name, default "index"
-- `synchronize` (array, optional): Array of buffer names to synchronize back to CPU
-- `beforeCodes` (array, optional): WGSL code snippets before the computation function
-- `onSuccess` (function, optional): Success callback function
-
-**Returns**: `Promise<Array<Float32Array>>` - Data from synchronized buffers
-
-### Data Types
-
-Supports the following WGSL types:
-
-- `f32`: Single-precision float
-- `vec2`: 2D vector
-- `vec3`: 3D vector
-- `vec4`: 4D vector
-- `mat3x3`: 3x3 matrix
-- `mat4x4`: 4x4 matrix
-
-### Built-in WGSL Functions
-
-The library provides some commonly used WGSL helper functions:
-
-#### Quaternion Rotation
-
-```wgsl
-fn quat_rotate(q: vec4<f32>, v: vec3<f32>) -> vec3<f32>
-```
-
-Usage example:
-
-```javascript
-import { WGSL_Fun } from 'webgpu-computed';
-
-await GpuComputed.computed({
-    code: "",
-    data: {....},
-    beforeCodes:[WGSL_Fun.quat_rotate]
-})
-```
-
-#### Point in OBB Detection
-
-```wgsl
-fn point_in_obb(point: vec3<f32>, center: vec3<f32>, halfSize: vec3<f32>, quat: vec4<f32>) -> bool
-```
-
-## Advanced Usage
-
-### Custom Workgroup Configuration
-
-```javascript
-await GpuComputed.computed({
-  code: '...',
-  data: {...},
-  workgroupCount: [4, 4], // 16 workgroups
-  workgroupSize: [16, 16], // 256 threads per workgroup
-});
-```
-
-### Synchronizing Data Back to CPU
-
-```javascript
-const results = await GpuComputed.computed({
-  code: '...',
-  data: {...},
-  synchronize: ['output'], // Specify buffers to synchronize
-  workgroupCount: [1]
-});
-
-// results contains synchronized data
-```
-
-### Callback Function
-
-```javascript
-await GpuComputed.computed({
-  code: '...',
-  data: {...},
-  workgroupCount: [1],
-  onSuccess: ({ gpuComputed, group, results }) => {
-    console.log('Computation completed', results);
-  }
-});
-```
-
-## Example Project
-
-```js
-import { GpuComputed } from "webgpu-computed"
-import * as WGSL_Fun from "webgpu-computed"
-
-// 1. Initialize WebGPU
-console.log('Initializing WebGPU...');
-await GpuComputed.init();
-console.log('WebGPU initialized successfully');
-
-// 2. Simple array computation example
-console.log('\n=== Simple Array Computation ===');
-const simpleData = {
-    inputA: [1.0, 2.0, 3.0, 4.0],
-    inputB: [0.5, 1.5, 2.5, 3.5],
-    output: new Array(4).fill(0)
-};
-
-const simpleCode = `
-    output[index] = inputA[index] + inputB[index];
-`;
-
-const simpleResults = await GpuComputed.computed({
-    code: simpleCode,
-    data: simpleData,
-    workgroupCount: [1],
-    synchronize: ['output']
-});
-
-console.log('Simple computation result:', simpleResults[0]); // [1.5, 3.5, 5.5, 7.5]
-
-// 3. Complex data structure example (struct)
-console.log('\n=== Complex Data Structure Computation ===');
-const complexData = {
-    particles: [
-        { position: [1.0, 2.0, 3.0], velocity: [0.1, 0.2, 0.3], mass: 1.0 },
-        { position: [4.0, 5.0, 6.0], velocity: [0.4, 0.5, 0.6], mass: 2.0 }
-    ],
-    output: [
-        { position: [0, 0, 0], velocity: [0, 0, 0], mass: 0 },
-        { position: [0, 0, 0], velocity: [0, 0, 0], mass: 0 }
-    ]
-};
-
-const complexCode = `
-    output[index].position = particles[index].position + particles[index].velocity;
-    output[index].velocity = particles[index].velocity * 2.0;
-    output[index].mass = particles[index].mass * 1.5;
-`;
-
-const complexResults = await GpuComputed.computed({
-    code: complexCode,
-    data: complexData,
-    workgroupCount: [1],
-    synchronize: ['output']
-});
-
-console.log('Complex computation result:', complexResults[0]);
-
-// 4. Using built-in WGSL functions example
-console.log('\n=== Using Built-in WGSL Functions ===');
-const wgslFunData = {
-    points: [
-        {
-            x: 1.0, y: 0.0, z: 0.0
-        },
-        {
-            x: 0.0, y: 1.0, z: 0.0
-        },
-        {
-            x: -1.0, y: 0.0, z: 0.0
-        }
-    ],
-    obbCenter: [0.0, 0.0, 0.0],
-    obbHalfSize: [2.0, 2.0, 2.0],
-    obbRotation: [0.0, 0.0, 0.0, 1.0], // Unit quaternion, no rotation
-    results: new Array(3).fill(0)
-};
-
-const wgslFunCode = `
-    let point = vec3(points[index].x, points[index].y, points[index].z);
-    let center = vec3<f32>(obbCenter[0], obbCenter[1], obbCenter[2]);
-    let halfSize = vec3<f32>(obbHalfSize[0], obbHalfSize[1], obbHalfSize[2]);
-    let quat = vec4<f32>(obbRotation[0], obbRotation[1], obbRotation[2], obbRotation[3]);
-
-    if (point_in_obb(point, center, halfSize, quat)) {
-        results[index] = 1.0;
-    } else {
-        results[index] = 0.0;
-    }
-`;
-
-const wgslFunResults = await GpuComputed.computed({
-    code: wgslFunCode,
-    data: wgslFunData,
-    workgroupCount: [1],
-    beforeCodes: [WGSL_Fun.quat_rotate, WGSL_Fun.point_in_obb, /** Add your own function code */],
-    synchronize: ['results']
-});
-
-console.log('OBB detection result:', wgslFunResults[0]); // [1, 1, 1] All points are inside the OBB
-
-// 5. Custom workgroup configuration example
-console.log('\n=== Custom Workgroup Configuration ===');
-const largeData = {
-    largeArray: new Array(1024).fill(0).map((_, i) => i * 1.0),
-    output: new Array(1024).fill(0)
-};
-
-const largeCode = `
-    output[index] = largeArray[index] * 2.0;
-`;
-
-const largeResults = await GpuComputed.computed({
-    code: largeCode,
-    data: largeData,
-    workgroupCount: [32], // 32 workgroups
-    workgroupSize: [32, 1, 1], // 32 threads per workgroup, total 1024 threads
-    synchronize: ['output']
-});
-
-console.log('Large array computation result (first 10):', largeResults[0].slice(0, 10));
-
-// 6. Using callback function example
-console.log('\n=== Using Callback Function ===');
-const callbackData = {
-    values: [10.0, 20.0, 30.0],
-    squares: new Array(3).fill(0)
-};
-
-const callbackCode = `
-    squares[index] = values[index] * values[index];
-`;
-
-await GpuComputed.computed({
-    code: callbackCode,
-    data: callbackData,
-    workgroupCount: [1],
-    synchronize: ['squares'],
-    onSuccess: ({ gpuComputed, group, results }) => {
-        console.log('Callback triggered, square computation result:', results[0]); // [100, 400, 900]
-    }
-});
-
-// 7. Multi-dimensional workgroup example
-console.log('\n=== Multi-dimensional Workgroup ===');
-const matrixData = {
-    matrixA: new Array(16).fill(0).map((_, i) => i * 1.0),
-    matrixB: new Array(16).fill(0).map((_, i) => (i + 1) * 1.0),
-    result: new Array(16).fill(0)
-};
-
-const matrixCode = `
-    let x = index % 4u;
-    let y = index / 4u;
-    let idx = y * 4u + x;
-    result[idx] = matrixA[idx] + matrixB[idx];
-`;
-
-const matrixResults = await GpuComputed.computed({
-    code: matrixCode,
-    data: matrixData,
-    workgroupCount: [4, 4], // 4x4 workgroup grid
-    workgroupSize: [1, 1, 1], // 1 thread per workgroup
-    synchronize: ['result']
-});
-
-console.log('Matrix computation result:', matrixResults[0]);
-
-console.log('\nAll feature examples completed!');
-```
-
-## Browser Support
-
-- Chrome 113+
-- Edge 113+
-- Firefox (partial support)
-- Safari (partial support)
-
-Ensure the browser supports the WebGPU API.
-
-## Contributing
-
-Welcome to submit Issues and Pull Requests!
-
-## License
-
-ISC License