2012-09-07 3 views
21

の細かさを設定しますここでは、timeupdateイベントが非常に一貫してトリガーしないということです。例えば、上記にconsole.logは返さ: 26.14031982421875は、私はHTML5のオーディオを使用して単純なループ機能を作成し、以下のように非常に原始的なソリューションを持ってしようとしているHTML5オーディオイベント「timeupdate」

26.229642868041992

26.13462257385254

26.21796226501465

...など。 (あなたはそのアイデアを一定時間ずらす)

明らかに、タイミングが重要なアプリケーション(音楽アプリケーション)では、これはうまくいきません。だから私にとって明らかな解決策は、timeupdateイベントがトリガーされる粒度を増やすことです。私はAPIドキュメントを見つけることはできませんでしたが、これを行う方法があるかどうかを知りたいです。

+0

も参照してください。http://stackoverflow.com/questions/24827929/get-frame-numbers-in-html5-video – rogerdpack

+0

もちろん動作します。その位置でスクラバーを更新するだけです。 –

答えて

27

申し訳ありませんが、それが動作する方法です。 html5 specsから:250ミリ秒に

ごとに15、またはいつでも少なくとも、多くの場合、いずれか早い方のMediaControllerのメディア・コントローラ位置の変更、ユーザーエージェントは、のMediaControllerでtimeupdateという名前のシンプルなイベントを発出するタスクをキューイングしなければいけません。また

イベントは、このように(実行に250ミリ秒以上の時間がかかるしていないイベントハンドラを想定)4Hzのよりも66Hz程度よりも早いか遅いか解雇されるものではありません。利用者エージェントは、システム負荷とその都度イベントを処理する平均コストに基づいてイベントの頻度を変えることが推奨されているため、ユーザーエージェントがビデオのデコード中に快適に処理できるよりも頻繁にUI更新が行われることはありません。

この仕様を読んだ場合、timeupdateイベントは「ベストエフォート」のイベントのようなものです。パフォーマンスにあまり影響を及ぼさない限り、常に可能です。

到着時間を平滑化するために、一部のイベントを捨てることができますが、逆のことはできません。

+1

私は現在の時刻を記録しました。間隔はいつか500ミリ秒を超えています。この間隔は、パフォーマンスの低いデバイスの方が多いですか? – Foreever

+0

多くの人が何らかの理由で250msを好むと思われます。 – rogerdpack

33

は、ビデオのcurrentTimeプロパティをはるかに頻繁に読み取ることに注意してください。時間が本当に重要で、少しでも不確実性がある場合は、代わりにこれを試すことができます。

しかし、タグ自身のtimeupdateイベントを使用するよりも、あまりエレガントではありません。この場合

setInterval(function() { 
    console.log(audio.currentTime); // will get you a lot more updates. 
}, 30); 

、あなたはnullオーディオ要素をINGの前にそれをクリアしていることを確認し、間隔を自分で管理する必要があります。しかしの可能性があります。

私はこのアプローチをビデオ要素で使用していますが、ここでも適用する必要があります。

+0

これがパフォーマンスに悪影響を与えるかどうか疑問です。 – Foreever

+5

このコードは、ユーザーが制御するコンテンツレイヤと連動してビデオを再生/一時停止するコードバスプロジェクト内で使用します。その場合、パフォーマンスに関する問題はありませんでした。しかし、それは事実です、あなたは今、もう数ミリ秒ごとに行うべきことがあります。 setIntervalの代わりに、別のイベントが発生するたびに(ユーザーのやりとりのように) '.currentTime'を読むこともできます。または、ビデオの位置を気にする場合は「安全なマージン」を計算できますが、1分のマークの「周り」のみ - タイムアウトを59秒に設定し、59秒後にはより厳しい間隔で開始します。 – amenthes

+0

短いオーディオクリップの場合、このメソッドはほとんど目に見えません – August

関連する問題