LL-HLS Video Player推奨オプション

Classic/VPC環境で利用できます。

Live Station LL-HLS環境で安定した低遅延再生を実装するための Video Player Enhancementの推奨オプションを説明します。

1. VPE V2 React SDK使用推奨

LL-HLSの再生時は、VPE V2 React SDK環境の使用をお勧めします。開発者ガイドは、次のガイドをご参照ください。

VPE2.0開発者ガイドのご紹介

2. lowLatencyModeの有効化

Player Optionで lowLatencyModeを trueに設定します。この設定は LL-HLS再生のために優先適用すべき設定です。

<VpePlayer
hls={Hls}
accessKey={"..."}
options={{
  playlist: [
    {
      file: "https://.../playlist.m3u8",
    },
  ],
  autostart: true,
  lowLatencyMode: true,
}}
/>

3. hlsConfig追加設定

lowLatencyMode: true設定だけで希望するレベルの遅延時間や再生の安定性が確保されない場合、以下のように hlsConfigを追加して調整できます。

<VpePlayer
hls={Hls}
hlsConfig={{
  liveSyncDuration: 3,
  maxLiveSyncPlaybackRate: 1.2,
}}
options={{
  lowLatencyMode: true,
  ...
}}
/>

主な設定値は、次の通りです。

liveSyncDuration

ライブエッジ基準の目標遅延時間(秒)を設定します。
LL-HLS遅延時間に最も直接影響を与える値です。
小さい値を設定するほどライブエッジに近い状態で再生できますが、サーバでまだ用意されていない PARTをリクエストする可能性が高くなります。そのため、リバッファリングまたは再生の不安定のリスクが高まることがあります。

参考

安定性を優先する場合、サーバの PART-HOLD-BACKレベルを考慮して調整することをお勧めします。

maxLiveSyncPlaybackRate

ライブエッジとの差が開いた場合、プレイヤーが追いつくために使用できる最大再生速度です。
例の1.2設定は最大1.2再生速度まで許可し、ライブエッジに戻す設定です。

従って、lowLatencyModeを優先適用した後、実際の再生環境に応じて liveSyncDurationと maxLiveSyncPlaybackRate値を調整しながらテストすることをお勧めします。

4. プレイヤー基準の遅延時間測定

プレイヤー内部では、現在の再生位置とライブエッジの差を利用して遅延時間を測定できます。

const delay =
video.seekable.end(video.seekable.length - 1) -
video.currentTime;

timeupdateイベントごとに上記の値を計算すると、現在のプレイヤーがライブエッジで何秒後に再生されているか確認できます。VPEデモの useLiveDelay()も同じ方式で測定しており、設定した liveSyncDurationが実際の再生過程でどの程度維持されているか確認用として活用できます。
ただし、当該値はプレイヤーが認識するライブエッジに比べての遅延時間であり、エンコーダ→パッケージャ→ CDNまでの送信区間で発生する遅延時間は含まれていません。
まず、lowLatencyMode: trueを適用して確認した後、追加遅延時間の短縮が必要な場合に hlsConfig値を調整しながらテストします。