Nest 'dem loops

Alright friends, welcome back to JS Party. You know that we love music around here; we like those BMC beats. You know we’ve known to do bad rapping even, and we like music… We aren’t good at music, but we enjoy it, and we thought we’d bring on some folks who are actually good at music, and JavaScript music… But first of all, let me introduce my co-host today, Suz Hinton. Suz, how are you doing?

Hey! It’s really good to be back. I’ve not been at JS Party for a while and I miss you all so much.

Missing you as well. Suz, are you a musical person? Do you sing any songs, do you play any instruments?

No. I played keyboard for a while when I was a kid and I was good at that, and then I tried violin for two years and just never really progressed. [laughs] So I definitely leave it to the experts these days.

As do I, besides my bad rapping. That’s about all I do. I played clarinet in the fifth grade, switched to percussion, because I thought drums were cool, and then I just switched completely away and have not touched many instruments since then, expect to break them, or something. So I’m not musical myself, but a huge appreciator of music, probably more so because I’m so bad at it, you can appreciate the skill involved.

Today we have a couple of super-special guests, two-thirds of a band called Nested Loops. We’re joined by Jan Monschke and Kahlil Lechelt. Guys, thanks for joining us on JS Party.

Hi!

Hey! Thanks for having us.

Let’s give a shout-out to the silent party here, the silent member, @bonotes on Twitter. Bo couldn’t be on the show today, but definitely a huge contributing part to the band.

Definitely. And we’ll definitely talk about him.

We have to talk about him, yeah.

So for the loyal JS Party listeners, you’ll probably remember that I mentioned Nested Loops off the cuff a couple weeks back on the show with Safia and team, talking about documentation. I did a real-life retweet of Kahlil, who had mentioned something funny on Twitter about documentation, and I thought it was poignant and completely relevant to that conversation. And I mentioned, Kahlil, that you’re in a band called Nested Loops… And I was just speaking off the cuff; I called it a reggae band, which was really silly to say that. I knew it was more of an electronic, like rap, like EDM with rap and JavaScript band, but the reason why I said reggae is because when you actually come in and do your rapping, you have kind of a reggae style or Jamaican (I don’t know) accent to your rapping. Is that fair to say, at least?

Yeah, definitely.

[04:11] So did I offend you by calling you guys a reggae band?

[laughs] No, not at all. I thought it was funny. But yeah, it’s really electronic music that is kind of mixing hip-hop, electronic music, and this Jamaican genre of music called dancehall; it kind of comes from reggae, but – it’s similar(ish) maybe to reggae, but it has a very different pace. It’s actually more like hip-hop, I would say, that actually reggae.

Yeah, absolutely. So we can describe it all day, and one of the hardest things for me to do is describe genres of music, especially with so much immersion and blending that is happening… But we could also just play it, since we’re all here with our ears, right? We have one of your tracks set up to go, and I’m supposed to say “DJ, lay it down!”, or I can’t remember what else to say… Play that funky music, white boy! [laughter] So go ahead, DJ. Let’s hear some Nested Loops.

So there’s a little taste. If you wanna hear more of this, we’ll link up to their Soundcloud in the show notes. If it sounds familiar to you, it’s potentially because you were at JSConf EU last year, where this was performed live on stage. Suz, you were there.

I was. I’ve actually seen Nested Loops perform live twice, and both times I’ve been both blown away by the music, the effects, the fact that it’s all run live, but also just seeing my friends and speakers I look up to being sampled in that way… So unexpected. I really think that that is so much fun. It’s the best opener to a conference that I’ve ever seen.

Heeey! Awesome! [laughter]

High praise, high praise…

Very!

I think that the music by itself stands alone very well, but when you’re immersed in things like projection mapping, and CSS-driven lights - and I realize that I’m spoiling part of this episode, but… It’s just so exciting!

Good job, guys! Well, I was not there, but I remember seeing this on YouTube, and having the extremest form of FOMO ever, thinking “Oh, this is legit! This is like a concert, this is amazing!” and hilarious at the same time to see all these non-sequiturs or these out of context talks getting pulled into a song that a) actually sounds like good music, and then b) makes you laugh when you hear the content of the things. The JSON payload is just hilarious, like “What is in there…?!” Because we’ve all thought that like “Okay, I got this JSON, but now I have to go figure out what the crap is inside.” Tell us about the start of Nested Loops… Did it come together for JSConf? Was this a band that pre-existed? Give us a little bit of you guys’ background.

