Hey Product Hunt!
Today, I am proud to introduce Waviz - an Open Source Library for audio and signal visualization!
A couple of months ago, I was developing a web application around SpotifyWebAPI and I found myself wanting to attach a visualizer. I was rushed on time, so I began searching for a React/JavaScript based library that would serve a visualizer that I liked quickly. To my dismay, the options that were available were either needlessly convoluted, or used deprecated resources that would force me to downgrade versions for compatibility. In the end, I was forced to code a simple visualizer that can be best described as several div elements moving up and down. No connection to audio. No user interactions.
Fast forward another couple weeks, and I have had the pleasure of collaborating with 3 other talented engineers to tackle this gap in the market. We decided approach this problem in a modular fashion. My team and I felt that with a problem so niche, it would be best to give users the most optionality possible. Our library, as such, reflects this philosophy.
Our JavaScript/React library can be broken down into two primary sub-libraries: our Waviz Core and the Waviz React Component Library. The core library serves up audio/signal visualization by running through three different modules: Input -> Analyzer -> Visualizer. All of these modules can be used independently if desired. We also have a Waviz composition class if ease-of-use is a priority. The Waviz React Component Library, on the other hand, takes a more 'plug and play' approach. Simply import the visualizer component you want, and have the visualizer be generated on your web app for you! (you still need to pass in a canvas and an audio element)
Waviz also aims to be as light-weight as possible for the users - and so we only have one external dependency: react. Everything else is rendered using Web Audio API and Canvas HTML. While we recognize that this may reduce options in the short-run, we believe this will give our library the most long-term scalability.
Please give our library a try! We have more extensive detail on our launch website: wavizjs.com! If you would like to jump straight in from nodeJS, you can simply run 'npm i waviz' in the terminal. Feedback is appreciated!
