webaudio-examples
wasm-pack
webaudio-examples | wasm-pack | |
---|---|---|
39 | 38 | |
1,192 | 5,952 | |
1.2% | 1.2% | |
5.1 | 6.4 | |
about 1 month ago | 4 days ago | |
HTML | Rust | |
Creative Commons Zero v1.0 Universal | Apache License 2.0 |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
webaudio-examples
-
How to Create an Audio Visualizer using Nextjs
In this article, we'll explore three essential terms in the Web Audio API for our project. For more in-depth information, visit MDN Docs.
-
Mobile Web Audio: Removing Media Controls from Notifications Tray
Exhausted and having tried out various approaches without much success, I decided to give Web Audio API a try. While it appeared slightly harder to work with, I was frankly running out of options. All that said, moving from HTML5 Audio to Web Audio API involved quite a fair bit of changes and experimentation.
-
Tone.js and the Web Audio API
MDN Web Audio Doc
-
Web FM synthesizer made with HTML5
I found the wikipedia article [1] on the subject to be helpful to understand a little bit whats going on here.
I wonder if there's more performant wasm implementations that can interface with the WebAudio API [2]? Quick search brings up things like [3]
[1] https://en.wikipedia.org/wiki/Frequency_modulation_synthesis
[2] https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_A...
[3] https://github.com/a-cordier/wasm-audio
-
Creating a Cyberpunk-Themed Music Player with React, Web Audio API, and Canvas
Feel free to refer to the official documentation to learn more about the Web Audio API.
-
JavaScript Web APIs Series: Audio and Video APIs
You can see details on how to implement this API in your application, including the interfaces that it extends, the necessary permissions, browser compatibility, and much more on its MDN page.
-
Generating sound in modern Web Audio API
As part of my effort to remake my old Artsy demo in more modern JavaScript, I decided to start with the music player. The original Amiga demo from 1993 used the SoundTracker MOD format, but my remake from 2013 uses an MP3 file, which was a bit of a cheat. Playing an MP3 is efficient and requires almost zero code, but it's not very interesting. Also, it requires loading several megabytes of data. So I decided to try to make a MOD player from scratch, using only the Web Audio API
-
How to Use Rust Code in a JavaScript Worklet (Without wasm-pack)
After taking a good look through the Web Audio API documentation, I decided that the best way for my synthesizer to output sound to the speakers was through the use of the AudioWorkletNode combined with an AudioWorkletProcessor. This combination of two nodes would allow me to generate audio in a background thread which could then be played through the speakers.
- I want to recreate this piano website
-
Introduction to Web Audio API
Let us take a look at various concepts behind Web Audio API.
wasm-pack
-
Rust + WASM + Typescript [+ React]
For a much simpler but less flexible approach there's wasm-pack for creating JS packages from Rust, and wasm-bindgen for easy interop. Both have very good documentation.
-
Tower of Hanoi in P5.js + WASM
After four years, I found some time to pay that deb-tech (yes, quite a long time, eh). To make it fun I rewrote everything from scratch in SolidJS, which went smooth thanks to this amazing library p5js-wrapper. For WASM, C++ is still a good choice, but what about Rust? I did some research and found wasm-pack. A few lines in the cargo.toml file and we were ready to generate compiled + ready to import bytecode!
-
How to Use Rust Code in a JavaScript Worklet (Without wasm-pack)
Support using wasm-pack in Worklets (particularly AudioWorklet) #689
-
Hey Rustaceans! Got a question? Ask here (3/2023)!
If you're looking to use it to interface with node/browsers, then try wasm-pack.
-
Rust WebAssembly (wasm) on Arch Linux with Webpack (Rust 1.66.0)
Webassembly: wasm-bindgen 0.2.83 / wasm-pack 0.10.3
-
Examples of Rust + SvelteKit + WASM
wasm-pack has bugs - it publishes a module which declares itself as a commonjs module. (You can fix that by manually adding "type": "module" in package.json). Then the web build should work with other bundlers. I opened an issue about this over a year ago. There's a PR and everything, but no movement :/
-
Building a web application with Rust and WebAssembly
wasm-pack helps you build Rust-generated WebAssembly packages and use it in the browser or with Node.js.
-
A Look at Performance in Wasmtime and Cranelift
Is the Rust WASM ecosystem being half dead better? wasm-pack and wasm-bindgen are barely maintained anymore, and trust me it's not because everything works flawlessly…
-
Ask HN: Should I learn Rust or Go?
I've been learning Rust for the past few weeks and have been enjoying it a lot.
- The community is very helpful on Discord (https://discord.com/invite/rust-lang-community).
- The package ecosystem (crates.io) makes it very easy to find and import things, and they're consistently documented.
- There's a path to compiling on web via WebAssembly (https://rustwasm.github.io/wasm-pack/)
In a few weeks of learning the language, I managed to put together this visualization: https://twitter.com/admiralakk/status/1542560489091350529
But realistically, either Go or Rust will be fine. You should pick the one you're more likely to stick with and learn, even when it gets tough. I've found the community aspect to be very helpful, because then at least I know I'm not the only idiot out there.
-
Integrating a Svelte app with Rust using WebAssembly
There are various ways to set up a web project that uses Svelte, Wasm, and Rust. For example, wasm-pack from the rust-wasm group provides a template for simple HTML-CSS-JS applications. There are also several project templates for React or Svelte with Rust and Wasm.
What are some alternatives?
butterchurn - Butterchurn is a WebGL implementation of the Milkdrop Visualizer
trunk - Build, bundle & ship your Rust WASM application to the web.
standardized-audio-context - A cross-browser wrapper for the Web Audio API which aims to closely follow the standard.
wasm-bindgen - Facilitating high-level interactions between Wasm modules and JavaScript
audioworklet-polyfill - 🔊 Polyfill AudioWorklet using the legacy ScriptProcessor API.
vite-plugin-rsw - 🦞 wasm-pack plugin for Vite
particle-emitter - A particle system for PixiJS
wasmtime - A fast and secure runtime for WebAssembly
emsdk - Emscripten SDK
capacitor - Build cross-platform Native Progressive Web Apps for iOS, Android, and the Web ⚡️
sound - WebAudio API playback library, with filters. Modern audio playback for modern browsers.
cargo-generate - cargo, make me a project