Giter VIP home page Giter VIP logo

streams-mediastreamtrack's Introduction

Streams-MediaStreamTrack API Specification

This is the repository for stream-mediastreamtrack, an experimental API for generating Streams out of a MediaStreamTrack.

You're welcome to contribute! Let's make the Web rock our socks off!

Introduction

Streams are designed to provide real time streams of data with powerful semantics (e.g. built-in backpressure and queuing) to allow users to build higher-level abstractions.

MediaStreamTracks are opaque handles to Real-Time media being transported in the browser. This media is produced or consumed via Sources and Sinks offered by the platform (see the following diagram); however, if a given functionality is not readily, users's options vary.

MST

The capabilities for user-defined audio processing are quite developed thanks to the WebAudio bridge and its ScriptProcessorNode that essentially enables what this Spec is looking for.

For video, however, unsupported source/sink functionality forces users to resort to contortions such as reflexion on intermediate HTML elements (e.g. <canvas>, see the Workarounds Section) or offline processing (e.g. using MediaRecorder). These approaches, however, lose the timing information, introduce friction in the interoperability between elements and need unnecessary processing steps.

This situation is made only more evident with the arrival of powerful programmable environments such as WebAssembly where users will naturally expect to be able to manipulate Real-Time media.

This API reconciles these two existing ways to access Media on the browser, enhancing platform ergonomics and orthogonality while only attempting to define the minimum amount of new data types (VideoFrame).

Use cases

Use cases that depend explicitly on timing are enabled, e.g.:

  • Measuring the amount of video frames produced; calculating the source frame rate.
  • Calculating inter-frame measures, e.g. motion flow, presence/absence, stabilization,
  • Adding subtitles to video/audio.
  • Manipulating depth data streams.

Whereas use cases that do not depend explicitly on timing are not enabled but are enhanced:

  • Producing per-frame analysis and transformations and the endless array of digital image processing algorithms, e.g. edge enhancement or chrome keying.
  • Adjusting the presentation timestamp of the media to speed up or slow down video, hence creating a timelapse or slow-motion effect.

Possible future use cases ?

Making a MediaStreamTrack both a ReadableStream and a WritableStream (i.e. a TransformStream) would allow for even more sophisticated use cases where users could 'plug' custom elements in MediaStreamTrack-based pipelines, e.g. WebAssembly operations between WebCam capture and Recording, etc.

Current Related Efforts and Workarounds

The most usual hack to access video data is to cast a given MediaStreamTrack onto a <video> element and this in turn onto a <canvas> that is subsequently read back -- <video> elements provide no drawn event so it's up to the user to blit from <video> to <canvas> on a timely basis (see e.g. this article). Moreover, usually reading from <canvas> implies a costly read back from GPU and potential pixel conversions needed.

Chrome Pepper API introduced and supports both MediaStreamVideoTrack and MediaStreamAudioTrack addressing a similar situation as the one described.

As mentioned before, WebAudio ScriptProcessorNode (or its successor) enables similar use cases for audio.

Examples and demos

http://rawgit.com/yellowdoge/streams-mediastreamtrack/master/index.html#examples

Notes on bikeshedding ๐Ÿšด

To compile, run:

curl https://api.csswg.org/bikeshed/ -F [email protected] -F force=1 > index.html

if the produced file has a strange size (i.e. zero), then something went terribly wrong; run instead

curl https://api.csswg.org/bikeshed/ -F [email protected] -F output=err

and try to figure out why bikeshed did not like the .bs :'(

streams-mediastreamtrack's People

Contributors

yellowdoge avatar

Stargazers

 avatar

Watchers

James Cloos avatar  avatar

Forkers

guest271314

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.