		@@ -39,3 +39,3 @@ # useSound

		You can also [view the storybook](todo), which includes lots of quick examples.
		You can also [view the storybook](https://use-sound.netlify.com/), which includes lots of quick examples.

		@@ -128,7 +128,7 @@ ---

		`useSound` will add about 800 bytes gzip to your bundle, and will asynchronously fetch an additional package after load, which clocks in around 9kb gzip.
		`useSound` will add about 1kb gzip to your bundle, and will asynchronously fetch an additional package after load, which clocks in around 9kb gzip.

		If the user does happen to click with something that makes noise before this dependency has been loaded and fetched, it will be a no-op (everything will still work, but no sound effect will play). In my experience this is exceedingly rare.

		### Respects changes to values
		### Reactive configuration

		@@ -176,5 +176,7 @@ Consider the following snippet of code:

		- `volume` is a number from `0` to `1`, where `1` is full volume and `0` is comletely muted.
		- `playbackRate` is a number from `0.5` to `4`. It can be used to slow down or speed up the sample. Like a turntable, changes to speed also affect pitch.
		- `interrupt` specifies whether or not the sound should be able to "overlap" if the `play` function is called again before the sound has ended.
		- `soundEnabled` allows you to pass a value (typically from context or redux or something) to mute all sounds. Note that this can be overridden in the `PlayOptions`, see below
		- `sprite` allows you to use a single `useSound` hook for multiple sound effects. See "Advanced" below.
		- `sprite` allows you to use a single `useSound` hook for multiple sound effects. See [“Sprites”](https://github.com/joshwcomeau/use-sound#sprites) below.

		@@ -200,4 +202,4 @@ `[delegated]` refers to the fact that any additional argument you pass in `HookOptions` will be forwarded to the `Howl` constructor. See "Escape hatches" below for more information.

		- `id` is used for sprite identification. See "Advanced" below.
		- `forceSoundEnabled` allows you to override the `soundEnabled` boolean passed to `HookOptions`. You generally never want to do this. The only exception I've found: playing a sound when you click the "Disable sound" button. I like to play a little “powering off” sound effect, and I don't want it to be muted.
		- `id` is used for sprite identification. See [“Sprites”](https://github.com/joshwcomeau/use-sound#sprites) below.
		- `forceSoundEnabled` allows you to override the `soundEnabled` boolean passed to `HookOptions`. You generally never want to do this. The only exception I've found: triggering a sound on the "Mute" button.
		- `playbackRate` is another way you can set a new playback rate, same as in `HookOptions`. In general you should prefer to do it through `HookOptions`, this is an escape hatch.
		@@ -234,5 +236,5 @@

		An audio sprite is a single audio file that holds multiple samples. If a page on your site uses 20 different audio files, it can be a performance win to combine them all into a single file, and to slice up that file into individually-playable sounds.
		An audio sprite is a single audio file that holds multiple samples. Instead of loading many individual sounds, you can load a single file and slice it up into multiple sections which can be triggered independently.

		> You probably don't need to use sprites! The only real benefit to this is performance, and technologies like HTTP/2 are making this a moot point.
		> There can be a performance benefit to this, since it's less parallel network requests, but it can also be worth doing this if a single component needs multiple samples. See the [Drum Machine story](https://github.com/joshwcomeau/use-sound/blob/master/stories/demos/DrumMachine.js) for an example.

		@@ -239,0 +241,0 @@ For sprites, we'll need to define a `SpriteMap`. It looks like this:

use-sound - npm Package Compare versions

Improved metrics