index.md

layout	home
title	WebGPU Sorting
titleTemplate	Library, Demo, and Docs
hero	name text tagline image actions WebGPU Sorting WebGPU Sorting Library and Demo Sort Uint32Array workloads in the browser, inspect the implementation, and benchmark on your own hardware. src alt /icons/icon-192.svg WebGPU Sorting Logo theme text link brand Interactive Demo /demo/ theme text link alt Architecture /architecture theme text link alt GitHub https://github.com/AICL-Lab/webgpu-sorting
features	icon title details 🚀 Browser-side GPU sorting Run Bitonic and Radix sort implementations through WebGPU compute shaders from a small TypeScript API. icon title details 📊 Bitonic Sort A predictable sorting-network implementation that works well as the general-purpose reference algorithm. icon title details 🔢 Radix Sort A Uint32-focused implementation for larger integer workloads where fixed-width passes pay off. icon title details 🔧 Standalone demo app A maintained playground build is embedded in the docs site so you can benchmark on the target browser directly. icon title details 📐 Reference docs Docs focus on the library API, architecture, demo usage, and practical benchmark guidance. icon title details 🛡️ Maintained workflow The repository keeps one validation baseline, one docs site, and one root changelog instead of layered maintenance frameworks.

2 GPU sorters

1 Demo playground

4 Core validation commands

1 Root changelog

Quick Start

import { GPUContext, BitonicSorter } from 'webgpu-sorting';

// Initialize WebGPU context
const gpu = new GPUContext();
await gpu.initialize();

// Create sorter
const sorter = new BitonicSorter(gpu);

// Sort data on GPU
const data = new Uint32Array([5, 2, 8, 1, 9, 3, 7, 4, 6, 0]);
const { sortedData } = await sorter.sort(data);

console.log(sortedData); // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

Browser Support

🌐

Chrome 113+ Supported

🌊

Edge 113+ Supported

🦊

Firefox Nightly Flag Required

🧭

Safari 18+ macOS 14+

Why GPU Sorting?

GPU sorting becomes advantageous when:

• Array size is large enough - Buffer upload and readback overhead is amortized
• Batch processing - Multiple sorts can share GPU context
• Real-time applications - Low-latency sorting for visualizations, simulations
• Integer-heavy workloads - Radix sort excels on Uint32Array data

Use the interactive demo to measure the crossover point on your own hardware instead of relying on fixed benchmark claims.

Architecture Overview

graph TB
    subgraph CPU["CPU Side"]
        A[Input Array] --> B[Generate Data]
        B --> C[Create GPU Buffer]
    end

    subgraph GPU["GPU Compute Shader"]
        D[Read Buffer] --> E[Bitonic/Radix Sort]
        E --> F[Parallel Passes]
        F --> G[Write Sorted Buffer]
    end

    subgraph Output
        G --> H[Read Back to CPU]
        H --> I[Validation & Timing]
    end

    C --> D

Loading

Learn more in the Architecture documentation.