<p>YouTube videos (along with all modern video implementations on the web) uses the <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video">HTML5 video element</a>. This new media tag implements the <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement">HTMLMediaElement API</a>, which gives a plenty of media-related methods common to audio and video.</p>
<p>The standard YouTube player just allow us to increase video speed up to 2x, but, if you want to increase it even more? Well, there&#39;s a solution for that: just set the playback rate to whatever number you want!</p>
<p>In order to do that, you need to select the <code>&lt;video&gt;</code> element in the page and change its playback rate to the desired speed:</p>
<pre><code class="highlited-code-wrapper langjs"><div class="highlited-code" data-language="js">document.getElementsByTagName('video')[0].playbackRate = 2.5;</div>
</code></pre><p>It&#39;s a good solution, but not a practical one. Gracefully, there&#39;s a better way to make use of this functionality without having to open the console of your browser.</p>
<h2>JavaScript bookmarklet</h2>
<figure>
<img src="https://dev-to-uploads.s3.amazonaws.com/i/hjvcu6sqxp24u5emozsb.png" alt="Adding the bookmarklet on Firefox" />
  <figcaption>
    Adding the bookmarklet on Firefox
  </figcaption>
</figure>

<p>If you want to have this script always at hand, the best way is to put it inside a JavaScript <a href="https://en.wikipedia.org/wiki/Bookmarklet">bookmarklet</a>. Just create a new bookmark in you favorite browser and add the code below:</p>
<pre><code class="highlited-code-wrapper langjs"><div class="highlited-code" data-language="js">javascript:(function() {
  const rate = prompt('Set the new playback rate', 2.5);
  if (rate != null) {
    const video = document.getElementsByTagName('video')[0];
    video.playbackRate = parseFloat(rate);
  }
})();</div>
</code></pre><p>And here is an screenshot of the bookmarklet working:</p>
<figure>
<img src="https://dev-to-uploads.s3.amazonaws.com/i/erxbc4xcxdk7v0gun8z1.png" alt="Video speed bookmarklet working" />
  <figcaption>
    Changing the speed of an (awesome) <a href="https://www.youtube.com/watch?v=G4MvFT8TGII">YouTube video</a>
  </figcaption>
</figure>

<p>Feel free to contribute with this code in <a href="https://gist.github.com/DouglasdeMoura/052456a93f93d47982ccb5eefc602eb1" target="_blank">my public gist</a>.</p>


Douglas Moura

Douglas Moura

#youtube

Increase YouTube video playback rate up to 2x