[08:23] Well, this band started in – I think it was 2014… No, it was 2015. I had a talk at JSConf 2014, which was about web audio and my master’s thesis about collaborative audio production in a browser, and I had this idea to take this a step further and not just produce music in your browser, but actually perform in your browser. Then the organizers of JSConf EU asked me to perform the next year, because they already had musical performances to start the conference.

Then I came across Kahlil on Twitter. I’m not sure why I was following him; I think he was on another podcast actually, and he was tweeting about him being a musician in his pre-developer life… And then he shared a video and I was just blown away by his performance. He’s a pretty good rapper, and I really like the style. So when JSConf asked me to put together a performance, I was like “Yeah, I have to talk to Kahlil about this.” That’s kind of how it started.

Kahlil, how about from your perspective? Do you have a history? Were you in rap? Were you a musician previously? Were you in other bands? Tell us about yourself.

Yeah, I mean I’ve been in bands since high school. At the beginning it was rock bands, or indie rock bands, or grunge… And at some point I got into rapping. At the end of high school I teamed up with some friends, we had this multicultural rap group - German rap, and French rap, and Arabian rap… It was kind of cool. We worked on an album for a couple years, and then did some contest and won it, and that was really cool.

Then everybody just dispersed into different directions because people had to go study, and stuff. I was one of the only ones that stuck with music a little bit as a hobby, and I went to go study… But then I really got into dancehall, and there was kind of like a dancehall/reggae kind of hype going on in Germany. In every city you had sound systems playing that kind of music; it was at the beginning of the 2000’s, it was a really big hype. So I really got into that.

I had a gig with my hip-hop band back then, and there was this dancehall sound system that was playing after us, and I really loved the music, and we linked up. So I really got deep into that music, and I just kind of gravitated to the energy of that music very strongly… And I still love it. And I just wanted to do it. I saw these artists perform on stage, on videos on YouTube and stuff like that, and I was like “That’s kind of what I wanna do, so I’m gonna try to get into this.” I got into the language - or accent, or whatever you wanna call it [unintelligible 00:11:52.01] and then I got kind of serious about it. I recorded a demo, I sent it to labels, and there was actually a label in Germany that took me on, wanted to mentor me and manage me, and we did…

[12:11] After my studies I was just doing that for like four years. I was living in Leipzig (Germany), where that label was, and I was really stoked to be with that label because back in the day they were the only German kind of label that was releasing really good music in that genre… At least that was my opinion at the time. I was really stoked to start to work with them, and then I started working with them and we recorded a lot of singles and released a lot of stuff digitally. I was touring in Europe a lot during those four years, and it went kind of well. It was pretty undergroundy, the whole scene… It did okay.

One of the most exciting things was that there was a Japanese label that wanted to do an album with me and we went to Japan for a week to promote it, and stuff like that. That was really cool.

That’s cool.

Yeah, hanging out in Tokyo for a week… That was really awesome. So that was just part of my life, or was my life, for a long time. Then I just made the decision to go back into development after a while, because it didn’t really work out financially for me, and also, the team that I was surrounded by was not a really good fit in the end… And development was always a passion of mine too, and it was fun to get back into that as well. But I also met my now wife, I needed some stability, so I started working as a developer again, and then that became my main life… But I was always doing music somehow in the background. I’m always doing music somehow, a little bit, here or there.

Then this happened, where Jan saw – for some reason, I felt like tweeting out this video because nobody really… Because on Twitter people know me as this JavaScript developer and nobody knows me from back then, so I tweeted out that video - which is this video we made in Japan, in the streets, and I was performing that song from that album - just to kind of shock people… [laughter] And just to have fun. Then Jan responded to that, and that was kind of how it came together. He was like, “Do you wanna do this performance with me?” and I said “Yeah, sure. Let’s figure something out.” That’s basically how it started.

So Jan would be the technical part, I would be the rapping part, and there was somebody else who was supposed to be the music part, so somebody who produces the music… And we had no idea what we were actually going to do back then. It was just like “Hey, Jan does all this stuff in the browser and make sure that JavaScript takes care of playing the music” at least, right? Or you can manipulate the music, or something like that. There was this vague idea.

