土田 拓也

テクノロジやビジネス、デザイン、ライフスタイルについて思惟するシステムエンジニア

  • About
  • Blog
    • Technology
    • Business
    • Design
    • Lifestyle
  • Contact
  • Github
  • LinkedIn
  • RSS
  • Twitter
© 2023 Takuya Tsuchida

動画を高速再生するブックマークレットを実装する

2022年1月23日

テレ東 BIZ や Prime Video などの動画を高速再生するブックマークレットを実装する方法を記事にまとめてみました。テレ東 BIZ は公式で2倍速まで対応していますが、3倍速や4倍速もできるようなブックマークレットにしています。

JavaScript で開発する

ブラウザーに付属する Developer Tools のコンソールなどで試しながら開発していきました。今回は2倍速・3倍速・4倍速に対応するようにしています。なお、複数の video 要素が含まれることもあるので、すべての video 要素を一律の再生速度に設定します。

let rates = [2, 3, 4];
let videos = document.querySelectorAll("video");
let currentRate = 1;
videos.forEach(video => currentRate = video.playbackRate);
let nextRate = rates.find(rate => currentRate < rate) || 1;
videos.forEach(video => video.playbackRate = nextRate);

ブックマークレットに変換する

JavaScript で開発したコードをブックマークレットとして動作するように変換します。

javascript:(function(){let rates=[2,3,4];let videos=document.querySelectorAll("video");let currentRate=1;videos.forEach(video=>currentRate=video.playbackRate);let nextRate=rates.find(rate=>currentRate<rate)||1;videos.forEach(video=>video.playbackRate=nextRate);})();

こちらのブックマークレット Video FF をブックマークバーにドラッグ&ドロップして追加します。その後、動画を再生するページで好みの速度になるまでクリックしてください。


本稿では、動画を高速再生するブックマークレットを実装する方法を説明しました。画面上にユーザーインターフェイスを追加するなど改造の余地もあるので興味のある人は挑戦してみてください。

カテゴリ:テクノロジ タグ:JavaScript, ブックマークレット