# Multi-Codec Playback on Web

**URL:** https://community.bitmovin.com/t/multi-codec-playback-on-web/976
**Category:** Knowledge
**Tags:** code-example, bitmovin-player, codec
**Created:** [July 5, 2022, 4:05pm UTC](https://community.bitmovin.com/t/multi-codec-playback-on-web/976 "2022-07-05T16:05:51Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![seven](https://avatars.discourse-cdn.com/v4/letter/s/3d9bf3/32.png) [@seven](https://community.bitmovin.com/u/seven)
#### Post date: [July 5, 2022, 4:05pm UTC](https://community.bitmovin.com/t/multi-codec-playback-on-web/976/1 "2022-07-05T16:05:51Z")

</div>

# Why this Post

Customers are increasingly looking to include more codecs in the same manifest. This is allows them to

- efficiently supports a wider range of playback devices i.e if a device can decode a higher efficiency codecs more savings in bandwidth, load time and ultimately money.
- YET support older devices by failing back to h264 ensuring an uninterrupted experience

# Enabling Efficient Playback

We achieve this leveraging the [`videoCodecPriority`](https://bitmovin.com/docs/player/api-reference/web/web-sdk-api-reference-v8#/player/web/8/docs/interfaces/core_config.playbackconfig.html#videocodecpriority) configuration. Bitmovin then does the heavy lifting to check `Browser`-`Codec`-`Manifest` compatibility.

Excerpt from Bitmovin Documentation on this property:

> Specifies the priority of video codecs for this source. If more than one video codec is available this order will be respected while finding a codec which is supported by the current browser. If there is a codec which is not in this priority list, it will be tried only if none of this list are available / supported.

## How To Specify Codec Priority

In this example `Player Config` we tell Bitmovin to check compatibility in that order of

1. HEVC-based Dolby Vision
2. AV1
3. h265/Hevc
4. vp9
5. Lastly default to h264

```auto
var config = {
  key: "YOUR-BITMOVIN-KEY-HERE",
  ...,
  playback: {
    autoplay: true,
    muted: true,
    videoCodecPriority: ['dvhe', 'dvh1', 'av01', 'hevc', 'hev', 'hvc', 'vp9', 'avc']
  },
  ...
}

```

# FAQ

Q: Where can I learn more about Multi-Codec?

```
https://bitmovin.com/multi-codec-world-2020/ is the place

```

Q: How do Multi-Codec Manifests Look Like

```auto
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<MPD id="8c0e6a7b-4b08-4a08-a936-c4fc3f33cfba" profiles="urn:mpeg:dash:profile:full:2011" type="static" mediaPresentationDuration="P0Y0M0DT0H3M17.667S" minBufferTime="P0Y0M0DT0H0M2.000S" xmlns="urn:mpeg:dash:schema:mpd:2011" xmlns:ns2="http://www.w3.org/1999/xlink">
    <Period id="05b3ab12-50da-4ce7-a88c-c7d41bbf9cc7">
        <AdaptationSet segmentAlignment="true" mimeType="video/mp4">
            <SegmentTemplate media="$RepresentationID$/segment_$Number$.m4s" initialization="$RepresentationID$/init.mp4" duration="120000" startNumber="0" timescale="30000"/>
            <Representation id="video/fmp4/h265" bandwidth="3000000" width="3840" height="2160" frameRate="30" codecs="hvc1.1.6.L150.90"/>
        </AdaptationSet>
        <AdaptationSet segmentAlignment="true" mimeType="video/mp4">
            <SegmentTemplate media="$RepresentationID$/segment_$Number$.m4s" initialization="$RepresentationID$/init.mp4" duration="120000" startNumber="0" timescale="30000"/>
            <Representation id="video/fmp4/av1" bandwidth="2000000" width="3840" height="2160" frameRate="30" codecs="av01.0.12M.08"/>
        </AdaptationSet>
        <AdaptationSet segmentAlignment="true" mimeType="video/webm">
            <Representation id="a6fdb949-d231-4ab1-a490-39c58681668a" bandwidth="4000000" width="3840" height="2160" frameRate="30" codecs="vp9">
                <SegmentTemplate media="video/webm/vp9/segment_$Number$.chk" initialization="video/webm/vp9/init.hdr" duration="120000" startNumber="0" timescale="30000"/>
            </Representation>
        </AdaptationSet>
        <AdaptationSet segmentAlignment="true" mimeType="video/mp4">
            <SegmentTemplate media="$RepresentationID$/segment_$Number$.m4s" initialization="$RepresentationID$/init.mp4" duration="120000" startNumber="0" timescale="30000"/>
            <Representation id="video/fmp4/h264" bandwidth="6000000" width="3840" height="2160" frameRate="30" codecs="avc1.4D4033"/>
        </AdaptationSet>
    </Period>
</MPD>

```

```
Above manifest has 4 different codecs. Notice 4 video `AdaptationSets`; each in a different Codec. i.e `codecs="hvc1.1.6.L150.90"`, `codecs="av01.0.12M.08"` and so on.

```

Q: How can I create a Multi-Codec Manifest?

```
A dedicated example @ https://github.com/bitmovin/bitmovin-api-sdk-examples#multi-codec-encoding

```