Then there was this other guy who was into producing, and I was (like I said) a rapper, and we were then brainstorming in the Slack channel and we were trying to come up with a musical style that we could all agree upon. I think the styles that me and Jan wanted to do weren’t really a good fit for our then third person… Is that fair, Jan?

Yeah, definitely. There were band problems before we actually started. [laughter]

Yeah, you’ve gotta have band problems, right?

We had to split up before we started…

It’s a must-have. [laughter]

[16:08] Yeah… So that didn’t work out. My brother, Boris, who is @bonotes on Twitter - he is a really great producer… I mean, in my opinion. [laughs] He makes great electronic music, and he’s been doing it for many years, too. And he had just all these really cool beats lying around on his computer, so I was like “Hey, let’s just bring in Boris”, because we didn’t really have tons of time left; we had like a couple months or three months, and we had nothing, so we needed to figure something out. And we had kind of – at least I had really kind of a high… What do you call – I only know the German word; I just wanted high quality when it comes to the music.

Oh, having like high standards.

Yeah, when it comes to the quality of the music I wanted to have something that I would really like. But in order to have that quality, then you have to produce a track, and then everybody has to agree on it, and stuff like that… And producing something like that, that has the quality that we wanted, takes a long time, and we only had these 2-3 months. So I suggested that we just get Boris on board and just review some of his beats that he has lying around.

We did that, and luckily, we found something that Jan also liked, and I liked, and Boris likes his music of course, and Boris was on board, he was happy to help… So he did some more production work on that, and I started to write some lyrics, and then Jan was working on getting the music to play in the browser, as well as also video snippets. But Jan, I don’t remember how that idea then came up… That was also still very vague, I think; we wanted to take talks and then cut them up, and we really didn’t know how we would do that… Do you remember?

Yeah, so the general idea is of course not an original idea. I saw this TED talk by Mark Ronson, who’s a pretty well-known music producer…

Oh, yes…!

He had this talk about how sampling changed the music industry, or something… And it was this amazing TED talk where he remixed TED talks (in a TED talk) and it was hilarious.

Oh, wow…

Very well-produced. It’s pretty good. I still listen to it from time to time. And yeah, I kind of wanted to do the same. The cool thing was Kahlil’s tweet, where he talked about his musician life, came at the right time, because for a very long time it was just me having this idea and not knowing how to execute, because my musical background is rather shaky… So finding musicians on Twitter that also liked JavaScript was like “What are the odds…?!”, so that had to happen. So I think it was this TED talk that influenced this entire thing.

That’s right, that’s right. That was the original idea. Then we thought, okay, we can take JavaScript talks from people that we admire, and then try to cut that together to something, to a message of some sort, or something like that. Then what we started to do is just download all these talks that we thought were funny or interesting – well, not funny, but mostly interesting…

Sure.

[19:51] Some of them were also funny… And we tried to identify segments in those talks, or little snippets that we could take out of context and then put together with other snippets in order to produce something that would be compelling in some way.

And how long did that process take? You had to sit and watch talks, and take notes, and do timestamps, and things like that… How long was that process, given that you were starting to get close to the deadline?

The deadline also was, like Kahlil said, three months away, so we didn’t have that much time. I think we met at your place in Stuttgart. The three of us - we had never met in person… And then we just downloaded all these videos and we were literally for two and a half days watching videos, taking notes, and then kind of sticking it together, or something.

I guess we still did more on weekends after that, but it was definitely dozens of talks we watched.

At JSConf were the organizers aware of what the final output was gonna be, or were they giving you any guidance? Or was there sort of like complete silence and then you presented them with this thing?

We checked back every now and then, just to feel out “Is this okay? We wanna do this…”, and basically they just said “Yeah, go ahead and do this”, and we just did it.

We never showed them the final thing though.

Yeah, of course.

They were also not sure what was going to happen.

Yeah, exactly. Especially for the first time, we showed them the final thing, of course, and then – because we would not just show up and do something that they never saw before… That’d be crazy. But we didn’t really know until like almost the last day how it would actually come out.

