Like an Image, a Video component is used for media layout. This component is
supercharged with lots of goodies to turn a regular video in a full blown viewing experience.
Video media basics
The source url you pass into
Video will be used to download and play the video file. While it is
downloading the metadata, you may show a thumbnail image by using the
Video multiple sources
Not all browsers support the same video encoding types. If you have multiple video file sources, you can pass
them as a list to
Video in the order you want the HTML video tag to use as fallbacks.
Native video attributes
Video supports the native HTML video attributes such as
muted, and more.
Simply pass these through as props on the
Video components can show a control bar to users in order to allow them access to certain features
such as play/pause, timestamps, mute, and fullscreen. Pass in the
controls prop to make them appear.
Video with children
Video component can show components in the
chilren prop on top of the html video element, while under the controls.
The children of
Video are not same as the children of the html
video element; they're "outside" the html
Video is robust enough to handle any updates, such as changing the source, volume, or speed.