Question surrounding using WebCodecs to encode video

[James Daniel]

Hey there,

Over the weekend I've been experimenting with VideoEncoder as part of a hobby JS library I've been building around a couple of proprietary animation formats from a Nintendo DS animation app, which can be found here: https://flipnote.js.org/.

I've got as far as taking frames and encoding them into a vp8 track, but there doesn't seem to be any way to mux these into a video container like webm? Ideally I'd like to do h264 in an mp4 instead, but I also couldn't find any information regarding the correct codec string to pass to the VideoEncoder's configure method for that. Is there any way I can achieve either of these things?

My goal was to be able to convert these animations into regular video files, so I could build a web tool that lets users to take their animations and share them on the wider internet more easily. I recognise this is maybe a bit of a niche use-case, but it seems like being able to mux encoded tracks into media containers would be super useful for a wide variety of media applications, so the omission seems rather strange to me. The idea of being able to natively encode video files in the browser is really exciting, and I can think of dozens of potential uses outside of what I'm trying to do at the moment... it would be a little disappointing if the API is going to stop short of that.

Thanks!
James

[Chris Cunningham]

Hi James,

Thanks for trying it out!

We have a number of requests to add muxing/demuxing APIs, tracked here. We've found JS (de)muxing performs well, but the number of available JS libraries is sadly pretty limited at this time. We have a demo that muxes to webm here, and a demo that demuxes from mp4 here.

Re: h264 codec strings, the AVC codec registration gives some guidance here. Generally speaking, these are the avc1.* style strings you may have seen with other web APIs like <video>.canPlayType(). Some history/examples here. See the "demuxes from mp4" demo above for actual usage of such a string.

Best,

Chris

--
You received this message because you are subscribed to the Google Groups "media-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to media-dev+...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/media-dev/LNXP123MB20895F772222AC1DA3B54B56D12E9%40LNXP123MB2089.GBRP123.PROD.OUTLOOK.COM.

[David Halls]

Hi-

I've written a WebM muxer: https://github.com/davedoesdev/webm-muxer.js

Let me know if you give it a try - what bugs you find etc.

David

[guest271314]

> My goal was to be able to convert these animations into regular video files, so I could build a web tool that lets users to take their animations and share them on the wider internet more easily.

See https://github.com/thenickdude/webm-writer-js, https://github.com/guest271314/MediaFragmentRecorder.