What also came into that – we did not only take the audio snippets, we also took the video snippets, and then those had to be also presented in some cool way, right? Because they come from different videos, of different quality, and they should all kind of look cohesive and be branded in a JSConf kind of manner… So Boris also came up with a way to put a filter on the videos and make them all look pixelated, and then have the talkers kind of be silhouettes, in kind of the JSConf colors, and then Jan figured out some hack to actually play those videos in the browser, so that we can trigger them on the beat, live, and they’d just play without a lag. So that was also like a really hacky kind of thing. Jan, maybe you wanna talk about that.

[23:35] This is like the first time we did this, and since it was a short deadline, we just had to make something work, so I’m very not proud of the software stack there. The problem is if you wanna press a button on your computer or like a media controller and then want to have your browser play a video and sound without much delay - because in music you only have a couple of milliseconds to be on point - we had to use very obscure hacks to get videos to play right on time. You have to preload all the videos, transform them, get their data URL, and then keep all these videos in memory, and then they would play okay, but from like a 5-second video snippet, that would generate 200 megabytes of RAM. I think at some point I used 3 GB of RAM with these 20 buttons that we were supposed to press. It was pretty much like put everything into RAM in an obscure way, and then it’s fast enough.

And it all came together.

Yeah, it all came together. And we ended up just playing around with the snippets on top of the beat at my place on one weekend when we were meeting all together, and that’s when actually the story of how the snippets play off of each other came together. It just was funny… We just tried to talk about JavaScript and about its quirks, or let the speakers talk about JavaScript and its quirks, and what JavaScript is or isn’t, in a funny way where these snippets are taken out of context… And because they play off of each other, they then make you laugh. That’s kind of the recipe that worked for us the best, and it was the easiest to come with that and play around with that - just take them completely out of context and see what happens… But also kind of pick up on subjects of the last year of JavaScript world, for instance functional programming, or React, or virtual DOM.

I think our first track that we did for JSConf had a whole bunch of “Virtual DOM, virtual DOM”, in the first iteration… [laughter] Just “Virtual DOM, virtual DOM, virtual DOM…” It sounded funny, and it was such a big topic… Yeah, so we were playing with actual big topics, and these snippets out of context. It was funny, and it was fun.

Yeah, I especially liked that we make Crockford say that he loves classes. [laughter] That was amazing. There’s a smirk on my face when I listen to that line. [laughter]

Can you give us a few more technical details around the tools you used? You’ve sort of alluded to having some challenges when it came to trying to drive this whole thing with JavaScript, but can you maybe just break down the pieces at a high-level, so we can sort of drill down on a deeper level for some of the other parts?

You have your MIDI, but then is that connected to JavaScript? And then you have your videos, and is that playing in a browser? What kind of tools did you use that are standard for this sort of industry, and then where did you have to get creative when it came to JavaScript, such as having three gigs of RAM?

Yeah, so there are two iterations of the software. There’s the one that is a good piece of software that I did for the last two years, the last two performances, and then there’s this obscure hack. But essentially, it’s this - you have a MIDI instrument, and it has a bunch of buttons. Midi is just a standard of like a messaging format that is used for mainly music hall devices. Let’s say I press a button on this thing that is connected to my computer, and then the browser registers that through the Web MIDI API. There’s actually an API that lets you connect and talk with these big music MIDI controllers.

[28:02] Essentially, what you do is you press a button, you get this message in your browser, and then you need to have some sort of system that knows “Okay, if I press this button, then I play this video”, and it should do that with the least amount of delay as possible. That’s kind of the basics. That’s pretty much what was the first iteration. It was like, I press a button, and then it does a thing.

Then what becomes tricky - the MIDI thingy is very real-time, so I press this button and it actually plays the video… But as we’re all just humans and maybe not perfect in timing, usually music software has this thing built in where it kind of quantizes (I think the word is “quantizing”, but I think I shouldn’t use this word), so it’s like I press this button and the music software knows when I actually should play this. I’m actually a bit too early, so they will schedule it to be 12 milliseconds later, to perfectly match the background beat that is playing. The first iteration of the software didn’t have that at all, and then in the second iteration we built this whole thing around this that had like a scheduler in it, and it’s like “Okay, I know I’m at beat X, bar Y, and then I know now I have to play this, what you just pressed.”

There were some glitches in the first performance, that probably nobody who’s not really listening to if there are quirks and glitches hears, but as a performer you definitely hear these things. The second iteration had this whole scheduling built into it.

