soundhub.js v5.9.0
© Chris Schardijn

A sound manager for the web

soundhub.js is a TypeScript sound engine built on the Web Audio API. It loads your audio once and keeps track of every sound that is playing, so volume, fading, panning, sound groups, sprites and 3D spatial positioning all come from one small library.

Use it as a sound player on a website, or as the audio engine behind a browser game. Zero dependencies, 16 KB gzipped, and it runs anywhere the Web Audio API does.

Get started Try the demos View on npm
13 KB gzipped
Zero dependencies
98.5% browser coverage
TypeScript first-class
Volume & Fading
3D Spatial Audio
Sound Groups
Sound Sprites
Event-Driven API
Mobile Optimized

Quick Start

Install
$ npm install soundhub 
import { SoundHub, SoundEventsEnum, SoundEvent } from "soundhub";

const sm: SoundHub = new SoundHub();

sm.addEventListener(SoundEventsEnum.LOADED, (event: SoundEvent) => {
  console.log("Loaded:", event.soundId);
});

await sm.loadSounds([{ id: "click", url: "/sounds/click.mp3" }]);
sm.play("click");
Try it on CodePen Full documentation
Updated

General Demo

Load sounds, control volume, use sprites, adjust panning, and explore all SoundHub features in one interactive demo.

The general demo: a searchable list of twelve sound channels with family filters, four of them playing at once
Open Demo Updated

Multichannels Demo

Organize sounds into named groups and control every channel on its own, with volume, play and stop per group. Try it on the sampled piano: each key you press starts its own sound instance.

Open Demo New game

Sound Groups Demo

Give a group of sounds a maxInstances limit and watch the slots fill up. Hit the cap and the oldest instance stops for you. Includes a small DOS-style shooter that runs on three groups.

Audio Invaders, the DOS-style shooter in the sound groups demo, with damaged shields and its weapons voice slots lit up
Open Demo Updated

Sound Sprites Demo

Split a single audio file into multiple named sprite regions. Play jump, power-up, victory, and other game sounds from one MP3 using start-time and duration tuples.

A 36 second audio file drawn as a waveform with eight numbered sprite regions marked out along it
Open Demo Updated

3D Spatial Audio Demo

Give a sound an x, y and z position and hear it circle the listener, or place it yourself with the mouse. Put your headphones on: the browser renders 3D audio binaurally and mixes it down to two channels.

Open Demo

Documentation API Reference

Full API reference, configuration options, event types, and usage examples for all SoundHub features.

View Docs

npm Package

Install soundhub via npm and integrate advanced audio control into your TypeScript or JavaScript project.

View on npm

README & Guide

Getting started guide, installation instructions, configuration reference, and complete code examples to get up and running fast.

Read Guide

Questions about using a sound manager

What is a sound manager for the web?

A sound manager is the layer between your code and the browser audio system. It loads audio files once, keeps track of every sound that is playing, and gives you one place to start, stop, fade, pan or position them. Without one you end up writing that bookkeeping yourself in every project.

Can I use soundhub.js as a sound engine for a browser game?

Yes. Each play call can create its own instance, so overlapping shots and explosions do not cut each other off, and sound groups let you cap how many instances a category may hold at once. Sound sprites keep dozens of short effects in a single file, which is the usual approach for web games.

How is it different from using the HTML audio element?

The audio element plays one file at a time and gives you no control over panning, spatial position or grouping. soundhub.js runs on the Web Audio API, so the same sound can play many times at once, each with its own volume, pan and 3D position.

Does the sound player work on mobile browsers?

Yes. Mobile browsers keep audio suspended until the user interacts with the page, and the library resumes the audio context on that first gesture. It also mutes when the tab goes to the background and resumes on focus, which is what mobile users expect.

How large is the library and does it have dependencies?

It is around 16 KB gzipped and has zero runtime dependencies. It ships as an ES module and a UMD build, with TypeScript declarations included.