# vscode-gwebgpu

> A language using in compute shader for GWebGPU based on TypeScript

Latest version **0.5.1** (published 2020-11-23) · 0 weekly downloads

## Install

```sh
npm install vscode-gwebgpu
pnpm add vscode-gwebgpu
yarn add vscode-gwebgpu
bun add vscode-gwebgpu
```

## Health

**Score 10/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.5.1 |
| Published | 2020-11-23 |
| First published | 2020-06-18 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 122.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 149 |
| Maintainers | panyuqi |

## Links

- npm: https://www.npmjs.com/package/vscode-gwebgpu
- Repository: https://github.com/antvis/GWebGPUEngine
- Homepage: https://github.com/antvis/GWebGPUEngine#readme
- Issues: https://github.com/antvis/GWebGPUEngine/issues
- npm.io page: https://npm.io/package/vscode-gwebgpu

## Recent versions

- 0.5.1 (latest) — 2020-11-23
- 0.6.0 — 2020-11-23
- 0.5.0 — 2020-11-06
- 0.4.1 — 2020-06-24
- 0.4.0 — 2020-06-24
- 0.3.0 — 2020-06-18

## README

# @antv/g-webgl-compute

[![travis ci](https://travis-ci.com/antvis/GWebGPUEngine.svg?branch=master)](https://travis-ci.com/antvis/GWebGPUEngine) [![](https://flat.badgen.net/npm/v/@antv/g-webgpu?icon=npm)](https://www.npmjs.com/package/@antv/g-webgpu) ![最近提交](https://badgen.net/github/last-commit/antvis/GWebGPUEngine)

A GPGPU implematation based on WebGL. [中文](./README.zh-CN.md)

## GPGPU

You can try to solve some compute-intensive tasks like layout & particle effects with GPGPU technique.
Use any rendering techniques(d3, g, Three.js or ours' rendering API if you like) when calculation is completed.

```typescript
import { World } from '@antv/g-webgl-compute';

const world = new World({
  engineOptions: {
    supportCompute: true,
  },
});

const compute = world.createComputePipeline({
  shader: `
    //...
  `,
  dispatch: [1, 1, 1],
  onCompleted: (result) => {
    console.log(result); // [2, 4, 6, 8, 10, 12, 14, 16]
    world.destroy();
  },
});

// bind 2 params to Compute Shader
world.setBinding(compute, 'vectorA', [1, 2, 3, 4, 5, 6, 7, 8]);
world.setBinding(compute, 'vectorB', [1, 2, 3, 4, 5, 6, 7, 8]);
```

Our Compute Shader using Typescript syntax：

```typescript
import { globalInvocationID } from 'g-webgpu';

@numthreads(8, 1, 1)
class Add2Vectors {
  @in @out
  vectorA: float[];

  @in
  vectorB: float[];

  sum(a: float, b: float): float {
    return a + b;
  }

  @main
  compute() {
    // 获取当前线程处理的数据
    const a = this.vectorA[globalInvocationID.x];
    const b = this.vectorB[globalInvocationID.x];

    // 输出当前线程处理完毕的数据，即两个向量相加后的结果
    this.vectorA[globalInvocationID.x] = this.sum(a, b);
  }
}
```

## Resources

- [WebGPU Design](https://github.com/gpuweb/gpuweb/tree/master/design)
- [WebGPU Samples](https://github.com/austinEng/webgpu-samples)
- [Raw WebGPU](https://alain.xyz/blog/raw-webgpu)
- [WebGPU implementation in Rust](https://github.com/gfx-rs/wgpu)
- [awesome-webgpu](https://github.com/mikbry/awesome-webgpu)
- [Matrix Compute Online Demo](https://observablehq.com/@yhyddr/gpu-matrix-compute)
- [From WebGL to WebGPU](https://www.youtube.com/watch?v=A2FxeEl4nWw)
- [tensorflow.js WebGPU backend](https://github.com/tensorflow/tfjs/tree/master/tfjs-backend-webgpu)
- [get-started-with-gpu-compute-on-the-web](https://developers.google.com/web/updates/2019/08/get-started-with-gpu-compute-on-the-web#shader_programming)

## Contributing

Bootstrap with Yarn Workspace.

```bash
yarn install
```

Watch all the packages:

```bash
yarn watch
```

```bash
yarn start
```

---
_Source: https://npm.io/package/vscode-gwebgpu · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._