So yeah, the first one was only a plain JavaScript HTML website, and it had a Canvas element… Let me go back one second. The video had all the audio in it, so you would play the video with your MIDI device, you would trigger that, and then there was a Canvas that was connected to the Web Audio API, which is another set of API, that would analyze the audio of the video and then would show waveforms as a visualization of what they are talking about, and we would use that. It would also use the Web Audio API to actually route the audio of that video to your external speakers, and all that stuff. It was very bare bones. Does that make sense?

Yes, it totally made sense.

Okay, cool.

I really liked that you talked about the scheduler, too. I’ve definitely written a sequencer before in JavaScript, and because I’m so bad at music, I just said “Whichever beat it’s closest to, just schedule it for that next time.” [laughs]

Yeah, exactly.

So there were other parts to this as well, right?

For this one not so much, actually. The first iteration didn’t really have it. The creative process was Boris, the producer - he would tell me which samples he wanted to use, and then I would go to GitHub and edit this and then send it back to him… Because I don’t think we’ve mentioned this, but Boris is actually not a developer.

Yeah.

He is an architect.

Yeah, but not a software architect… [laughter]

That’s a common misconception…

That’s the question that everybody asked at JSConf… [laughs]

He draws pictures of buildings, right? [laughter]

Yeah, yeah. So the way this worked was he would tell me the samples and I would implement this in this website, and then I had to deploy this… So there was a huge roundtrip time for getting the song together, and it hindered him in his creative process a lot. So in the second iteration of the software I built an Electron app that had this software built in where you can load all your samples in, and you can kind of like define the setup of your MIDI controller in there… And then I wanna press this button, and it’s like a visual representation of your MIDI controller, you click on it, and you select “Oh, this button should play this video, this audio, these effects” and all that stuff.

[32:27] I built this software so that we could work much more efficiently on future songs… So I wouldn’t have to deploy a new version of the website when he had an idea, to implement different parts of the song. So that was a much bigger production around this in the second iteration.

Whenever there was a bug, he would just send me his zip file form this Electron app, or that exported format that I came up with, and then I would debug this, and send it back, and all these things. That was really fun. My first Electron app.

That’s a very cool collaboration.

Yeah, it’s so cool that you can do that with JavaScript, that you can make a desktop app and implement something with drag and drop, or upload those snippets in there and stuff, so he could use it very easily. That was really awesome. It’s actually a really good, very cool piece of software. If you wanna do this sort of thing, it’s all on GitHub.

Did you say that you did it in Electron as well?

Yes.

That’s so cool!

Electron is kind of like the host for all of this. It has the Web MIDI support, so it supports two kinds of controllers only. One is a really cheap one that I have two of, and then there’s a really expensive one that I had to borrow, but Boris really likes… So it does that, and then it does all the scheduling, and the drag and drop of files, videos, audio, all that stuff, scheduling… And effects, and also video effects; that’s something that we added later on.

This whole thing has a live mode; when you press TAB, it goes into this live mode that is rendering all the videos with a WebGL-shader-enhanced representation of the snippet that you wanna play. That was done by Martin, who is the permanent guest in the Nested Loops. [laughs] He’s the visual part of this group.

So yeah, in the second iteration, this was built into the software as well, and because we already spoke MIDI, I added a little thing just right before the second time we performed… That was like a MIDI controller where you could control parameters of the WebGL experience. So I can live-change the size of the dots, and opacity, and all that stuff. That’s the big second iteration of that software.

So that’s out there, people can use it, you can give us the GitHub link and we’ll share it in the show notes?

Yeah.

That’s spectacular. I did not know that.

That is really cool.

It’s all open source.

So I know that Martin is not here, but can you tell us a little bit about the fact that it wasn’t just the music in the video, but there was a lot of other stuff going on, such as the lights in the actual room as well…? I might be remembering this incorrectly, but were they controlled basically with a CSS translation protocol?

Yes. This is all Martin’s work, so I’m not taking any credit here. He had this idea, and when Martin has an idea, that’s always a good sign; then he gets really obsessed with this. He’s like “So we have this amazing venue, and it has these lights, and we can control these lights…” Because all these lights in all venues - they also have a protocol that they all speak. It’s like MIDI for these music instruments, they speak DMX, which is a similar kind of protocol. And he’s like “Well, I don’t like programming DMX.”

