9 ms·
Decode Like It's 1999: MPEG-1 Decoder in JavaScript
- saas_co_de 9y agoCool project. Now if I could just find some VCDs I would be in business.
- frozenport 9y agoIt would appear that warez >>> blog.ston3o.me has you covered.
- marpstar 9y agoAtwood's Law[1] at work again. [1]: https://blog.codinghorror.com/the-principle-of-least-power/ https://blog.codinghorror.com/the-principle-of-least-power/
- HugoDaniel 9y ago"And suddenly you spent two hours of your life and downloaded several GB of tools. All to build a 20kb library, for a language that doesn't even need compiling. How do I build this library 2 years from now? 5 years?" :D
- fwip 9y agoBut the alternative the author suggests is to use UglifyJS - which you also need "node, homebrew and gigabytes of tools" for.
- dmitrygr 9y agoAuthor addressed this by saying that you can also just replace it with "cat" and it will all still work
- markdown 9y agoOr just 20 seconds copypasting on one of the numerous free web services like uglifyjs.net
- eropple 9y agoThis is not under any realistic or sane conditions a solution.
- yjftsjthsd-h 9y agoIn particular, worrying about not being able to reproduce something and then proposing to use a web app for it seems... counterproductive.
- gear54rus 9y agoHaters gonna hate. Installing nodejs is one download. After that it's running npm install and everything just works. It is not anyone's problem that mac or windows want Visual Studio or XCode (wtf is homebrew anyway) for a simple and rare task of compiling something written in C++ for node except the users of those shit systems. Painting a simple problem in the complicated light (where half of the complication is user's fault) might work for some near-sighted haters as always, everyone else will be busy writing code that works and doing it quickly thanks to great tooling.
- 0x00000000 9y agoMy experiences with node include being extremely difficult to install on centos because a dependency was removed from the EPEL repo and random npm packages curling things from random git repos and other sites as part of their install process gross
- gear54rus 9y agoI do always use Centos. I'll be honest I never tried to install it via package manager (because chances are its version would lag behind the official release). You can use nvm (https://github.com/creationix/nvm https://github.com/creationix/nvm) to install only for one user (inside $HOME) or manual install from release page for all users (cp -r */ /usr when inside the unpacked dir): https://nodejs.org/en/download/ https://nodejs.org/en/download/ It will work flawlessly both ways without using any package managers for your system. What is so hard about that for people?
- zaarn 9y agoSometimes you want to run something written in NodeJS as a service user which naturally and usually does not have a home folder at all. Additionally, having to sync up the user installation and service installation if you then create the home folder is a source for bugs both in service and user that can't be crossreplicated between the two. A global installation is desirable when multiple users are required to operate on the exact same versions of a service.
- mozumder 9y agoMPEG-1 is more of a 1993-1995 Peak Usenet thing..
- bitwize 9y agoOo-wee-oo, I look just like Buddy Holly...
- kruhft 9y agoDoes mencoder support encoding of MPEG-1?
- kruhft 9y agoYup: http://www.mplayerhq.hu/DOCS/HTML/en/menc-feat-mpeg.html http://www.mplayerhq.hu/DOCS/HTML/en/menc-feat-mpeg.html
- LeoPanthera 9y agoffmpeg does too, with a built-in vcd preset too.
- Froyoh 9y agoWhen you don't captcha your comment submission system...
- A_Person 9y agoGood writeup. This is probably a silly question, but: The article says he has to use performance.now. But isn't one of the mitigations for Spectre and/or Meltdown, to reduce the accurance and/or resolution of performance.now? If so, would that affect his code?
- userbinator 9y agoRegardless of language, writing a decoder for a standard image or video format is a highly recommended exercise to develop your skills at implementating a specification (and optimisation, if you choose.) You don't have to jump into the deep end with H.264 or similar, and even MPEG-1 is beyond what I'd recommend for a beginner; something like H.261 would be good to start with, with MPEG-1 being the next step up. The fun thing about experimenting with video codecs is that your results are visible in a very real way.
- westoncb 9y agoAlong similar lines, writing a simple emulator (e.g. Chip-8) or a 3D model loader/renderer/animator (e.g. for md2 or md3 files, which have an open spec and lots of models available) would be similarly good I think, depending on your interest. In any case, you still get the implementing a spec practice and very visible results.
- VMG 9y agoCompilers or interpreters are also great. In my experience the knowledge directly translates to everyday programming tasks.
- crankybear1337 9y agoCan definitely recommend this! A few years ago I wrote a JPEG encoder for a class, and it was one of the most fun projects I've had at the university. Seeing a picture with those iconic compression artifacts produced by your own implementation feels pretty nice :)
- rootw0rm 9y agoPretty fantastic post, thanks for sharing. I have a love/hate relationship with JS (which I think is normal?) However, this is one of the love moments. Excellent choice on the sample video too, the Director's Series DVDs have also been my test material for various encoding/decoding adventures.
- yeswecatan 9y agoCould anyone provide good resources to learn more about audio/video codecs? I know nothing about how they work at a technical level/how to write something like this myself.
- blt 9y agocool project! But one question: > A bug that still stands in some Browsers (Chrome and Safari) prevents WebGL from using the Uint8ClampedArray directly. Instead, for these browsers we have to create a Uint8Array view for each array for each frame. This operation is pretty fast since nothing needs to be copied, but I'd still like to do without it. Why worry about it if you're not actually copying the buffer? It's like allocating one extra tiny object per frame, right? It seems like it would be totally insignificant compared to the rest of the workload.
- ygra 9y agoCompare it to a compiler that refuses to compile invocations of methods with optional parameter correctly. Sure, you can just insert the missing arguments with their default values, but you shouldn't have to. It's an inconvenience and annoying, especially for something that should just work.
- shabbyrobe 9y agoPlease be careful, this library has hidden GPL encumbrance issues. See my prior comment for details: https://news.ycombinator.com/item?id=13556718 https://news.ycombinator.com/item?id=13556718
- dis-sys 9y agoIt remembers me this video. https://www.youtube.com/watch?v=J4WSbjN9zng https://www.youtube.com/watch?v=J4WSbjN9zng
- samsonradu 9y agoJSMpeg is a great product. I have used it for low-latency live streaming before MSE (Media Source Extensions) arrived in the major browsers. Nowadays the plugin-free alternatives for live streaming are much more efficient, push fragmented MP4s to the browsers and append to a MediaSource buffer using any modern codec supported.
- vijaybritto 9y agoOh the shade on webpack and npm. Its brutal but for a 20kb library thats actually too much time to setup. Webpack4 has improved a lot now as it supports zero config mode now. All thats needed is a src folder with an index.js in it. Much welcomed change for smaller projects!
- pronoiac 9y agoBuilding an MPEG decoder, video and audio, in JavaScript, over years? Sure! Using JavaScript build tools? Lol nope!
- pjc50 9y agoA colleague of mine "wrote" a H265 decoder in Javascript. I put that in quotes, because it was a byproduct of a much cleverer project: http://www.argondesign.com/products/argon-streams-hevc/ http://www.argondesign.com/products/argon-streams-hevc/ ; he wrote a parser for the "human readable" H265 specification, using the O-Meta system. This supported a number of pluggable backends, one of which emitted a javascript program, and one of which was the actual saleable product of an H265 decoder validation test suite.
- madmod 9y agoWow that is a very interesting approach!
- _pmf_ 9y agoI cannot find anything under "O-Meta"; can you provide a few references?
- seanmcdirmid 9y agohttps://en.m.wikipedia.org/wiki/OMeta https://en.m.wikipedia.org/wiki/OMeta
- pronoiac 9y agoIf the Björk video, All is Full of Love, on http://jsmpeg.com http://jsmpeg.com site looks sorta secondhand familiar, it was cited as a large influence on the makers of the Westworld title sequence: http://www.artofthetitle.com/title/westworld/ http://www.artofthetitle.com/title/westworld/
- mliker 9y agoThis is great educational content. Thanks!
- MaxBarraclough 9y agoSee also Route9, a VP8/WebM decoder in JavaScript - https://people.xiph.org/~bens/route9/route9.html https://people.xiph.org/~bens/route9/route9.html
- Tade0 9y agoI remember when this came out, because at that time we were in a desperate need to shrink the assets of a mobile slot game we were porting from flash to HTML5 for a customer - we had rougly 50MB of data(mostly animations), so the game failed to load on a 2G connection which apparently was the best thing one could get at the conference where the customer's sales rep was at that time. We squeezed them to 10MB with minimal quality reduction, but another problem quickly arouse - this was late 2013 and the phones back then could barely handle such load and heated up tremendously. All in all we negotiated a pretty deep cut in special effects which yielded ~25MB in reductions. A rotten compromise, but a compromise nonetheless.
- yjftsjthsd-h 9y agoOn a phone, could you even see a difference from reducing quality? I've always intentionally gotten the lower quality ex. youtube streams on mobile because on a 4-5" screen I'll never miss those pixels
- Tade0 9y agoSort of. We had a separate file for each animation that contained the grayscale alpha channel and some artifacts were showing.
- robert_foss 9y agoI would think that building ffmpeg with emscripten to produce WASM would be the way to go. If the goal is anything but learning that is.
- tjelen 9y agoIf I remember it correctly MPEG-2 patents are supposed to expire this year. So maybe it's time for JSMPEG2? (Ok just kidding, the whole MPEG-2 spec looks huge).
- jamix 9y ago> Why use JSMpeg? > WebRTC is not supported on iOS. No longer true.
- mbrumlow 9y agoMy stupid robot site uses this! Although I have not had much time to keep any robots on line it can be found at following. http://robot247.io http://robot247.io https://github.com/mbrumlow/webbot https://github.com/mbrumlow/webbot
- Nihilartikel 9y agoI've actually been using a web assembly port of FFMPEG (https://github.com/Kagami/ffmpeg.js/blob/master/README.md https://github.com/Kagami/ffmpeg.js/blob/master/README.md) successfully for a while now in my clojure(script) WIP client-side meme editor for a while https://www.ultime.me/edit https://www.ultime.me/edit For reasonably sized mp4, mov, gif it decodes and encodes at a good speed.
- mncharity 9y ago> Decode Like It's 1999 Here in the future, both Firefox and Chromium are still decoding MPEG in software, not hardware.[1] Chromium is actively working to fix that[2]. Mozilla, not so much.[3] I've been hitting this lately, as webcams use MPEG at high resolutions (to fit USB 2 bandwidth). It's painful for AR. [1] https://wiki.archlinux.org/index.php/Hardware_video_acceleration https://wiki.archlinux.org/index.php/Hardware_video_accelera... [2] https://chromium-review.googlesource.com/c/chromium/src/+/532294 https://chromium-review.googlesource.com/c/chromium/src/+/53... [3] https://bugzilla.mozilla.org/buglist.cgi?quicksearch=linux+hardware+decoding https://bugzilla.mozilla.org/buglist.cgi?quicksearch=linux+h...
- ksk 9y agoWhat is the resource usage of the decoder in terms of 1999 hardware versus 2018?