title: $(window).on("load") fires before page loaded
body: <p>I use <strong>youtube iframe</strong> in my page, in order to speed up my site, I used <code>$(window).on("load")</code> to append the iframe after all is load, something like this:</p>
  
  <pre><code>$(window).on('load', function(){
      appendVideoAfterLoaded()
  });
  function appendVideoAfterLoaded(){
          html = '&lt;div class="outside-video js-video"&gt;&lt;iframe src="https://www.youtube.com/embed/UPhM_nd8wk4?enablejsapi=1&amp;rel=0&amp;loop=1&amp;playlist=UPhM_nd8wk4" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen id="youtube-player"&gt;&lt;/iframe&gt;&lt;/div&gt;';
          $('.js-bg').append(html);
          previewVideo = '&lt;img src="'+assets+'img/top/thumbnail_youtube.png" alt="GreenProp PV"&gt;&lt;p class="btn-play"&gt;&lt;/p&gt;';
          $('.js-open-popup').append(previewVideo);
      }
  </code></pre>
  
  <p>But the frame still loads before the page loaded and that affects google page speed inside score. Any solution? I use <strong>jquery 1.12.4</strong>, thanks</p>