[36:13] He could control all these lights, rotations, color changes with JavaScript, but he’s like “There has to be a descriptive way of doing this”, so he built his own CSS light editor. It’s like a superset of CSS that he can punch into this editor, and then he changes the lights in the venue. That blew my mind. It’s like, you type some CSS, and then all of a sudden that spotlight there is grey, or white, and then it turns blue; he’s like, “Yeah, yeah, I can do that.”

Then he also built in transitions. [unintelligible 00:36:57.12] Of course, CSS is animations, so of course his light programming thingy also needs to have animations, so he’s like, “Okay, let me animate the rotation”, and then all of a sudden all the lights in the venue were just spinning, and it’s all done in this CSS editor that he built… It’s like, “What is going on?!” I was so blown away when he did that. I’m not sure if that’s open source.

We should get him to open source it.

Absolutely.

One more note… He also had a second iteration of that, and that was he built like a 3D model of the actual venue, and then he could – sorry, Martin, if it’s wrong, but there’s something-something, he built a 3D model, and then he could trigger CSS classes on spotlights, and that would turn them on and off as well. The way this was done was also his own object model that had classes built in, and then depending if you add or remove classes, it would change the light in the venue.

We also gave a talk at JSConf - not the last one, but the one before - where we kind of presented how we did it, and I think one of the best parts was definitely Martin describing his process and what he built. It’s definitely worth a look; it’s on YouTube, I’ll put it in the show notes. He blew everybody’s mind, because when he shows his 3D model there – because he was basically just saying “You know, I couldn’t practice/rehearse at the venue because the venue was closed. I could only rehearse on the day, a few hours before it starts, so I just created a 3D model/thing for my CSS lights…” So he did that with (I don’t know) some library. He used a bunch of libraries to put together–

Three.js yeah.

Three.js, exactly. Because he also has a background in 3D stuff, I think, so he did that and he showed that, and everybody was like, “Wow…” Much applause. So cool.

I don’t know about you, Suz, but all this makes me feel kind of like a worthless excuse for a developer over here… [laughter] Like, “Man, I’m a non-contributing zero. This stuff is amazing! What have I ever done…?”

[laughs] There were just so many pieces that came together, and on top of that it’s all JavaScript and open web technologies. It’s so many combinations of wonderful things that even just hearing you talk about it without actually being there - you can imagine all the different pieces coming together. It’s incredible.

So we mentioned the visuals - amazing technical feats pulling this all together. Suz, I think we know why we said it actually sounds like legit music - because we have legitimate musicians putting this thing together. You heard a little bit of the track; if you haven’t watched the YouTube video, you have to see it in action. We’ll put that in the show notes, as well.

Guys, I wanna go big-picture for a minute and talk about maybe an emerging trend of programming-focused or based software development music, and if that’s something that can actually become a sustainable – not a genre, because we know that you mix genres, but a growing trend. I was just reading through some of the YouTube comments on this video as we chat, and people are legitimately excited about these songs. Somebody’s saying “I need this on my Spotify”, somebody [unintelligible 00:42:32.04] Lots of comments alerting this music is wonderful; of course, all the nerds come out, and we do our console logs in our alerts, but… [laughter] Genuine praise, genuine enjoyment… I know that when this particular track first came out, it made me laugh, but then after a while I just put it on loop and put it in the background while I was programming.

I’m curious what your guys’ thoughts are – I know you’ve done these three performances; Nested Loops seems to kind of exist around and for JSConf, but is this something that could potentially become its own mini-movement? Or maybe it is and I just don’t know about it.

Good question. I’m not sure. I only know of us and JS Live Network, which they also really – their contribution last year for JSConf was also really amazing. They’re also combining visuals with music, but they just have way more gadgets than we do, everything is kind of driven by JavaScript… And I’m not really aware of any other program or bands. Have you seen any more around, or…?

Well, in the pre-party Jan mentioned that there’s multiple JavaScript bands, so I was interested to hear about what that means.

Yeah, I don’t think Kahlil remembers my other JavaScript bands…

Oh, the Semi-Colons!

The Semi-Colons, oh my god!

