mp4box.js
recordable-canvas
mp4box.js | recordable-canvas | |
---|---|---|
3 | 1 | |
1,828 | 6 | |
3.1% | - | |
4.8 | 3.6 | |
10 days ago | about 1 year ago | |
JavaScript | TypeScript | |
BSD 3-clause "New" or "Revised" License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
mp4box.js
-
MediaRecorder convert blob to MP4 for PPTXGenJS video
You can pass the audio and video MediaStreamTracks from the MediaStream from getDisplayMedia() to MediaStreamTrackProcessors for each track, pipe the stream of AudioDatas and VideoTracks, copy the data to ArrayBuffer's, then pass those ArrayBuffers to an MP4 muxer, e.g., https://github.com/gpac/mp4box.js/.
-
Recordable Canvas Web Component
Luckily there are loads of great libraries that can do this for us. One such library is [MP4Box.js (https://github.com/gpac/mp4box.js/). MP4Box.js is a JS port of an incredibly comprehensive toolset of MP4 utilities.
-
How to capture 3D animation and encode it into video by WebCodecs
I could mux the video and audio on the browser into an MP4 with MP4Box.js, but somehow it was misformatted and weirdly played with some players. I gave up and relied on Elemental Convert as it's not so expensive.
recordable-canvas
-
Recordable Canvas Web Component
As these things usually go though, its a CommonJS project. Sigh. I won't get on my soapbox to say ES modules are no longer the future but the present, and we should all ditch CommonJS. Instead, I'll just tell you that I pre-bundled the library with Rollup in the recordable-canvas component, so we can use it as an ES module. We [did this for Tensorflow.js (http://webcomponents.space/posts/s01e03/) on Web Components in Space before. But all it means is that I bundled it with Rollup, so it becomes yet another source file in our project. This means that end users who want to use recordable-canvas can still work with the original source files as ES modules without having to worry about front-end tooling setups themselves.
What are some alternatives?
webm-writer-js - JavaScript-based WebM video encoder for Google Chrome
revo-grid - Powerful virtual data grid smartsheet with advanced customization. Best features from excel plus incredible performance 🔋
mp4-muxer - MP4 multiplexer in pure TypeScript with support for WebCodecs API, video & audio.
svelte-webcomponent-boilerplate - 🏗 Create your HTML5 Web Component with Svelte. Made your web components with this user-friendly boilerplate
webm-muxer - WebM multiplexer in pure TypeScript with support for WebCodecs API, video & audio.
canvas-record - Record a video in the browser or directly on the File System from a canvas (2D/WebGL/WebGPU) as MP4, WebM, MKV, GIF, PNG/JPG Sequence using WebCodecs and Wasm when available.
capture-and-encode