Learn Performance - Video

This demo uses the preload attribute to hint the browser to not preload the video. It also uses the poster attribute to show a highly compressed image until the user initiates playback.

Note that the poster image is considered an LCP candidate.

<video preload="none" poster="../poster.jpg?v=1671553386107" controls width="1920" height="1080">
    <source
    type="video/mp4"
    src="../video-1920.mp4?v=1671553389855"
  />
  <source
    type="video/webm"
    src="../video-1920.webm?v=1671553389855"
  />
</video>