The sibling conference of JSConf was Reject.JS, and the host band was called The Rejects, so that was another one. These two bands were literally created for these – oh my god, yeah, The Semi-Colons… I completely forgot the name of my own band. Yeah, The Rejects was the song name and not the name of the band. Oh, my god… Thanks, David in Slack.

So straight us out… What was the name of the band and what’s the name of the son?

The name of the band is The Semi-Colons, and the name of the song was called “We are the rejects.”

Okay.

But these are catered towards these two conferences, but I happen to be the organizer of the Web Audio Conference, and in the Web Audio’s scene there are many people that are actually live-performing music with web technology. They don’t necessarily refer to JavaScript in the lyrics or anything, it’s like legit musicians. There’s some people – there’s Matt Mckegg, with an awesome… It’s called Loop Drop. It’s an Electron-based music production environment, and he has been performing at festivals with that, with this Electron app. But he is also struggling with that, because JavaScript and Electron - they have all these quirks where they might just crash. The browser is not yet ready for like a live set of 1.5 hours of heavy music performance.

But there are definitely people out there, people that do live-coding environments, and that is pretty cool. I think JavaScript is ready for primetime in a sense, but I haven’t seen major acts using it yet.

[46:11] When you look at these things, I guess maybe from a business level perspective, or maybe analytical, you look at communities growing or shrinking, and in terms of your potential listener base as a JavaScript-focused band, or JavaScript-based band, or whatever it is, it’s something that is growing leaps and bounds. The programmer community at large is growing leaps and bounds, and then JavaScript inside that. Only Python is growing at a faster rate of adoption than JavaScript right now, and I think that’s mostly due to a lot of the machine learning tooling around Python; other reasons, of course, but I think that’s a major factor.

It’s a community that’s getting bigger and bigger, and so you have people that are more and more interested, where you could make music that not just reaches them in a musical sense, but also intellectually tickles their JavaScript or programmer/nerd things that you’re already doing. I think there’s some potential there.

Oh, I see. Now I see where you’re getting at, yeah.

[laughs] Yeah, I’m sure that there would be potential there. What interferes with it is that everybody, of course, has their own musical taste. If that music is not your thing, if that specific flavor of music is not your thing, then it’s not gonna – so you can only reach a subset of those people…

True.

…but Jan, it might be interesting. If one could do it on a regular basis – I think in order to gain an audience that is gonna be loyal or that really sticks with you, you need to have a lot of releases throughout the year. That’s kind of how musicians nowadays do it, I think, especially up and coming musicians. So you would have to write a track every month, or something like that, and then keep pushing it out and really hustle. But it could be, definitely.

Nerd audiences are, I think, a really cool target audience. I remember there was this one musician - I’m sorry, I have totally no idea what his name was - that was pretty big on Twitter, especially amongst nerds, because his lyrics are just very funny, about dinosaurs, or comic figures, and stuff like that.

I know who you’re talking about and I can’t think of his name right now either. I was about to say “This is his name!” and it just [unintelligible 00:48:44.25] my tongue.

See, you know him, too!

Yeah. He’s so good… He’s so good he’s anonymous. [laughter]

But I honestly think that there are enough topics only in JavaScript land that can be like a muse. If you look at only things in React land right now… Whenever there is like a big announcement from the React team, you can make a song out of that. [laughter]

We could make a Nested Loops song just with two talks about that.

Really, this is like a perfect setup.

Yeah.

I think you’re right, and I think especially if you focus on the lyrics… Kahlil, maybe more in your category of like rapping. I think if you had – and I’ve joked around with Adam about this, because I’m a terrible rapper, but I joke about being a programmer rapper… I come up with ridiculous things that aren’t good. But if you’re actually skilled at such things and you can apply that into a space where there’s really nobody creating musical culture for us - to us and for us, and by us, so to speak - there’s just tons of stuff that you could do in the rap game around these things, which I think would resonate with a lot of people. Or maybe that’s easier than coming up with brand new music all the time; just a little rap, maybe even just sample the music and come up with lyrics.

Jump on some beats. You can get some instrumentals from iTunes, or whatever, and then just jump on that. But of course, writing those lyrics is definitely some effort. [laughter]

[50:20] Oh, of course. I’m not looking for a get-rich-quick plan here. [laughter] I just feel like we’re coming to a point where the critical mass – I mean, Robert Tables in our chat has been talking about “How do you even keep up with the JavaScript community, let alone the technology?” The technologies are far-reaching and fast-moving, but the community is everywhere.

