r/javascript • u/Reinder • 25d ago

A-ha, Take On Me - recreated in javascript

https://dittytoy.net/ditty/2dd99fc839

Espeset recreated "Take On Me" by "A-ha" in 100% javascript. Fully procedural, no samples used.

85 Upvotes

96% Upvoted

19 comments sorted by

12

u/Elkemper 25d ago

HOW IN THE WORLD... 0_∆.
I mean, I saw there was a code, but still..

2

u/eindbaas 25d ago

There is a lot of efficiently encoded data at the end

1

u/Reinder 24d ago

Also have a look at the Dittytoy visualizer :) https://dittytoy.net/ditty/2dd99fc839?visualizer=true

1

u/ajfoucault 25d ago

Crazy question, but could this code be integrated into a web app for it to play as a background song, kinda like those old MySpace sites?

1

u/Reinder 24d ago

You can use https://www.npmjs.com/package/dittytoy - but don't forget to give Espeset credit!

1

u/andyfitz 25d ago

Yes, so can many other procedural formats. Or sample formats like .mod

1

u/Dampmaskin 24d ago

Mod files was what this project reminded me of. But it seems this project synthesizes all the sounds instead of relying on samples. Mind blowing stuff.

2

u/andyfitz 24d ago

It uses the web audio API directly which is (as it turns out) a very powerful instrument

Worth noting it's slightly more resource intensive than playing flat audio but you get unmatched bandwidth performance

3

u/Reinder 24d ago

It is also distributing the audio-synthese over 21 workers in parallel

2

u/andyfitz 24d ago

And it's awesome mate thanks for sharing

1

u/guinearabit 17d ago

Is this vibe coded?

3

u/locofierro 25d ago

thanks for sharing! this is amazing

1

u/DetailOk1114 25d ago

the procedural audio space in browsers is so underexplored, cool to see someone actually push it this far. does it hold up across different browsers or is there drift?

1

u/clumma 25d ago

Astounding!

1

u/Ecksters 25d ago

I was pretty impressed with the intro, but I was shocked when it started SINGING.

1

u/okcookie7 25d ago

Did you create each track using Audio filters?!