{"id":621,"date":"2022-05-18T20:09:12","date_gmt":"2022-05-18T20:09:12","guid":{"rendered":"https:\/\/bandittracker.com\/?p=621"},"modified":"2022-05-22T19:50:41","modified_gmt":"2022-05-22T19:50:41","slug":"does-embedding-video-slow-websites","status":"publish","type":"post","link":"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/","title":{"rendered":"Does Embedding Video Slow Down Your Website?"},"content":{"rendered":"\n<p>One of my websites has several articles with embedded YouTube videos.<\/p>\n\n\n\n<p>I wanted to find out if embedding a video slows down the website. So, I ran a series of before-and-after tests to measure the impact on one of my websites.<\/p>\n\n\n\n<p>Here is my verdict.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_63 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<p class=\"ez-toc-title\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6603a549951ff\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6603a549951ff\" checked aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/#Does_Embedding_Video_Slow_Down_Your_Website\" title=\"Does Embedding Video Slow Down Your Website?\">Does Embedding Video Slow Down Your Website?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/#Our_Embedded_Video_Performance_Tests\" title=\"Our Embedded Video Performance Tests\">Our Embedded Video Performance Tests<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/#How_Does_Embedding_A_Video_Impact_Your_Website\" title=\"How Does Embedding A Video Impact Your Website?\">How Does Embedding A Video Impact Your Website?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/#How_to_Check_If_Embedded_Videos_Are_Slowing_Your_Website\" title=\"How to Check If Embedded Videos Are Slowing Your Website\">How to Check If Embedded Videos Are Slowing Your Website<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/#What_To_Do_If_Embedded_Videos_Are_Slowing_Your_Website\" title=\"What To Do If Embedded Videos Are Slowing Your Website\">What To Do If Embedded Videos Are Slowing Your Website<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Does_Embedding_Video_Slow_Down_Your_Website\"><\/span>Does Embedding Video Slow Down Your Website?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><strong>When you embed a video on your website from a hosted platform like YouTube or Wistia, visitors to the website should not experience a noticeable slowness.<\/strong><\/p>\n\n\n\n<p><strong>Performance issues are most likely to occur if the website is on entry-level hosting with low resources.<\/strong><\/p>\n\n\n\n<p>The most common method of embedding videos is to use YouTube as the platform. In a series of tests run for this article, we found that adding a YouTube video to a web page produced a negligible decrease in perceived speed.<\/p>\n\n\n\n<p>There\u2019s no doubt that a significant number of extra scripts and calls are added to the website by the embedded video. However, these scripts are run asynchronously.<\/p>\n\n\n\n<p>In other words, your visitors can interact with the site while scripts are loading in the background. This is how you can have embedded videos without any perceived slowness.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Our_Embedded_Video_Performance_Tests\"><\/span>Our Embedded Video Performance Tests<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>I tested performance using the GTMetrix tool on the same 800-word web page under three conditions:<\/p>\n\n\n\n<ul><li>No images, no embedded video<\/li><li>No images, one embedded video from YouTube<\/li><li>Six images, one embedded video from YouTube<\/li><\/ul>\n\n\n\n<p>Here are the results:<\/p>\n\n\n\n<figure class=\"wp-block-table is-style-stripes\"><table><tbody><tr><td><strong>Images<\/strong><\/td><td><strong>Video<\/strong><\/td><td><strong>Time To Interactive (ms)<\/strong><\/td><td><strong>Fully Loaded Time (ms)<\/strong><\/td><\/tr><tr><td>None<\/td><td>None<\/td><td>346<\/td><td>581<\/td><\/tr><tr><td>None<\/td><td>1<\/td><td>407<\/td><td>3,200<\/td><\/tr><tr><td>6<\/td><td>1<\/td><td>933<\/td><td>3,800<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">What do \u201cTime To Interactive\u201d And \u201cFully Loaded Time\u201d mean?<\/h3>\n\n\n\n<p>Here\u2019s a quick explanation of the measurements which are in milliseconds.<\/p>\n\n\n\n<p>\u201cTime To Interactive\u201d basically means how long it takes for the web visitor to be able to scroll around the page.<\/p>\n\n\n\n<p>It\u2019s more of a \u201cquality\u201d metric. If it\u2019s above two seconds, we should be worried that the user will perceive that the website is slow.<\/p>\n\n\n\n<p>\u201cFully Loaded Time\u201d is when all the resources have been loaded by the page. That includes every image, all scripts, and any external calls to other sites.<\/p>\n\n\n\n<p>You should focus on the \u201cTime To Interactive\u201d metric instead of the \u201cFully Loaded Time\u201d.<\/p>\n\n\n\n<p>It hardly matters if there\u2019s a script still loading while the visitor is absorbing the contents of the first half of the page. As long as this metric is below 2000 ms, then your page will not be perceived as slow.<\/p>\n\n\n\n<p>With that explained, let\u2019s take a closer look at the numbers from this test.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Test results<\/h3>\n\n\n\n<p>Don\u2019t be alarmed by the significant jump in the \u201cFully Loaded Time\u201d. Surely a figure of three seconds is a problem? Well, not if the visitor doesn\u2019t notice that scripts are loading in the background.<\/p>\n\n\n\n<p>Focus instead of the \u201cTime To Interactive\u201d metric. As you can see, simply embedding the video had a negligible impact on this measure.<\/p>\n\n\n\n<p>On the other hand, adding a further six images slowed the page a little. The \u201cTime To Interactive\u201d measure more than doubled.<\/p>\n\n\n\n<p>However, it was still below a full second. This will not be perceived as a slow page.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_Does_Embedding_A_Video_Impact_Your_Website\"><\/span>How Does Embedding A Video Impact Your Website?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Despite not having to worry too much about the increase in the Fully Loaded Time, you should still understand why it increases significantly when you embed a video from YouTube.<\/p>\n\n\n\n<p>Here is a side-by-side comparison of the resources loaded on a web page that doesn\u2019t have an embedded video versus one that does.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"811\" height=\"494\" src=\"https:\/\/bandittracker.com\/wp-content\/uploads\/2022\/05\/side_by_side_embedded_video_resources.jpg\" alt=\"\" class=\"wp-image-622\" srcset=\"https:\/\/bandittracker.com\/wp-content\/uploads\/2022\/05\/side_by_side_embedded_video_resources.jpg 811w, https:\/\/bandittracker.com\/wp-content\/uploads\/2022\/05\/side_by_side_embedded_video_resources-300x183.jpg 300w, https:\/\/bandittracker.com\/wp-content\/uploads\/2022\/05\/side_by_side_embedded_video_resources-768x468.jpg 768w\" sizes=\"(max-width: 811px) 100vw, 811px\" \/><\/figure><\/div>\n\n\n\n<p>Where I\u2019ve blanked out a domain name, that\u2019s simply the website itself. I\u2019m showing all the external websites involved.<\/p>\n\n\n\n<p>You may need to expand this to see it clearly, but I\u2019ll explain the main points.<\/p>\n\n\n\n<p>The page without a video makes 12 requests. Adding a video results in an extra 22 requests. I\u2019m not actually showing all the requests on the right side.<\/p>\n\n\n\n<p>But you can see that many are to YouTube.com and some are to other Google sites.<\/p>\n\n\n\n<p>I don\u2019t have advertising on the website I used for testing. However, embedding YouTube means that extra scripts for Google\u2019s advertising get called.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_Check_If_Embedded_Videos_Are_Slowing_Your_Website\"><\/span>How to Check If Embedded Videos Are Slowing Your Website<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>If you have recently embedded videos and are seeing a marked slowdown on your website, then the first step is to check that the videos are actually the culprit.<\/p>\n\n\n\n<p>Something else may have hit the performance.<\/p>\n\n\n\n<p>I use the free <a rel=\"noreferrer noopener\" href=\"http:\/\/www.gtmetrix.com\" target=\"_blank\">GTMetrix<\/a> site to check performance. There are alternatives, including Google\u2019s lighthouse feature (GTMetrix also uses this).<\/p>\n\n\n\n<p>You can take these steps to assess the impact:<\/p>\n\n\n\n<ol type=\"1\"><li>Run the page with embedded video through the speed test a few times (get a few measures)<\/li><li>Remove the video and publish (this is temporary)<\/li><li>Run the page without embedded video through the speed test a few times<\/li><\/ol>\n\n\n\n<p>If you don\u2019t see any massive difference, then it\u2019s probably not the video. Go put it back!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"What_To_Do_If_Embedded_Videos_Are_Slowing_Your_Website\"><\/span>What To Do If Embedded Videos Are Slowing Your Website<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>If your site is on cheap entry-level hosting, then you may have been allocated very sparse resources by your hosting provider.<\/p>\n\n\n\n<p>One potential solution is to upgrade your hosting to a more powerful package.<\/p>\n\n\n\n<p>If that\u2019s not an option, then you should take a closer look at how you are embedding the video.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Alternatives to YouTube<\/h3>\n\n\n\n<p>YouTube has the great advantage of being free to use and easy to set up. But as we showed in a previous section, embedding a <a href=\"http:\/\/www.youtube.com\">YouTube<\/a> video will pull extra advertising scripts into your site.<\/p>\n\n\n\n<p>And unless you own the YouTube channel, you\u2019re getting no monetary benefit from those scripts. <\/p>\n\n\n\n<p><a href=\"http:\/\/www.wistia.com\" target=\"_blank\" rel=\"noreferrer noopener\">Wistia<\/a> is an alternative video hosting service that offers a more lightweight option for embedding your videos. <\/p>\n\n\n\n<p>Wistia isn\u2019t free, but you may find that the costs are worth the faster loading speeds.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>One of my websites has several articles with embedded YouTube videos. I wanted to find out if embedding a video slows down the website. So, I ran a series of before-and-after tests to measure the impact on one of my websites. Here is my verdict. Does Embedding Video Slow Down Your Website? When you embed &#8230; <a title=\"Does Embedding Video Slow Down Your Website?\" class=\"read-more\" href=\"https:\/\/bandittracker.com\/does-embedding-video-slow-websites\/\" aria-label=\"More on Does Embedding Video Slow Down Your Website?\">Read more<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[21],"tags":[],"_links":{"self":[{"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/posts\/621"}],"collection":[{"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/comments?post=621"}],"version-history":[{"count":2,"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/posts\/621\/revisions"}],"predecessor-version":[{"id":624,"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/posts\/621\/revisions\/624"}],"wp:attachment":[{"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/media?parent=621"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/categories?post=621"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bandittracker.com\/wp-json\/wp\/v2\/tags?post=621"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}