Suz, you’re out there in the community all the time, and you can’t be on the podcast because you’re always at a conference, so there’s just so much going on that I feel like we’re a growing group.

Yeah. I now know what we actually need… Every time the TC39 comes together and meets, we need to have some kind of rap song musical summary of exactly what went down; so if someone could take the minutes of the meeting and actually turn that into a song, we could be all caught up in like 3.5 minutes. [laughter]

That’s a good idea.

I think we’re onto something here. So this Loop Drop tool is cool; I got that in the show notes as well, loopjs.com. Suz and I are not in this space creatively very much, so we were wondering if you guys have knowledge of, or can point people towards tooling in the web technologies or in the JavaScript space, beyond the ones you’ve mentioned already, that people can use to create either generative music, or this kind of thing… What kind of tools are out there, or what’s missing in the community where [unintelligible 00:51:40.10] make music?

I think for a lot of people it’s missing the basics of what music making means. I include myself in that group as well, because I don’t have a musical background per se, but… There are some amazing web-based tools to learn how to make music and then also to get into making that yourself. Ableton, who is the producer of one of the biggest music production softwares in the world, and they have this website called learningmusic.ableton.com; it’s a web audio app that pretty much teaches you everything you need to know to get started in making music, and how music fundamentally works, how the timing works, what the different genres are, and how to make a nice drum line, and all these things.

Then you can go one step further and look into “Okay, the Web Audio API is out there… How does it work?” The Web Audio School is a great tool. It’s written by Matt Mckegg, and it’s an amazing tutorial that shows you how to get into audio programming… Because it’s a very different field from our general web development, and I think that’s the first hurdle for most people.

Do you know also if there are any communities that people could try and get in touch with? Whether there’s almost like a demo scene for live music production, or anything like that? Because this whole thing just reminds me of the [unintelligible 00:53:30.00] but it’s music… But I really don’t know anything about this stuff

[53:35] Yeah, definitely. There’s the Web Audio Slack. I think it’s web-audio-slacking.herokuapp.com. The implementers of the Web Audio API do hang out there as well. If you just wanna get into working with Web Audio API, you can ask all your questions there, and you might get the [unintelligible 00:53:57.15] from the Chrome team, answering your very beginner questions. They’re happy to do that there. I think that’s the perfect place. There are a lot of people there that work on production websites that use Web Audio, or our performance.

Very cool.

Awesome stuff, guys. Thanks so much. All links will be in the show notes. Any final, parting thoughts? Suz, any more questions for you? I’d love to know what the future of Nested Loops is, that would be my last question, but beyond that, any other final words for us and for our audience?

Yeah, I really wanna know if you are coming back for JSConf EU next year, because I saw that the CFP was open.

There are conversations going on… That’s all I can say for now.

[laughs] You heard it first on JS Party, “There are conversations.”

“There are conversations…” [laughter] Well, let me also add, if you guys ever want to debut a new track, you have JS Party as a launchpad for your new music. If you’d like to debut any time, come back, play some brand new music on JS Party. We would absolutely love that.

Well, maybe we should actually use snippets from podcast episodes in that case…

Uuuh… Now you’re talking our language. [laughter] We’ve got some great stuff for you.

Well, if you can do some prefiltering for us, that would be very helpful… Maybe we can do something.

Oh yeah, that would be great.

So do some samples, and that way you don’t have to watch hours of video - yeah, that makes sense… Or podcasts. [laughter]

Yeah, listen to hundreds of years of podcasts.

We have some very funny outtakes that we’ve already filtered out, so we might actually be a bit ahead.

That’s cool.

Alright, so… Coming to headphones near you, potentially; “there’s conversations” about a potential JS Party Nested Loops collaboration. Stay tuned for that… That’s super-exciting. Also, if you enjoyed this episode, go back and listened to the conversation I had with Feross a couple weeks back, all about BitMidi, which is another really cool music-focused, web-based JavaScript application, and all the nitty-gritty on that. That was a fun one, so go back and listen to that.

That’s our show for today. Thanks so much for the Nested Loops gang being here, and hey, you never know, you might be hearing them again soon. We’ll see you all next week!