I am the author! Wow, I can't believe the attention this is getting! Hopefully this proves to be useful as a tool, and not just as a JS demo! :)
The next plans are
- redo drawing library to further improve performance!
- polish a bit some audio plugins (like the paragraphic EQ) since some parts feel a bit off (the limiter, paragraphic eq for example).
- Add some tutorials! Some things might not be straightforward like using Shift + [keys] for shortcuts etc.
- Easier recording mode (like the ability to open a new empty audio project)
- Multitrack mode, for more channels!
- play a bit more with the concept of having different windows that can be in different screens (check out the frequency analyzer under "view")
To answer a few questions, I plan to have a very open license this is just a fun side project for me. but I need to figure out the licenses of some libs I am using first (eg wavesurfer, lzma-wasm) and do proper attribution!
Thanks again!
PS. I wrote this in 2018, and just kept it on my hard disk until recently, so certain features might be slightly different than back then :)
Hi, I work at Mozilla doing audio programming for Firefox, I see in your about page that you have issues with the Web Audio API, ping me (same nick a bit everywhere on the web, and also @mozilla.com) and we'll answer any question or fix any issue you have. Lots of things have happened in the audio space on the web since 2018!
In particular, low latency (like native roundtrip latencies, so <10ms easy, but depending on the OS) no-jitter/real-real-time audio programming is now something that developers can do. Lock-free/wait-free programming and SIMD are coming in the next weeks/months.
Very cool project in any case, I'll use it when I need to quickly do very high zoom on wave forms to debug things for Firefox.
Seconded, web midi is a big showstopper for Mozilla and should have more priority than the various bells and whistles that Mozilla does seem to prioritize but that ultimately are not part of a browser.
Not being able to use Midi from FireFox means that for a whole raft of possible applications Chrome is the only option, which is a real pity.
Please, please, pretty please, give web midi a higher priority.
The thing is that "the web" doesn't make sense as a platform for audio applications when to build upon it you need to throw away realtime safe subroutines.
Realtime audio rendering is a soft realtime problem. If the web audio APIs don't have methods for guaranteeing deadlines for rendering audio, it's only possible to build toy audio applications.
I'm aware of things like bandlab and such. They're still toys and too limited for serious work, where the money is.
Most music-related applications wanting to offer generic hardware support and hackability. Midi is an amazing standard. It allows you to hook up a synthesizer from the early 80s to your 2020 laptop (via a midi-capable audio interface) and control almost anything in your modern DAW (Digital Audio Workstation). And if your Web browser has support for it, control a software synth or any application as well.
In addition to just musical instruments, a huge number of different hardware still use midi. I'm personally interested in DJ-world where things like DJ- and light-controllers use midi and therefore are very easily remappable and very hackable (if the sw is built correctly).
I've wanted to build some DJ-related sw myself that would work via browser but the fact that currently only Chrome supports the standard has so far kept me off it. I'd very much like to see Firefox supporting Web midi.
Right, I understand what MIDI is for, but usually music software has these real-time requirements on performance and the browser runs javascript, so... What are the applications for web midi? People aren't mixing their music on the browser nowadays, right?
Just to throw out an example from a friend's company: online piano lessons. MIDI input in the browser makes it possible for them to tell if you played the correct notes on your keyboard.
I haven't seen significant problems from javascript being too slow on things that use web MIDI. Here is a web based "piano karaoke" app that runs quite well in browsers that support MIDI (and since it syncs with YouTube videos, it really kind of has to run in a browser vs native)
Get in touch if you want to beta test it and let me know if you think it is fast enough on your set up, etc. Hoping to put it on "Show HN" soon. rjbrown at gmail More about it at https://pianop.ly/portfolio/
If it was WebMIDI that actually transmitted -MIDI streams- (instead of just shoving them, with limited options, at some flaccid GM soundfile) that'd be really cool. Then you could choose your own MIDI playback engine (application, external hardware, ... ).
In an environment that interprets -all- the codes, MIDI's almost unlimited. Hollywood's used it for a long time. It's very undemanding so people could -certainly- mix their music on the (right) browser. And, if people could add javascript routines to it? Ay-yay.
The mess with audio servers is one of the main reasons I could never stand Linux as my primary laptop OS. Jack, ALSA, OSS, Pulse, etc. Far too often the answer to my problem was that it didn't work on that specific audio server, or that I needed to compile my own server/kernel/app from source.
Easily, reliably, and quickly playing audio is table stakes for Windows and Mac OS. They've been doing it for years. But instead of improving one or two audio APIs, on Linux it is time for a new audio server that will, but doesn't, solve all of the problems of every predecessor.
> Easily, reliably, and quickly playing audio is table stakes for Windows and Mac OS. They've been doing it for years. But instead of improving one or two audio APIs, on Linux it is time for a new audio server that will, but doesn't, solve all of the problems of every predecessor.
I mean, I have currently 5 soundcards on my desktop computer, 1 pro over PCIe, 2 pro over USB, 1 standard HD Audio and 1 output in my screen's HDMI, and I can assure you that even on windows it's definitely not a smooth ride between WASAPI, ASIO, MME, WDMKS... things crash or get stuck routinely, and I sometimes get random loud buzzes or no sound until I reboot. With my band we had tons of issues with a M-Audio card on windows fixating itself on the wrong sampling rate as soon as a desktop music playing was launched (this includes web browsers), entirely preventing playback on Ableton Live for instance.
It's barely better on macOS, e.g. look at that shit: https://github.com/OSSIA/score/issues/778. macOS also sacrifices some low-latency when comparing the same hardware on it versus Linux (with raw ALSA or JACK) and Windows with ASIO.
I think the guy with 5 sound cards might be the exception that proves the rule - the conversation was about playing back audio from the browser not which OS starts to fall apart when you need a DAW for your band.
> the conversation was about playing back audio from the browser
well, no, the web audio API & stuff is explicitly being sold as something that will be equal in capability to other solutions, so definitely things used for pro audio.
Even quite modest normal setups will have several input or output devices. Just on my laptop I have hdmi audio, built in speaker and mic, USB headset, bluetooth headset and remote audio from an RDP session.
What exists as far as open source digital audio interfaces? Meaning only digital i/o — no analog.
It seems like a relatively contained problem to take multiple streams of PCM audio into a computer, locked to word clock. Then the hard, fiddly aspects of analog design can be left to high-quality outboard converters which speak MADI or whatever.
I say "contained" because I don't want to minimize the difficulty of getting such a design right, but it seems like you only have to get it right once.
What I'm looking for is a way to hook up any converter which outputs via a standard digital audio protocol (SPIDF, AES/EBU, ADAT lightpipe, etc.).
Then we don't need a USB driver for each converter! We only need one USB driver, for the digital i/o interface. And we can polish the driver for that one interface until it's actually reliable, instead of relying on the sketchy one-off driver for this year's soon-to-be-obsolete USB audio interface.
If I'm not mistaken the underlying transport protocol is the same for all of those - you can get a coaxial to XLR to get S/PDIF into an AES port or a coaxial to TOSLink converter to get S/PDIF data into an ADAT port.
In terms of i/o capability, the specs of the Madiface XT would work well for the purposes I'm proposing.
But the point is that I want open source drivers, and open source hardware! I don't want to depend on the health and the priorities of a commercial entity. I want to be able to inspect the driver software and contribute towards perfecting it!
Compared to, say, GPUs, the needs of multichannel digital audio i/o are modest and not changing very much over time.
> If I'm not mistaken the underlying transport protocol
Some quick usage of Wikipedia suggest that you are, sadly, mistaken. ADAT lightpipe seems to use a completely different protocol (more capable?), and while S/PDIF and AES/EBU use quite similar protocols, they differ in impedance and max and min voltages, so I'm guessing that directly electrically connecting the two controllers is a bad idea for both the controller and the data.
It doesn't matter for the purposes I'm investigating. So long as we can get the bits out of the wire and into open source software, we can make sense of them.
(Licensing could be a concern though if ADAT lightpipe is proprietary — I'm not clear on that. But then we could just use other open protocols instead.)
I only have a "main" soundcard (the PCIe one) - HD audio and HDMI thing are unused 99% of the time, but if you have a computer more recent than 2007 you have them. The two USB soundcards are temporary and here currently because I need to test stuff for the sequencer I'm developing (https://ossia.io)
I've had many issues with OS X audio on Catalina - all of my USB audio devices skip and pop on it. It's also a pain to
configure, with options bizarrely hidden in the MIDI app.
Windows probably has the best audio stack of them all (battle tested, easy to use UX). In comparison, JACK/pulse are pretty good as well and people use it professionally. Like most things on Linux, the initial UX is a bit of a pain, but once you get past it you get amazing customization, even more so than Windows.
These are the only abstractions I'm aware of on Linux systems - and they are simply built on top of ALSA which is the
kernel's core sound API. Almost all desktop environments simply install PulseAudio, and you never have to worry about
sound.
How old is your Mac? That issue sounds very strange to me.
CoreAudio is far and away the most impressive and powerful audio API across the board. It's ridiculous how much you can do with it and the abstractions it provides.
It's also been better, faster, and supported lower latency than Windows up until WASAPI came around - you needed to use ASIO on Windows for years. Even today you can't programmatically change the sample rate of a device on Windows, which means that engines like RtAudio have to do resampling under the hood to support basic functionality that's been in CoreAudio.
The only problem with it is that the documentation has evaporated. Which admittedly is a big one.
> How old is your Mac? That issue sounds very strange to me.
New MBP 16". Apparently it's a problem with the T2 security chip and affects almost all external USB 2.0/3.0 audio devices. Just do a google search for audio drop outs and T2. All digital audio goes through the T2 chip which seems to add latency and these drop outs. I think the only solution at the moment is to use a USB-C native device (but I haven't tested this). If you already have substantial hardware like I do, Catalina is basically unusable (and no fix in sight from Apple...).
fwiw I don't think any audio manufacturer (hardware or software) has advised it "ok" to use Catalina, and OS upgrades have been a problem for as long as I've used professional audio tools.
I understand with brand new machines it's a problem, but buying less-than battle tested hardware/software has always been problematic. If you already have substantial hardware, you probably shouldn't be buying a brand new machine and expecting it to just work after a major OS upgrade.
I shouldn't expect a widely used standard (USB Audio) to work after upgrading my hardware? All the Windows and Linux machines I've had have no problem with USB audio and I don't expect they ever will.
I mean I can't even get (all) my USB audio gear to work properly on Linux, at all. For example system settings on Ubuntu Studio misinterpret anything with more than 2 channels as a surround device. But that's OK because the hardware manufacturer has advised they don't support Linux for their proprietary device management software because "widely used standard" like class compliant USB audio is not sufficient for their use case.
And I've been burned enough times by OS upgrades that I know to be cautious. I'm not saying the situation is good, just that it's a shitshow everywhere. I got around a dozen emails from my device and software vendors telling me not to use Catalina, so I'm not yearning to go out and buy a new Mac to run my software on and connect my hardware to it. I'll shit on Macs for that, but under the hood, CoreAudio is much more impressive than anything on Windows or Linux.
After a bit of struggle I found that Pulseaudio over Jack adresses my needs. Music production software connects directly to Jack and all other software (browser, video player, etc.) uses Pulseaudio. Also the Cadence GUI really helps to set this up correctly.
My Chromium plays audio to my external and internal cards fine without Pulseaudio, I have just ALSA and don't know who still uses OSS (no judgement, I just use the default). I think your comment can only have an adverse effect on the conversation if you don't give specific examples.
(Nitpick: Linux has nothing to do with Pulseaudio, it's just the kernel.)
Are you open to a couple of feature suggestions from someone who uses Audacity for scientific applications?
1. An port of Audacity's "Noise Reduction" filter. I have done this once [0] (with some difficulty and no doubt with errors) and I am so tempted to just translate it to JavaScript and put up a PR, but I'm slammed right now.
2. It would be very useful to be able to view the spectrograph as an alternative to the waveform, rather than having it live in a separate "spectrum analyzer" pane. Especially if zooming along the frequency axis were implemented, this would make it much more useful for, well, spectrum analysis.
Thank you for making this. It's impressive in its own right but doubly so as a web application.
Those are both great ideas, especially the noise reduction function might be something that makes this tool quite useful for quick recordings! I actually tried implementing noise reduction algorithms in the past, but sadly could not get it to work properly. Maybe time to revisit! (ditto about the spectograms too)
Soundforge on a 486 100Mhz was already pretty fast at editing a single track of audio. It's amazing how much heavy frameworks have warped our perception of normal interactivity.
I had a 486 and did some rudimentary audio editing back then.
I remember the performance to be decent, but not 60fps-decent.
But aside from that phones usually have relatively infrequent touch updates, which usually results in a single repaint on every such event, so 10FPS or so.
And took more time and expertise to develop and only worked on one computing platform.
The software industry has been a cycle of trading hardware performance improvements for developer productivity since the beginning.
I did not want to bind control/command key as it is used by the browser itself (eg control + t opens a new tab). So instead I used the shift key, (so shift + A = select all, shift + C = copy, shift + V = paste, etc).
It is a non-optimal choice, but I believe there is a very strong reason. Not competing with the browser's native functionality.
Some of the most horrible web experiences, occur because websites try to take control of native functions. For example "smooth" scrolling, or highjacking the back button, or trying to abuse the clipboard! Confusing the user, breaking navigation, making the page less accessible and in some cases breaking after X months when browser or OS behavior changes.
What I have now is unfortunately far from "good" and there is improvement and experimentation waiting to happen, but the straight forward approach is not much better either...
What would you be competing with? Cmd/Ctrl-C/X/V for cut copy and paste are the norm. By allowing your app to use those keys you aren't overriding the browser, you're making your app conform to the standards. Even native apps do this. The OS may provide cut/copy/paste in an OS level text widget but it doesn't provide it in Word, Excel, Photoshop, or Audacity. That's up to the app. In the same way doing the same thing is up to the web app for anything not plain text.
Most web major apps do this. Office365, Google Docs/Sheets/Slides. Even Facebook/Slack/Gmail since they re-interpret the text (converting :-) into emoji and or replace with images.
Fair enough :) for cut/paste/copy it might definitely be a good option. Though what about control + S, should that prompt the export audio, or let the browser download the page?
Perhaps I should add support for the control key, but let other combinations were conflicts might arise. Getting good UX is a such fascinating topic.
Really hoping you add in spectrum editing, too, because waveforms are fine, but the power of RX and tools like it is that you can view the FFT spectrum and cull parts that are entirely useless (cutting out hums, >12k painful harmonics, etc =)
A tool used by anyone and everyone in the audio space: https://www.izotope.com/en/products/rx.html - it's most important feature is that while you can work on the waveform, that's pretty much the least useful way to work with audio, and so it also lets you work directly on the spectrogram of an audio source instead, which makes editing the actual sounds you hear much, much easier.
Right now no, but it would be very useful so i 'd like to add this, since you can use the keyboard to control the menu... (except well... opening it!). Any preferred key you 'd like this assigned to?
Author again here! Now that this is finally sunsetting, I feel a bit more comfortable writing some things I 've learnt today!
- First of all, I am amazed at the suggestions and love this is getting. I have been dog fooding it by using it to quickly edit foley audio from a tascam hand-microphone device, in order to make some cheap sound effects for a game project I am working on. The point is, I thought I was aware of all bugs, and all areas of improvement, and I am humbled to have my mind opened and see how valuable outside perspectives are! It's so easy get tunnel vision and think you know best I guess.
- Secondly... as I said I wrote this in June 2018, and just... kept it... I guess I was afraid of sharing it to the world, perhaps the audio people would get mad at me for making mistakes with the audio api (like the fade in/fade out being linear). Perhaps the javascript people would make fun of me for just using Vanilla JS.
But if this is impressive in 2020, imagine how impressive it would have been back in 2018! So I guess my point is. Share your work! Do not be afraid to put it out there!
- If anyone is interested on how it is built, and how the interface complexities are managed, even though it is just plain old school JS that has the reputation of being notoriously difficult to maintain, I would be happy to make a write-up shortly, or perhaps give a talk on it.
- Third... (hopefully that is ok). If you like AudioMass, and like the way it is built and it performs, perhaps you might enjoy working together with me. We are doing cutting edge computer vision, and well.. some CRUD stuff too! My company is hiring (info in my profile). But please be advised that due to covid-19 things may take longer or may not be fully up to date.
PS. As for license, I will probably choose something like "wtfpl.net". if it can help you learn something, or build something, go ahead! If you noticed, the page doesn't have any tracking (I realy don't know how many visitors came (I also disabled nginx logs)). And of course no ads at all. I 'm just trying to build cool and useful stuff!
I'd avoid WTFPL if you are serious about this as an open source project.
Google publishes their internal open source policy[1], i.e., what open source licenses can be used in Google software. I think it is a solid reference for what a good corporate open source policy is. It explains the reasoning, it isn't some crazy enterprise things that bans all open source (I've seen that), and it isn't some free-wheeling startup that allows everything with no scrutiny.
They ban the use of WTFPL code[2], and ban contributions to WTFPL code.
Thank you for the suggestion! Unlicense does seem much better and their website has a valid SSL cert, unlike the wtfpl one... So, this is probably the one!
Will update the repo later tonight! Cheers!
By choosing a rebel license like the WTFPL or Unlicense, you are going to limit your world of potential users and collaborators. There are people that do that deliberately, such as Doug Crockford and the JSON license, but if you're going to do that, you really should do it from a position of expertise.
To maximize the reach of your program, you would be well-served to select one of top-ten or top-twenty popular FOSS licenses. I could provide a list but any list would be biased; just google it.
I have my opinions about which FOSS license I would select, but I'm going to suppress them because I just want to help you ease into the mainstream.
A decent way to choose would be to look at what community you want to be a part of and see what the predominant license choice is within that community.
Yes! Flac support is important, thank you for the suggestion. I would expect it to be already supported https://caniuse.com/#search=flac and I am just using web audio functions it should decode fine (but it's not). Maybe I am overzealously filtering for formats!
And performance is fine, but it can be so but soooo much better! Like just by adding sprinkling some wasm or asmjs in the "onaudioprocess" loops, to speed up the buffer traversing loops and escape the dreaded garbage collector!
Was really not expecting to be impressed by this, but it's excellent. The inclusion of a spectrogram is a very nice touch.
The ability to preview EQ changes while the audio is playing back is impresssive, although the x-axis scale on the parametric isn't helpful - everything below 1kHz is squashed into the left-most 10% of the plot.
Some small nitpicks are that it's currently quite fiddly to use the compressor without a gain reduction meter, and my usual bugbear with simpler audio editors: that fade-outs are almost never useful unless you can alter the curve.
But the fact that this is working so smoothly in a browser at all, and in Firefox to boot, is really commendable.
It also has my usual bugbear in that fades are calculated linearly rather than logarithmically as humans actually perceive loudness. (Decibels are logarithmic for a reason.)
How come so many apps get this wrong? This is really basic psychoacoustics, and linear fades sound terrible!
> fade-outs are almost never useful unless you can alter the curve.
I agree, but would like to add that you should be altering a logarithmic curve.
You are 100% correct. I guess it's because it's a js developer doing audio, instead of an audio engineer doing js! So I have a lot to learn, most of the plugins have minor issues, but I 'll be focusing in correcting those when I get the chance!
I agree with the above posters. Things like normalize as well should also probably have their value expressed as dB as that's kind of the industry norm from what I understand.
I do have to say, this is a super cool tool and I've definitely bookmarked it. I normally use tools like Audacity to quickly record, trim, and normalize audio tracks so this tool fits my use cases very well. Thanks for sharing!
You're in good company! There are countless linear loudness controls out there. My "favorite" from years ago was Logic Audio. Hopefully they fixed it a long time ago.
> The ability to preview EQ changes while the audio is playing back is impresssive
Comments like this surprise me, but probably because the lightest weight thing I'll spin up for audio work is Reaper.
The idea of anything but online rendering for user controlled DSP wouldn't cross my mind - it always aggravates me when I have to do it (there's a few older tools I use where it's the only way to do things like time/pitch edits).
> everything below 1kHz is squashed into the left-most 10% of the plot
Very specifically you want a semilog plot (use center bin frequency, not edge of the bin to avoid the 0 problem) or if you're really fancy, constant-Q/mel/bark scales. Grid should be Frequency = [(1:9)e(1:3),10e3 20e3], Magnitude = [-96:6:0].
Very helpful if you use an exponential average on the bins for meter ballistics.
What was notable to me about the live preview is that a browser-based tool was able to do it convincingly - not that it's an impressive feature per se.
We have Photopea (https://www.photopea.com/) for images, and now we have AudioMass for audio. I love these open source, web based tools that work fantastic. Great job!
Along similar lines, I have been wondering if there are any web-based DAWs or 3D modeler-renderers to check out. It seems like it's probably only a matter of time at this point, anyway. Even if not FOSS, open formats would be great.
Wow, that's fantastic... one thing I noticed instantly is that (to me) the UI/UX is so intuitive. I use Audacity a lot, and the UI on that for core operations: zooming, unzooming, trimming, selecting... is so much more clunky (I can never figure out how to "unzoom") - it drives me mad every time.
This one one intuitive and natural. I'd have to evaluate how file system handling worked, but just based on the UI and snappiness - I'd use this over Audacity for any quick-n-dirty audio editing tasks. Really cool!
Agreed. Audacity is great for quick audio editing but the selecting/dragging/zooming experience is quite annoying. It would be great to have Ableton’s bird-eye view feature, it’s super intuitive and really responsive.
I hope it lives up to its promises - one thing I noticed is using Web Audio on mobile devices is that I get sudden drops and crackling even with the simplest configurations which can't possibly affect the CPU to the point where they are the root cause.
Interestingly, no such issues on desktop - at least not until I add some heavy processing.
They're telling people to please checkout the repo and have fun, which I think is almost a license in and of itself (of course you are then legally obliged to have fun should you choose to use the license), but explicit is better than implicit in these cases.
That's a huge plus in my book. Frameworks tend to obscure what the application actually does because there is orders of magnitude more framework code than there is application code, and frameworks tend to be very indirect when going about their business with 12 different layers hit for a simple operation.
As a counter, if you look at the code, there's a lot of DOM api calls littered throughout which obscure what is going on. This could be relieved by pulling out the DOM manipulation into common constructs that all parts of the app use, but then you're creating your own framework/library and might be better off using a battle tested one.
Given how responsive the UI is compared to most modern UIs built in the "battle tested" frameworks & libraries, I suspect the recommendations in this comment are all well and good in theory, but not necessarily reflective of reality in practice.
Reminds me of the audio editor that shipped with Windows...95? Had some great times with that thing reversing everything in earshot, doing reverse reverb etc etc
sndrec32.exe - I think it's last appearance was Windows XP (or maybe 7, I don't have either to check).
It a shame it's gone tbh, it was a REALLY quick way to just playback an audio file, without all that extra baggage that later playback apps had (iTunes clones).
Please forgive me for being self-centered. I DO think AudioMass is great. I'm running it locally and I even contributed by posting a legit issue in github. But here's the self-centered part: The other day I posted a "Show HN" for something web audio related that I wrote and got crickets so I'd like to try again: https://ctrager.github.io/music_tools. Especially check out "Pitch Detector". All three tools are standalone single HTML files that don't need a server.
Edit: another way I like to look at this is that HN itself is a list, and posting a list to a list adds a layer of indirection that mostly never gets traversed.
These are interesting tools. Pitch detector didn't seem to work too well for me but no doubt my bad singing. You could probably just show both clefs with the relevant clef symbol at the beginning rather than making it an option. For the beat detector, it would be interesting to see average distance from the beat in order to try to improve. It could be a game following a rhythm easily.
Think for HN you probably need a quick demo that will attract more of the large number of people who are not necessarily going to use this tool long term. Give people a hook. Also keep trying, because it's pretty random what gets voted up on any one day. I think with some development and innovation this could be a useful tool. You've also not got any contact info which makes it harder for interested people to get in touch if they like your stuff.
I can't really make it work with singing either, but it works well when I play violin. My motivation is just pitch, to give feedback to me playing violin or my wife trying to learn viola.
I had tried it briefly because my favorite youtube violin teacher Beth Blackerby recommended it in one of her videos, and it's great. But, I wanted the experience of coding something myself (I'm retired, hadn't coded in four years, lockdown has made me antsy) and I wanted something that was a standalone single HTML file, and I wanted something that felt easier. So, I ignore the time dimension and paint the notes on the staff the way a player is used to reading them rather than Intonia's interface which looks more technical.
I actually looked into code of your metronome to see how did you solve timing issues. I once tried to implement drum machine in JS and run into that setTimeout/setInterval are very very relaxed about precision.
8/10, very promising. feels like Cooledit/Audition, which was for a long time the best of its class (Pro T
Tools is the industry standard but that's based on long years of hardware-lock-in). Allow local instances and add Lua or similar user scripting and you've got a winner. Well done.
Haha, it's something I wrote a long time ago (around 10 years back). I wrote it in Cubase and if I recall correctly Symphobia was the primary VST used. I had way more time back then for music than I do now. If you like the piece feel free to grab it (test.mp3 in the github repo). Cheers!
I open Audacity about once every 3 months for some random audio editing, this is definitely a better/more intuitive app. Plus web based is awesome for something I use so infrequently. Great Work!
Very cool! I tried doing some signal processing stuff back in the day and got absolutely discouraged after discovering how much linear algebra was involved.
I particularly appreciate the ability to preview compression. Compression is probably what I use most when I'm editing audio and having that at my fingertips without loading Audacity or Ableton would be super nice for quick, rough changes.
One thing that I'd really like to see would be a de-essing plugin, or even better a multiband compressor.
These are the exact tools I am constantly looking for. Full browser sandbox for no stress "install", local-first, offline-first, so you own your own data - then option for locally encrypted cloud backups. I am almost 100% web now, I use very few installed programs and am constantly trying to get that to zero. One day someone is going to collect all these best-in-class web tools and make a proper chromebook where the user owns their own data.
This would make a good Electron app so it can also be used offline by regular people who don't want to or are unable to fuss with command line web servers.
I dabble from time to time with mixin rekids, and am presently trying to find an audio editor for simple cut n paste that Audacity. Must support MacOS.
What's is out there? My DuckFu is letting me down in this instance.
I'll give AudioMass a spin over the weekend, and like others have said if it could be a standalone Electron-based app that would probably work, and happy to throw a few antipodean dineros at it.
That's insane! I 'm actually working on a lite-daw for web, so this is extremely interesting to me. However I do not plan to go very far. My angle is that this should be a tool to experiment and try out things with minimal friction, then for any serious work, perhaps users can look into professional solutions. Perhaps also take advantage of the web's collaborative nature and have multiple users share a session!
There are decades of research, feedback loops and work put into tools such as FruityLoops, Cubase, ProTools etc, and the thought of reimplementing parts of it for web is such a daunting task.
Multiplayer would be sweet for a web DAW, it rocks in design tools like Figma.
I think you are right, a light DAW would cover 80% of people's needs. And as long as you can export the track as midi and audio bounces, you could always continue it in a native DAW.
I would love to collab if you need UI/UX for this btw? I've worked on audio and DAW stuff for a long time, as well as open source. What's the best way to reach?
this brings me back to the days of cool edit pro! (Idk why!) but it is amazing that you can do that in a browser nowadays!
If I were to be super critical my only pet peeve has to do with the style of the menu :P The color (dark on light) seems disconnected from the rest of the app design and those big rounded corners gives the app a little bit of a toy-ish look (My point of reference for "pro" is something like Adobe Audition, Presonus StudioOne, Pro Tools, etc... kind of look)
But that is just a personal preference
(this is the radius I'm talking about https://github.com/pkalogiros/AudioMass/blob/master/src/main...)
Does this load the whole file into memory while it's being worked on? What if you tried to load a file that is too big? I wonder with these more complex productivity web-apps becoming more common, how something like a video editor might work that needs to work on data too large to put in memory.
Yes, it is all in memory. I am taking advantage for IndexDB for local drafts. And localstorage for plugin presets. But it does not match the flexibility of being able to create lots of big uncompressed files and cache in the disk while workign on a project.
So everything needs to use lower fidelity settings, or do things like compress WAV files in a lossless way with LZMA since other avenues are too heavy. I am not seeing this becoming something like Audacity or Audition replacement, but a quick tool for modifying audio files on the fly.
I'm noticed my CPU fan at full blast and checked my processes (then Chrome task manager), I had left it open an it was using 80-95% CPU in the background.
Tested again, it seems to be the spectrum analyzer (even after I pause playback, or close the analyzer window).
This is smack in the path of Audacity, very nice work. Is it possible to load midi synchronized to an audio file? That's a weak point in Audacity, it can't really edit the midi as you go through the audio and for some tasks that would be extremely useful to have.
This is awesome. As an avid past user of Cool Edit 2000 and Adobe Edition 1.5, I love this project. Fantastic to see something familiar in a browser. As a bonus it hits me right in the nostalgia. I'll be watching and supporting this!
If i could suggest anything it would be a way to make a selection while playing. Like hold down shift, press space bar, and then press space bar again, and it's all selected.
You can extract sections (as mp3 by selecting, and then File > Extract mp3 > current selection). Or File > Save Local Draft (and you can open the selection as a standalone audio project).
Being able to label things with markers and different colors though would be fantastic! It's in the plans, once a bit better audio handling of slices (eg cross-fading, mix-dragging etc) is added!
I noticed that and I do think it is nice. I have to extract and transcribe long sequences, so it would be nice to have the audacity label track feature to bookmark/label a bunch of sections and then output them as individual files named by their label along with a .txt. This is audacity's format:
start end label_name
1.02302 2.23193 label_1
You could take it further and have some numeric labeling (audacity doesn't autofill) and that'd be even nicer. This would be super helpful for working with speech processing data. Regardless, keep up the good work!
It'll be very fun over the years, for whoever is tasked with it, to fix all of the bugs bugs common to audio editors like this.
My favourite one is how, depending on when, resizing the selection while playing with loop enabled can cause the cursor to escape the selection (!). That was the first one I checked for when I opened this up.
I am the author! Wow, I can't believe the attention this is getting! Hopefully this proves to be useful as a tool, and not just as a JS demo! :)
The next plans are - redo drawing library to further improve performance! - polish a bit some audio plugins (like the paragraphic EQ) since some parts feel a bit off (the limiter, paragraphic eq for example). - Add some tutorials! Some things might not be straightforward like using Shift + [keys] for shortcuts etc. - Easier recording mode (like the ability to open a new empty audio project) - Multitrack mode, for more channels! - play a bit more with the concept of having different windows that can be in different screens (check out the frequency analyzer under "view")
To answer a few questions, I plan to have a very open license this is just a fun side project for me. but I need to figure out the licenses of some libs I am using first (eg wavesurfer, lzma-wasm) and do proper attribution!
Thanks again!
PS. I wrote this in 2018, and just kept it on my hard disk until recently, so certain features might be slightly different than back then :)
In particular, low latency (like native roundtrip latencies, so <10ms easy, but depending on the OS) no-jitter/real-real-time audio programming is now something that developers can do. Lock-free/wait-free programming and SIMD are coming in the next weeks/months.
Very cool project in any case, I'll use it when I need to quickly do very high zoom on wave forms to debug things for Firefox.
Sooooo?
Not being able to use Midi from FireFox means that for a whole raft of possible applications Chrome is the only option, which is a real pity.
Please, please, pretty please, give web midi a higher priority.
Realtime audio rendering is a soft realtime problem. If the web audio APIs don't have methods for guaranteeing deadlines for rendering audio, it's only possible to build toy audio applications.
I'm aware of things like bandlab and such. They're still toys and too limited for serious work, where the money is.
In addition to just musical instruments, a huge number of different hardware still use midi. I'm personally interested in DJ-world where things like DJ- and light-controllers use midi and therefore are very easily remappable and very hackable (if the sw is built correctly).
I've wanted to build some DJ-related sw myself that would work via browser but the fact that currently only Chrome supports the standard has so far kept me off it. I'd very much like to see Firefox supporting Web midi.
https://www.youtube.com/watch?v=NV6rdmdZnkA
Get in touch if you want to beta test it and let me know if you think it is fast enough on your set up, etc. Hoping to put it on "Show HN" soon. rjbrown at gmail More about it at https://pianop.ly/portfolio/
In an environment that interprets -all- the codes, MIDI's almost unlimited. Hollywood's used it for a long time. It's very undemanding so people could -certainly- mix their music on the (right) browser. And, if people could add javascript routines to it? Ay-yay.
https://sightreading.training/
https://www.youtube.com/watch?v=NV6rdmdZnkA
(piano karaoke that overlays and syncs with youtube videos)
I have tried some Web MIDI demos (and online CSound IDE) this way.
Easily, reliably, and quickly playing audio is table stakes for Windows and Mac OS. They've been doing it for years. But instead of improving one or two audio APIs, on Linux it is time for a new audio server that will, but doesn't, solve all of the problems of every predecessor.
I mean, I have currently 5 soundcards on my desktop computer, 1 pro over PCIe, 2 pro over USB, 1 standard HD Audio and 1 output in my screen's HDMI, and I can assure you that even on windows it's definitely not a smooth ride between WASAPI, ASIO, MME, WDMKS... things crash or get stuck routinely, and I sometimes get random loud buzzes or no sound until I reboot. With my band we had tons of issues with a M-Audio card on windows fixating itself on the wrong sampling rate as soon as a desktop music playing was launched (this includes web browsers), entirely preventing playback on Ableton Live for instance.
It's barely better on macOS, e.g. look at that shit: https://github.com/OSSIA/score/issues/778. macOS also sacrifices some low-latency when comparing the same hardware on it versus Linux (with raw ALSA or JACK) and Windows with ASIO.
well, no, the web audio API & stuff is explicitly being sold as something that will be equal in capability to other solutions, so definitely things used for pro audio.
It seems like a relatively contained problem to take multiple streams of PCM audio into a computer, locked to word clock. Then the hard, fiddly aspects of analog design can be left to high-quality outboard converters which speak MADI or whatever.
I say "contained" because I don't want to minimize the difficulty of getting such a design right, but it seems like you only have to get it right once.
Then we don't need a USB driver for each converter! We only need one USB driver, for the digital i/o interface. And we can polish the driver for that one interface until it's actually reliable, instead of relying on the sketchy one-off driver for this year's soon-to-be-obsolete USB audio interface.
ETA: Many such converters (most of them high-end) listed here: https://www.sweetwater.com/c796--AD_DA_Converters
If I'm not mistaken the underlying transport protocol is the same for all of those - you can get a coaxial to XLR to get S/PDIF into an AES port or a coaxial to TOSLink converter to get S/PDIF data into an ADAT port.
You can look into the Madiface XT maybe ? https://www.rme-audio.de/hdspe-madi-fx.html or the other RME products which have enough digital I/O to cover a lot of needs
But the point is that I want open source drivers, and open source hardware! I don't want to depend on the health and the priorities of a commercial entity. I want to be able to inspect the driver software and contribute towards perfecting it!
Compared to, say, GPUs, the needs of multichannel digital audio i/o are modest and not changing very much over time.
Some quick usage of Wikipedia suggest that you are, sadly, mistaken. ADAT lightpipe seems to use a completely different protocol (more capable?), and while S/PDIF and AES/EBU use quite similar protocols, they differ in impedance and max and min voltages, so I'm guessing that directly electrically connecting the two controllers is a bad idea for both the controller and the data.
(Licensing could be a concern though if ADAT lightpipe is proprietary — I'm not clear on that. But then we could just use other open protocols instead.)
Windows probably has the best audio stack of them all (battle tested, easy to use UX). In comparison, JACK/pulse are pretty good as well and people use it professionally. Like most things on Linux, the initial UX is a bit of a pain, but once you get past it you get amazing customization, even more so than Windows.
These are the only abstractions I'm aware of on Linux systems - and they are simply built on top of ALSA which is the kernel's core sound API. Almost all desktop environments simply install PulseAudio, and you never have to worry about sound.
CoreAudio is far and away the most impressive and powerful audio API across the board. It's ridiculous how much you can do with it and the abstractions it provides.
It's also been better, faster, and supported lower latency than Windows up until WASAPI came around - you needed to use ASIO on Windows for years. Even today you can't programmatically change the sample rate of a device on Windows, which means that engines like RtAudio have to do resampling under the hood to support basic functionality that's been in CoreAudio.
The only problem with it is that the documentation has evaporated. Which admittedly is a big one.
New MBP 16". Apparently it's a problem with the T2 security chip and affects almost all external USB 2.0/3.0 audio devices. Just do a google search for audio drop outs and T2. All digital audio goes through the T2 chip which seems to add latency and these drop outs. I think the only solution at the moment is to use a USB-C native device (but I haven't tested this). If you already have substantial hardware like I do, Catalina is basically unusable (and no fix in sight from Apple...).
I understand with brand new machines it's a problem, but buying less-than battle tested hardware/software has always been problematic. If you already have substantial hardware, you probably shouldn't be buying a brand new machine and expecting it to just work after a major OS upgrade.
And I've been burned enough times by OS upgrades that I know to be cautious. I'm not saying the situation is good, just that it's a shitshow everywhere. I got around a dozen emails from my device and software vendors telling me not to use Catalina, so I'm not yearning to go out and buy a new Mac to run my software on and connect my hardware to it. I'll shit on Macs for that, but under the hood, CoreAudio is much more impressive than anything on Windows or Linux.
(Nitpick: Linux has nothing to do with Pulseaudio, it's just the kernel.)
1. An port of Audacity's "Noise Reduction" filter. I have done this once [0] (with some difficulty and no doubt with errors) and I am so tempted to just translate it to JavaScript and put up a PR, but I'm slammed right now.
2. It would be very useful to be able to view the spectrograph as an alternative to the waveform, rather than having it live in a separate "spectrum analyzer" pane. Especially if zooming along the frequency axis were implemented, this would make it much more useful for, well, spectrum analysis.
Thank you for making this. It's impressive in its own right but doubly so as a web application.
[0] https://github.com/robin-labs/robin/blob/master/noisereduce/...
I'm amazed that you still have ideas regarding improvements here, because at least the selection performance is buttery-smooth even on a phone.
Great job, very useful product.
I remember the performance to be decent, but not 60fps-decent.
But aside from that phones usually have relatively infrequent touch updates, which usually results in a single repaint on every such event, so 10FPS or so.
Any particular reason you're not using standard keys for cut/copy/paste/select all etc...?
Some of the most horrible web experiences, occur because websites try to take control of native functions. For example "smooth" scrolling, or highjacking the back button, or trying to abuse the clipboard! Confusing the user, breaking navigation, making the page less accessible and in some cases breaking after X months when browser or OS behavior changes.
What I have now is unfortunately far from "good" and there is improvement and experimentation waiting to happen, but the straight forward approach is not much better either...
Most web major apps do this. Office365, Google Docs/Sheets/Slides. Even Facebook/Slack/Gmail since they re-interpret the text (converting :-) into emoji and or replace with images.
Perhaps I should add support for the control key, but let other combinations were conflicts might arise. Getting good UX is a such fascinating topic.
Also, looking at the page load and see less than 80Kb transferred: this is absolutely beautiful! Amazing work!
"RX 7, The industry standard for audio repair": https://www.izotope.com/en/products/rx.html
- First of all, I am amazed at the suggestions and love this is getting. I have been dog fooding it by using it to quickly edit foley audio from a tascam hand-microphone device, in order to make some cheap sound effects for a game project I am working on. The point is, I thought I was aware of all bugs, and all areas of improvement, and I am humbled to have my mind opened and see how valuable outside perspectives are! It's so easy get tunnel vision and think you know best I guess.
- Secondly... as I said I wrote this in June 2018, and just... kept it... I guess I was afraid of sharing it to the world, perhaps the audio people would get mad at me for making mistakes with the audio api (like the fade in/fade out being linear). Perhaps the javascript people would make fun of me for just using Vanilla JS.
But if this is impressive in 2020, imagine how impressive it would have been back in 2018! So I guess my point is. Share your work! Do not be afraid to put it out there!
- If anyone is interested on how it is built, and how the interface complexities are managed, even though it is just plain old school JS that has the reputation of being notoriously difficult to maintain, I would be happy to make a write-up shortly, or perhaps give a talk on it.
- Third... (hopefully that is ok). If you like AudioMass, and like the way it is built and it performs, perhaps you might enjoy working together with me. We are doing cutting edge computer vision, and well.. some CRUD stuff too! My company is hiring (info in my profile). But please be advised that due to covid-19 things may take longer or may not be fully up to date.
PS. As for license, I will probably choose something like "wtfpl.net". if it can help you learn something, or build something, go ahead! If you noticed, the page doesn't have any tracking (I realy don't know how many visitors came (I also disabled nginx logs)). And of course no ads at all. I 'm just trying to build cool and useful stuff!
Google publishes their internal open source policy[1], i.e., what open source licenses can be used in Google software. I think it is a solid reference for what a good corporate open source policy is. It explains the reasoning, it isn't some crazy enterprise things that bans all open source (I've seen that), and it isn't some free-wheeling startup that allows everything with no scrutiny.
They ban the use of WTFPL code[2], and ban contributions to WTFPL code.
[1] https://opensource.google/docs/thirdparty/licenses/
[2] https://opensource.google/docs/thirdparty/licenses/#wtfpl-no...
To maximize the reach of your program, you would be well-served to select one of top-ten or top-twenty popular FOSS licenses. I could provide a list but any list would be biased; just google it.
I have my opinions about which FOSS license I would select, but I'm going to suppress them because I just want to help you ease into the mainstream.
A decent way to choose would be to look at what community you want to be a part of and see what the predominant license choice is within that community.
Imagine the future interface with flac + svg + you’re already well-performant foundation with audio mass
And performance is fine, but it can be so but soooo much better! Like just by adding sprinkling some wasm or asmjs in the "onaudioprocess" loops, to speed up the buffer traversing loops and escape the dreaded garbage collector!
The ability to preview EQ changes while the audio is playing back is impresssive, although the x-axis scale on the parametric isn't helpful - everything below 1kHz is squashed into the left-most 10% of the plot.
Some small nitpicks are that it's currently quite fiddly to use the compressor without a gain reduction meter, and my usual bugbear with simpler audio editors: that fade-outs are almost never useful unless you can alter the curve.
But the fact that this is working so smoothly in a browser at all, and in Firefox to boot, is really commendable.
How come so many apps get this wrong? This is really basic psychoacoustics, and linear fades sound terrible!
> fade-outs are almost never useful unless you can alter the curve.
I agree, but would like to add that you should be altering a logarithmic curve.
I do have to say, this is a super cool tool and I've definitely bookmarked it. I normally use tools like Audacity to quickly record, trim, and normalize audio tracks so this tool fits my use cases very well. Thanks for sharing!
Comments like this surprise me, but probably because the lightest weight thing I'll spin up for audio work is Reaper.
The idea of anything but online rendering for user controlled DSP wouldn't cross my mind - it always aggravates me when I have to do it (there's a few older tools I use where it's the only way to do things like time/pitch edits).
> everything below 1kHz is squashed into the left-most 10% of the plot
Very specifically you want a semilog plot (use center bin frequency, not edge of the bin to avoid the 0 problem) or if you're really fancy, constant-Q/mel/bark scales. Grid should be Frequency = [(1:9)e(1:3),10e3 20e3], Magnitude = [-96:6:0].
Very helpful if you use an exponential average on the bins for meter ballistics.
https://news.ycombinator.com/user?id=IvanK_net
> Since Photopea is not fully open-source, this account serves as a place for bug reports and general discussion.
This one one intuitive and natural. I'd have to evaluate how file system handling worked, but just based on the UI and snappiness - I'd use this over Audacity for any quick-n-dirty audio editing tasks. Really cool!
High Performance Web Audio with AudioWorklet in Firefox 76
https://hacks.mozilla.org/2020/05/high-performance-web-audio...
Interestingly, no such issues on desktop - at least not until I add some heavy processing.
The app is super impressive!
edit: this thing https://i.imgur.com/UXqSteO.png
1. record silence
2. copy paste the recording till you achieve the desired length
3. start recording from the beginning
On AudioMass and its performance/snappiness: this feels much more smooth than Audacity on my MBP, so I'll give it a shot soon.
⋆ or: whatever the memory limitations of your PC were
It a shame it's gone tbh, it was a REALLY quick way to just playback an audio file, without all that extra baggage that later playback apps had (iTunes clones).
Edit: another way I like to look at this is that HN itself is a list, and posting a list to a list adds a layer of indirection that mostly never gets traversed.
Think for HN you probably need a quick demo that will attract more of the large number of people who are not necessarily going to use this tool long term. Give people a hook. Also keep trying, because it's pretty random what gets voted up on any one day. I think with some development and innovation this could be a useful tool. You've also not got any contact info which makes it harder for interested people to get in touch if they like your stuff.
I particularly appreciate the ability to preview compression. Compression is probably what I use most when I'm editing audio and having that at my fingertips without loading Audacity or Ableton would be super nice for quick, rough changes.
One thing that I'd really like to see would be a de-essing plugin, or even better a multiband compressor.
Or just click this https://audiomass.co/index-cache.html
I've tested it. Disconnected wifi went to https://audiomass.co and it worked.
What's is out there? My DuckFu is letting me down in this instance.
I'll give AudioMass a spin over the weekend, and like others have said if it could be a standalone Electron-based app that would probably work, and happy to throw a few antipodean dineros at it.
Saw something like that but for synths - https://www.webaudiomodules.org/wamsynths/
There are decades of research, feedback loops and work put into tools such as FruityLoops, Cubase, ProTools etc, and the thought of reimplementing parts of it for web is such a daunting task.
I think you are right, a light DAW would cover 80% of people's needs. And as long as you can export the track as midi and audio bounces, you could always continue it in a native DAW.
I would love to collab if you need UI/UX for this btw? I've worked on audio and DAW stuff for a long time, as well as open source. What's the best way to reach?
If I were to be super critical my only pet peeve has to do with the style of the menu :P The color (dark on light) seems disconnected from the rest of the app design and those big rounded corners gives the app a little bit of a toy-ish look (My point of reference for "pro" is something like Adobe Audition, Presonus StudioOne, Pro Tools, etc... kind of look) But that is just a personal preference (this is the radius I'm talking about https://github.com/pkalogiros/AudioMass/blob/master/src/main...)
But the project look awesome! keep it up!
So everything needs to use lower fidelity settings, or do things like compress WAV files in a lossless way with LZMA since other avenues are too heavy. I am not seeing this becoming something like Audacity or Audition replacement, but a quick tool for modifying audio files on the fly.
I take it you took the approach of using WASM for audio decoders?
I'm noticed my CPU fan at full blast and checked my processes (then Chrome task manager), I had left it open an it was using 80-95% CPU in the background.
Tested again, it seems to be the spectrum analyzer (even after I pause playback, or close the analyzer window).
Kudos to the creator!
I wish there was a cli for this
Being able to label things with markers and different colors though would be fantastic! It's in the plans, once a bit better audio handling of slices (eg cross-fading, mix-dragging etc) is added!
start end label_name
1.02302 2.23193 label_1
You could take it further and have some numeric labeling (audacity doesn't autofill) and that'd be even nicer. This would be super helpful for working with speech processing data. Regardless, keep up the good work!
.wav export would be grand!
Nice job!
My favourite one is how, depending on when, resizing the selection while playing with loop enabled can cause the cursor to escape the selection (!). That was the first one I checked for when I opened this up.