This guide explains how to use the native MediaRecorder API to capture screen, audio, or canvas streams in the browser, walk through a three‑step implementation—getting the stream, recording it, and handling the output—and shares best practices for compatibility, MIME types, user permissions, resource cleanup, and performance.
This article provides a comprehensive guide on using WebRTC, getUserMedia, and MediaRecorder to capture camera and microphone streams, perform screen capture, visualize audio, handle device and network checks, convert media formats, and integrate real‑time speech‑to‑text services, while sharing practical pitfalls and solutions.
This tutorial shows how to capture, record, and replay a shared screen using WebRTC's getDisplayMedia and MediaRecorder APIs within a Vue 3 front‑end, providing a live demo link, screenshots, and complete source code for index.html and main.js.
This tutorial shows how to request camera access, capture video with MediaRecorder, and play back the recording in a web page using Vue.js, complete with an online demo, screenshots, and full source code for index.html and main.js.
This article introduces WebRTC fundamentals, explains how to enumerate audio/video devices, describes MediaStream and MediaStreamTrack concepts, demonstrates using getUserMedia for media capture with constraints, shows screen sharing via getDisplayMedia, and provides code examples for recording and downloading video streams using MediaRecorder.
This article presents a comprehensive technical analysis of cross‑platform web screen recording, covering strict business requirements, evaluation of rrweb, ffmpeg, and WebRTC solutions, detailed implementations for video and audio capture in Electron, handling of lock‑screen issues, WebM metadata fixes, memory‑usage constraints, and performance optimizations.
This article explains WebRTC fundamentals, covering camera and microphone basics, frame rate and resolution, tracks and streams, the getUserMedia API with constraints and error handling, device enumeration, MediaRecorder for client‑side recording, and screen sharing via getDisplayMedia, all illustrated with practical JavaScript code examples.
This article demonstrates how to capture a Canvas animation as a video using the Media Streams API and MediaRecorder, providing step‑by‑step code examples, integration with ffmpeg‑wasm for audio, and discusses use cases such as online teaching and resource‑efficient playback.
