Codecs vidéo
La plateforme Vonage exploite le protocole WebRTC et les codecs vidéo en temps réel pris en charge par WebRTC. En particulier, la plateforme Vonage prend en charge le VP8, VP9et H.264.
Les flux utilisent le codec VP8, qui est pris en charge par tous les clients, à moins que vous ne définissiez un codec préféré pour l'application à laquelle la session appartient (voir Définition du codec vidéo préféré pour une application.)
Dans le vaste écosystème d'appareils et de les navigateurs pris en charge il existe différents niveaux de soutien pour le VP8, VP9 et H.264 en temps réel.
Certains terminaux prennent en charge tous les codecs vidéo, tandis que d'autres n'en prennent qu'un seul en charge. Selon le type d'application que vous créez et les types de navigateurs et d'appareils que vos utilisateurs finaux utiliseront, votre choix de codec préféré changera.
Qu'est-ce qu'un codec vidéo ?
Un codec vidéo se compose de deux parties, un encodeur et un décodeur. Il permet d'encoder (compresser) les images vidéo numériques entrantes d'une webcam en un flux de données binaires pouvant être envoyées sur un réseau.
Il peut également ingérer un flux de données binaires et le décoder (décompresser) en un flux d'images vidéo brutes qui peuvent être affichées sur un écran.
Le mécanisme d'encodage et de décodage de la vidéo est la norme du codec et, pour les besoins de cette page, nous allons parler de deux normes populaires, VP8 et H.264.
VP8 vs H.264
Le codec vidéo en temps réel VP8 est un codec logiciel. Il peut fonctionner correctement à des débits binaires plus faibles et constitue un codec vidéo mature dans le contexte de WebRTC.
En tant que codec logiciel, il peut être instancié autant de fois que nécessaire par l'application dans les limites de la mémoire et du processeur. Le codec VP8 prend en charge le Vidéo évolutive ce qui signifie qu'il fonctionne bien dans les grandes sessions avec les navigateurs et les appareils pris en charge.
Le codec vidéo en temps réel H.264 est disponible sous forme matérielle et logicielle, en fonction de l'appareil.
Il s'agit d'un codec relativement nouveau dans le contexte de WebRTC, bien qu'il soit utilisé depuis longtemps pour la diffusion en continu de films et de clips vidéo sur l'internet.
La prise en charge des codecs matériels signifie que l'unité centrale de l'appareil n'a pas à travailler aussi dur pour traiter la vidéo, ce qui réduit la charge de l'unité centrale.
Le nombre d'instances matérielles dépend de l'appareil, iOS bénéficiant de la meilleure prise en charge.
Étant donné que H.264 est un nouveau codec pour WebRTC et que chaque appareil peut avoir une implémentation différente, la qualité peut varier.
En tant que tel, H.264 peut ne pas être aussi performant à des débits binaires plus faibles que VP8. H.264 n'est pas bien adapté aux sessions de grande envergure car il ne prend pas en charge la fonction Scalable Video.
VP9 vs VP8
Les VP9 Le codec en temps réel est un codec relativement nouveau. Il bénéficie d'un soutien croissant de la part des navigateurs et des fournisseurs de matériel. Malgré ce soutien croissant, il n'est pas encore aussi répandu que les autres codecs.
Le codec VP9, comme le VP8, fonctionne bien à des débits inférieurs à ceux du H.264. De plus, VP9 nécessite encore moins de bande passante que VP8 pour encoder la vidéo. Cependant, l'amélioration de la compression s'accompagne d'un compromis : l'encodage/décodage nécessite plus de CPU que le VP8.
Le codec VP9 prend en charge Codage vidéo évolutif en sessions acheminées. Pour plus d'informations, voir Codage vidéo évolutif VP9 pour les sessions acheminées.
Définition du codec vidéo préféré pour une application
Vous pouvez définir le codec vidéo préféré pour une application dans l'onglet Tableau de bord Vonage en sélectionnant Application, puis en naviguant vers Capacités vidéo, et enfin en accédant à la section Paramètres avancés. Les choix valides sont VP8, H264 ou VP9mais l'applicabilité peut varier en fonction du type de session. Par défaut, tous les projets sont préconfigurés avec VP8 comme codec vidéo préféré.
En sessions acheminées (sessions qui utilisent le routeur média), le routeur média OpenTok), l'éditeur négociera avec le routeur média OpenTok le codec à utiliser, en donnant la priorité au codec sélectionné par l'utilisateur lorsqu'il est pris en charge par le périphérique.
En sessions relayéesDans le cas de l'OpenTok Media Router, où les clients s'envoient des flux directement les uns aux autres, l'OpenTok Media Router n'est pas impliqué dans la négociation. Chaque paire éditeur-abonné tente de trouver un codec vidéo commun, en préférant le codec choisi par l'utilisateur lorsqu'il est pris en charge par les deux appareils.
À la suite de la négociation, le codec vidéo utilisé par la paire peut différer du codec préféré pour le projet.
Définition du codec vidéo préféré via le SDK
L'API Codecs vidéo préférés de l'éditeur vous permet de contrôler finement la manière dont les codecs vidéo sont prioritaires lors de la négociation de la session. les codecs vidéo sont prioritaires lors de la négociation de la session. Avec cette API, vous pouvez :
- Spécifier une liste de priorité personnalisée de codecs pour influencer la négociation.
- Déléguer la priorisation au SDK en mode automatique.
- Utilisez les valeurs par défaut des paramètres de votre projet si vous n'avez rien défini.
Remarque : Cette API ne limite pas les codecs qui peuvent être négociés. Même les
si vous établissez une liste de préférences, d'autres codecs peuvent encore être utilisés si nécessaire, mais
ils seront considérés comme moins prioritaires.
SDK Web
export type VideoCodec = 'vp8' | 'vp9' | 'h264';
export type PreferredVideoCodecs = 'automatic' | [VideoCodec, ...VideoCodec[]];
// Default (omitted)
OT.initPublisher('div', {});
// Automatic mode
OT.initPublisher('div', {
preferredVideoCodecs: 'automatic'
});
// Manual priority order
OT.initPublisher('div', {
preferredVideoCodecs: ['vp9', 'vp8']
});
// Invalid usage (empty list)
OT.initPublisher('div', {
preferredVideoCodecs: []
}, function (err) {
if (err) {
console.error(err.name); // 'OT_INVALID_PARAMETER'
console.error(err.message); // 'preferredVideoCodecs must be "automatic" or a non-empty array of valid codec strings'
}
});
SDK iOS
// Manual mode
OTVideoCodecPreference *pref = [OTVideoCodecPreference manualWithCodecs:@[
@(OTVideoCodecTypeVP9),
@(OTVideoCodecTypeH264),
@(OTVideoCodecTypeVP8)
]];
OTPublisherKitSettings *settings = [[OTPublisherKitSettings alloc] init];
settings.videoCodecPreference = pref;
// Automatic mode
OTVideoCodecPreference *pref = [OTVideoCodecPreference automatic];
OTPublisherKitSettings *settings = [[OTPublisherKitSettings alloc] init];
settings.videoCodecPreference = pref;
SDK Android
// Manual mode
PublisherKit.PreferredVideoCodecs preferredVideoCodecs =
PublisherKit.PreferredVideoCodecs.manual(
new ArrayList<PublisherKit.PreferredVideoCodecs.Codec>(
List.of(PublisherKit.PreferredVideoCodecs.Codec.VP9,
PublisherKit.PreferredVideoCodecs.Codec.H264)));
Publisher publisher = new Publisher.Builder(MainActivity.this)
.preferredVideoCodecs(preferredVideoCodecs)
.build();
// Automatic mode
PublisherKit.PreferredVideoCodecs preferredVideoCodecs =
PublisherKit.PreferredVideoCodecs.automatic();
Publisher publisher = new Publisher.Builder(MainActivity.this)
.preferredVideoCodecs(preferredVideoCodecs)
.build();
SDK Windows
// Manual mode
var pref = new PreferredVideoCodecs(new List<PreferredVideoCodecs.Codec> {
PreferredVideoCodecs.Codec.VP9,
PreferredVideoCodecs.Codec.H264,
PreferredVideoCodecs.Codec.VP8
});
builder.PreferredVideoCodecs = pref;
// Automatic mode
builder.PreferredVideoCodecs = PreferredVideoCodecs.Automatic();
// Default (uses project settings)
builder.PreferredVideoCodecs = null;
// Invalid (throws)
try {
builder.PreferredVideoCodecs = new PreferredVideoCodecs(new List<PreferredVideoCodecs.Codec>());
} catch (ArgumentException ex) {
// "Must specify at least one codec"
}
SDK Linux et macOS
// Manual mode: specify an ordered priority list of codecs
otc_publisher_settings* publisher_settings = otc_publisher_settings_new();
otc_video_codec_type codecs[] = {
OTC_VIDEO_CODEC_VP9,
OTC_VIDEO_CODEC_H264,
OTC_VIDEO_CODEC_VP8
};
otc_status status = otc_publisher_settings_set_preferred_video_codecs(
publisher_settings,
codecs,
sizeof(codecs) / sizeof(codecs[0])
);
otc_publisher_callbacks publisher_callbacks = {0};
struct otc_publisher* publisher =
otc_publisher_new_with_settings(&publisher_callbacks, publisher_settings);
// Done with settings object
otc_publisher_settings_delete(publisher_settings);
// Automatic mode: let the SDK choose priority automatically
otc_publisher_settings* publisher_settings = otc_publisher_settings_new();
otc_status status = otc_publisher_settings_set_preferred_video_codecs_automatic(
publisher_settings
);
otc_publisher_callbacks publisher_callbacks = {0};
struct otc_publisher* publisher =
otc_publisher_new_with_settings(&publisher_callbacks, publisher_settings);
// Done with settings object
otc_publisher_settings_delete(publisher_settings);
SDK React Native
Mode manuel : spécifier une liste de codecs classés par ordre de priorité :
class App extends Component {
constructor(props) {
super(props);
this.publisherProperties = {
preferredVideoCodecs: ['vp9', 'vp8']
};
this.publisherEventHandlers = {
streamCreated: event => {
console.log('Publisher stream created!', event);
},
streamDestroyed: event => {
console.log('Publisher stream destroyed!', event);
}
};
}
render() {
return (
<OTSession applicationId="application-id" sessionId="your-session-id" token="your-session-token">
<OTPublisher
properties={this.publisherProperties}
eventHandlers={this.publisherEventHandlers}
style={{ height: 100, width: 100 }}
/>
</OTSession>
);
}
}
Mode automatique : permet au SDK de choisir automatiquement la priorité :
class App extends Component {
constructor(props) {
super(props);
this.publisherProperties = {
preferredVideoCodecs: 'automatic'
};
this.publisherEventHandlers = {
streamCreated: event => {
console.log('Publisher stream created!', event);
},
streamDestroyed: event => {
console.log('Publisher stream destroyed!', event);
}
};
}
render() {
return (
<OTSession applicationId="application-id" sessionId="your-session-id" token="your-session-token">
<OTPublisher
properties={this.publisherProperties}
eventHandlers={this.publisherEventHandlers}
style={{ height: 100, width: 100 }}
/>
</OTSession>
);
}
}
Il est important de comprendre que le codec vidéo final peut différer du codec préféré en fonction du résultat de la phase de négociation.
Couverture des codecs
Les tableaux suivants répertorient les capacités des codecs vidéo en temps réel des terminaux pris en charge.
Notez que presque tous les appareils prennent en charge le décodeur H.264 pour les films diffusés en continu, mais les tableaux ci-dessous se concentrent sur les capacités des codecs vidéo en temps réel (encodage et décodage) des appareils.
| Navigateurs de bureau | VP8 | H.264 | VP9 |
|---|---|---|---|
| Chrome | Oui | Oui | Oui |
| Firefox | Oui | Oui | Oui |
| Safari | Oui¹ | Oui | Oui². |
| Bord | Oui | Oui | Oui |
¹ VP8 est disponible dans Safari 12.1+, qui est livré avec macOS 10.14.4 et est également disponible pour macOS 10.13.6 et 10.12.6.
² VP9 est disponible dans Safari 15+ et n'est pris en charge que sur les appareils dotés d'un décodage matériel (comme le M3 Macbook Pro).
| Navigateurs mobiles | VP8 | H.264 | VP9 |
|---|---|---|---|
| Chrome sur Android | Oui | Partiel¹ | Oui |
| Firefox sur Android | Oui | Oui | Oui |
| Safari mobile | Oui². | Oui | Oui³ |
| Chrome/Firefox sur iOS | - | - | Oui⁴ |
| WebView Android | Oui | Partiel⁵ | Oui |
| WebView sur iOS | Oui⁶ | Oui | Oui⁷ |
¹ Chrome on Android ne prend en charge la norme H.264 que sur les appareils équipés des puces Qualcomm et Exynos et nécessitant Chrome 65 ou une version plus récente.
² VP8 est disponible dans Safari sur iOS 12.2+.
VP9 est disponible dans Safari 15+ et n'est pris en charge que sur les appareils dotés d'un décodage matériel (comme l'iPhone 15 Pro).
⁴ VP9 est disponible dans iOS 17+ et n'est pris en charge que sur les appareils dotés d'un décodage matériel (comme l'iPhone 15 Pro).
⁵ WebView Android ne prend en charge la norme H.264 que sur les appareils contenant les puces Qualcomm et Exynos et nécessitant Chrome 65 ou une version plus récente.
⁶ VP8 est disponible sur iOS 12.2+.
⁷ VP9 est disponible sur iOS 15+ et n'est pris en charge que sur les appareils avec décodage matériel (comme l'iPhone 15 Pro).
| SDK natifs | VP8 | H.264 | VP9 ** |
|---|---|---|---|
| SDK iOS (2.12+) | Oui | Oui | Oui |
| SDK Android (2.13+) | Oui | Oui pour la plupart des appareils * | Oui |
| SDK Windows (2.13+) | Oui | Oui | Oui |
| SDK Linux | Oui | Non | Oui |
| SDK macOS | Oui | Oui | Oui |
* Le H.264 matériel est pris en charge sur les appareils contenant les puces Qualcomm et Exynos, ainsi qu'un sous-ensemble de puces HiSilicon et MediaTek. Le repli vers le H.264 logiciel est pris en charge sur Android M ou une version ultérieure.
** La prise en charge de VP9 nécessite la version 2.27+ des SDK clients natifs de Vonage Video (pour Android, iOS, macOS, Linux et Windows).
Note: La prise en charge du H264 nécessite la version 2.29+ du SDK du client vidéo de Vonage pour macOS.
Prise en charge des fonctions de codec sur l'ensemble des points d'extrémité
| Codec/Endpoint | Chrome | Android Chrome | Firefox | Safari | Bord | WebView Android | WebView sur iOS | SDK iOS | SDK Android | SDK Windows | SDK macOS | SDK Linux |
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| VP8 | ||||||||||||
| H.264 | 75% (*) | 75% (*) | 99% (*) | |||||||||
| VP9 | (**) | (**) | ||||||||||
| Vidéo évolutive VP8 | ||||||||||||
| Vidéo évolutive H.264 | ||||||||||||
| Vidéo évolutive VP9 | (***) | (***) | (***) | (***) | (***) | (***) | (***) | (***) | (***) | (***) | (***) | (***) |
* Pourcentage d'appareils Android prenant en charge le codec
** VP9 est pris en charge par Safari 15+ (desktop et iOS) et WebView sur iOS 15+, mais uniquement sur les appareils compatibles avec l'encodage matériel, comme le Macbook M3 et l'iPhone 15 Pro.
*** VP9 est pris en charge par Firefox, mais la vidéo évolutive ne l'est pas. La prise en charge de la vidéo évolutive matérielle et logicielle n'est pas assurée sur tous les appareils.
Détection de la prise en charge des codecs par les clients
Tous les appareils Android ne prennent pas en charge le codec H.264, et les anciennes versions de Safari ne prennent pas en charge VP8. OpenTok.js et le Client SDK Android incluent des méthodes permettant de vérifier les codecs pris en charge disponibles pour le client.
Détection des codecs pris en charge dans le navigateur
Les OT.getSupportedCodecs() renvoie une promesse qui est résolue (en cas de succès) avec un objet ayant deux propriétés : videoDecodersun tableau de codecs vidéo pris en charge pour le décodage, et videoEncodersun tableau de codecs vidéo pris en charge pour l'encodage.
L'exemple suivant permet d'obtenir la liste des codecs pris en charge pour le codage et le décodage des flux vidéo :
(async () => {
try {
const supportedCodecs = await OT.getSupportedCodecs();
if (supportedCodecs.videoEncoders.indexOf('H264') < 0 && supportedCodecs.videoDecoders.indexOf('H264') < 0) {
// They do not support encoding or decoding H264 let's tell them to use a different browser
}
} catch(err) {
console.log(err);
}
})();
Détection des codecs pris en charge à l'aide du SDK Android
Les MediaUtils.SupportedCodecs.getSupportedCodecs(context) renvoie un MediaUtils.SupportedCodecs qui possède deux propriétés : videoDecoders, un Liste de tableaux des codecs vidéo pris en charge (définis par le MediaUtils.VideoCodecTypclasse e) pour le décodage, et videoEncoders, un Liste de tableaux des codecs vidéo pris en charge (définis par le MediaUtils.VideoCodecType ) pour l'encodage.
L'exemple suivant permet d'obtenir la liste des codecs pris en charge pour le codage et le décodage des flux vidéo :
MediaUtils.SupportedCodecs supportedCodecs =
MediaUtils.SupportedCodecs.getSupportedCodecs(context);
if (supportedCodecs.videoEncoders.indexOf(MediaUtils.VideoCodecType.VIDEO_CODEC_H264) < 0
&& supportedCodecs.videoDecoders.indexOf(MediaUtils.VideoCodecType.VIDEO_CODEC_H264) < 0)
{
// The device does not support encoding or decoding H264.
}
Points à prendre en compte lors du choix de votre codec vidéo en temps réel préféré
Interopérabilité
Le principal conflit d'interopérabilité concerne les appareils Android, les anciennes versions de Safari et Linux. VP8 fonctionne sur tous les appareils Android, à la fois sur Android Chrome et sur le SDK Android, mais la prise en charge du codec H.264 sur Android n'est pas omniprésente. Les anciennes versions de Safari ne prennent pas en charge le codec VP8. Le SDK Linux ne prend pas en charge le codec H.264.
Taille de la session
H.264, VP8 et VP9 Le codec H.264 peut fonctionner de manière satisfaisante pour les points d'extrémité dans les petites sessions (par exemple, un à trois participants). Cependant, comme le H.264 ne prend pas en charge la vidéo évolutive, nous ne recommandons pas l'utilisation de ce codec pour les sessions de grande envergure.
Qualité de la vidéo
Étant donné que la même implémentation du codec vidéo VP8 est utilisée sur presque tous les points d'extrémité, la qualité est à peu près la même. Le VP8 fonctionne bien à des débits binaires plus faibles.
En outre, la fonction Scalable Video est disponible avec VP8. Scalable Video améliore considérablement la qualité vidéo lors de sessions plus importantes.
La qualité de H.264 varie d'un appareil à l'autre, car la mise en œuvre de H.264 varie.
En outre, nous avons constaté des différences de qualité en fonction de la version du système d'exploitation utilisé sur l'appareil. La qualité de H.264 à des débits inférieurs n'est généralement pas aussi bonne que celle de VP8.
La norme H.264 fonctionne bien sur les appareils iOS car ils prennent bien en charge l'accélération matérielle de la norme H.264. Cela réduit la charge du processeur et améliore l'autonomie de la batterie.
VP9 offre une meilleure qualité vidéo que le VP8 lorsqu'il fonctionne au même débit binaire. L'amélioration de la qualité peut cependant nécessiter une charge CPU plus importante que pour le VP8.
Exemples de scénarios
Voici les codecs vidéo recommandés dans quelques exemples de scénarios :
- Pour les sessions de 2 à 3 participants où l'interopérabilité avec les anciennes versions de Safari est essentielle, utilisez le codec vidéo H.264.
- Dans les sessions de 2 à 3 participants où seuls des appareils iOS sont impliqués, utilisez le codec vidéo H.264 pour tirer parti de l'accélération matérielle.
- Les webinaires et les sessions en salle de classe doivent utiliser le codec VP8 pour bénéficier de la fonction Scalable Video.
- Dans les sessions où la prise en charge de tous les appareils Android est essentielle, utilisez le codec VP8.