Stack Exchange
Stack Overflow
Questions
Tags
Users
About
Stack Overflow
Public
Questions
Tags
Users
About
Should I use
or
for loading a video?</a></h1> </div> <div class="grid fw-wrap pb8 mb16 bb bc-black-075"> <div class="grid--cell ws-nowrap mr16 mb8" title="2016-01-12 19:07:53Z"> <span class="fc-light mr2">Asked</span> <time itemprop="dateCreated" datetime="2012-09-23T02:24:24.673" class="fromnow">Sep 23 '12 at 02:24</time> </div> <div class="grid--cell ws-nowrap mr16 mb8"> <span class="fc-light mr2">Active</span> <time class="fromnow" title="2012-09-23T02:33:46.447" datetime="2012-09-23T02:33:46.447">Sep 23 '12 at 02:33</a> </div> <div class="grid--cell ws-nowrap mb8" title="Viewed 3,981 times"> <span class="fc-light mr2">Viewed</span> 3,981 times </div> </div> <div id="mainbar" role="main" aria-label="questions and answers"> <div id="question" class="question" data-questionid="12549252" data-ownerid="237681" data-score="2"> <div class="post-layout"> <div class="votecell post-layout--left"> <div class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200" data-post-id="12549252"> <button class="js-vote-up-btn grid--cell s-btn s-btn__unset c-pointer"><svg aria-hidden="true" class="m0 svg-icon iconArrowUpLg" width="36" height="36" viewBox="0 0 36 36"><path d="M2 26h32L18 10 2 26z"></path></svg></button> <div class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center" itemprop="upvoteCount" data-value="2">2</div> <button class="js-bookmark-btn s-btn s-btn__unset c-pointer py4"> <svg aria-hidden="true" class="svg-icon iconBookmark" width="18" height="18" viewBox="0 0 18 18"><path d="M6 1a2 2 0 00-2 2v14l5-4 5 4V3a2 2 0 00-2-2H6zm3.9 3.83h2.9l-2.35 1.7.9 2.77L9 7.59l-2.35 1.7.9-2.76-2.35-1.7h2.9L9 2.06l.9 2.77z"></path></svg> <div class="js-bookmark-count mt4" data-value="0">0</div> </button> </div> </div> <div class="postcell post-layout--right"> <div class="s-prose js-post-body" itemprop="text"><p>I load lots of Youtube videos in one page (up to 25). Should I use iframe for each video or show it just in <code><object></code>? As I understand, if I use iframe, my page will load much faster, because it will load my page first and it will not have to wait to load videos. Am I right?</p></div> <div class="mt24 mb12"> <div class="post-taglist grid gs4 gsy fd-column"> <div class="grid ps-relative"> <a href="../../questions/tagged/php" class="post-tag js-gps-track" title="show questions tagged 'php'" rel="tag">php</a> <a href="../../questions/tagged/object" class="post-tag js-gps-track" title="show questions tagged 'object'" rel="tag">object</a> <a href="../../questions/tagged/iframe" class="post-tag js-gps-track" title="show questions tagged 'iframe'" rel="tag">iframe</a> <a href="../../questions/tagged/youtube" class="post-tag js-gps-track" title="show questions tagged 'youtube'" rel="tag">youtube</a> </div> </div> </div> <div class="mb0"> <div class="mt16 grid gs8 gsy fw-wrap jc-end ai-start pt4 mb16"> <div class="grid--cell mr16 fl1 w96"></div> <div class="post-signature owner grid--cell"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Sep 23 '12 at 02:24">asked Sep 23 '12 at 02:24</time> <a href="../../users/237681/good-evening" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/237681.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="good_evening" /> </a> <div class="s-user-card--info"> <a href="../../users/237681/good-evening" class="s-user-card--link">good_evening</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">21,085</li> <li class="s-award-bling s-award-bling__gold" title="65 gold badges">65</li> <li class="s-award-bling s-award-bling__silver" title="193 silver badges">193</li> <li class="s-award-bling s-award-bling__bronze" title="298 bronze badges">298</li> </ul> </div> </div> </div> </div> </div> </div> <div class="post-layout--right js-post-comments-component"> <div id="comments-12549252" class="comments js-comments-container bt bc-black-075 mt12 " data-post-id="12549252" data-min-length="15"> <ul class="comments-list js-comments-list" data-remaining-comments-count="0" data-canpost="false" data-cansee="true" data-comments-unavailable="false" data-addlink-disabled="true"> <li id="comment-111284437" class="comment js-comment " data-comment-id="111284437" data-comment-owner-id="52277" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment111284437_12549252"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">Opposite question: https://stackoverflow.com/questions/924946/use-of-iframe-or-object-tag-to-embed-web-pages-in-another</span> – <a href="../../users/52277/michael-freidgeim" title="26,542 reputation" class="comment-user ">Michael Freidgeim</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/12549252/should-i-use-object-or-iframe-for-loading-a-video#comment111284437_12549252"><span title="2020-07-16T07:38:30.860 License: CC BY-SA 4.0" class="relativetime-clean">Jul 16 '20 at 07:38</span></a></span> </div> </div> </li> </ul> </div> </div> </div> </div> <div id="answers"> <a name="tab-top"></a> <div id="answers-header"> <div class="answers-subheader grid ai-center mb8"> <div class="grid--cell fl1"> <h2 class="mb0" data-answercount="9">2 Answers<span style="display:none;" itemprop="answerCount">2</span></h2> </div> </div> </div> <a name="12549287"></a> <div id="answer-12549287" class="answer accepted-answer" data-answerid="12549287" data-ownerid="159145" data-score="6" itemprop="acceptedAnswer" itemscope="" itemtype="https://schema.org/Answer"> <div class="post-layout"> <div class="votecell post-layout--left"> <div class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200" data-post-id="12549287"> <button class="js-vote-up-btn grid--cell s-btn s-btn__unset c-pointer"><svg aria-hidden="true" class="m0 svg-icon iconArrowUpLg" width="36" height="36" viewBox="0 0 36 36"><path d="M2 26h32L18 10 2 26z"></path></svg></button> <div class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center" itemprop="upvoteCount" data-value="6">6</div> <div class="js-accepted-answer-indicator grid--cell fc-green-500 py6 mtn8"><div class="ta-center"><svg aria-hidden="true" class="svg-icon iconCheckmarkLg" width="36" height="36" viewBox="0 0 36 36"><path d="m6 14 8 8L30 6v8L14 30l-8-8v-8z"></path></svg></div></div> </div> </div> <div class="postcell post-layout--right"> <div class="s-prose js-post-body" itemprop="text"><p>Your understanding is incorrect. Your "page" (that is, your HTML document itself) will load and render in the same amount of time. However using <code><iframes></code> means the browser has to load not just the same video files that it would with <code><object></code>, but also the HTML contained within each iframe.</p> <p>Note that YouTube instructs users to use <code><iframe></code> to embed a video because it allows YouTube to customize the HTML sent to the user: appropriate browsers will be given the HTML5 <code><video></code> treatment.</p> <p>So it's a trade-off: you can slightly decrease page load times with <code><object></code> or <code><video></code> at the cost of excluding non-Flash (or non-HTML5 browsers, respectively), or you can use <code><iframe></code> and be sure of compatibility with whatever browser your visitors might be using.</p></div> <div class="mb0"> <div class="mt16 grid gs8 gsy fw-wrap jc-end ai-start pt4 mb16"> <div class="grid--cell mr16 fl1 w96"></div> <div class="post-signature grid--cell"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="answered Sep 23 '12 at 02:33">answered Sep 23 '12 at 02:33</time> <a href="../../users/159145/dai" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/159145.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Dai" /> </a> <div class="s-user-card--info"> <a href="../../users/159145/dai" class="s-user-card--link">Dai</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">141,631</li> <li class="s-award-bling s-award-bling__gold" title="28 gold badges">28</li> <li class="s-award-bling s-award-bling__silver" title="261 silver badges">261</li> <li class="s-award-bling s-award-bling__bronze" title="374 bronze badges">374</li> </ul> </div> </div> </div> </div> </div> </div> <div class="post-layout--right js-post-comments-component"> <div id="comments-12549287" class="comments js-comments-container bt bc-black-075 mt12 " data-post-id="12549287" data-min-length="15"> <ul class="comments-list js-comments-list" data-remaining-comments-count="0" data-canpost="false" data-cansee="true" data-comments-unavailable="false" data-addlink-disabled="true"> <li id="comment-20762100" class="comment js-comment " data-comment-id="20762100" data-comment-owner-id="502038" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment20762100_12549287"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">Accessibility wise though, object tags (from my understanding) are much, much better to have. So that is another consideration as well.</span> – <a href="../../users/502038/joel-kinzel" title="969 reputation" class="comment-user ">Joel Kinzel</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/12549252/should-i-use-object-or-iframe-for-loading-a-video#comment20762100_12549287"><span title="2013-02-11T20:53:37.640 License: CC BY-SA 3.0" class="relativetime-clean">Feb 11 '13 at 20:53</span></a></span> </div> </div> </li> </ul> </div> </div> </div> </div> <a name="12549283"></a> <div id="answer-12549283" class="answer " data-answerid="12549283" data-ownerid="1241619" data-score="0" itemprop="suggestedAnswer" itemscope="" itemtype="https://schema.org/Answer"> <div class="post-layout"> <div class="votecell post-layout--left"> <div class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200" data-post-id="12549283"> <button class="js-vote-up-btn grid--cell s-btn s-btn__unset c-pointer"><svg aria-hidden="true" class="m0 svg-icon iconArrowUpLg" width="36" height="36" viewBox="0 0 36 36"><path d="M2 26h32L18 10 2 26z"></path></svg></button> <div class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center" itemprop="upvoteCount" data-value="0">0</div> </div> </div> <div class="postcell post-layout--right"> <div class="s-prose js-post-body" itemprop="text"><p>You should use <code><iframe></code> since <code><object></code> is deprecated. The first one supports both Flash and HTML5 video. The second one support only Flash. This is extremely useful for users who don't or can't use flash (all of iPad/iPhone users, some of Linux folks).</p> <p><a class="external-link" href="http://support.google.com/youtube/bin/answer.py?hl=en&answer=171780&expand=UseOldEmbedCode#oldcode" rel="nofollow">Google Help on this question</a></p></div> <div class="mb0"> <div class="mt16 grid gs8 gsy fw-wrap jc-end ai-start pt4 mb16"> <div class="grid--cell mr16 fl1 w96"></div> <div class="post-signature grid--cell"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="answered Sep 23 '12 at 02:32">answered Sep 23 '12 at 02:32</time> <a href="../../users/1241619/daniil-ryzhkov" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/1241619.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Daniil Ryzhkov" /> </a> <div class="s-user-card--info"> <a href="../../users/1241619/daniil-ryzhkov" class="s-user-card--link">Daniil Ryzhkov</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">7,416</li> <li class="s-award-bling s-award-bling__gold" title="2 gold badges">2</li> <li class="s-award-bling s-award-bling__silver" title="41 silver badges">41</li> <li class="s-award-bling s-award-bling__bronze" title="58 bronze badges">58</li> </ul> </div> </div> </div> </div> </div> </div> <div class="post-layout--right js-post-comments-component"> <div id="comments-12549283" class="comments js-comments-container bt bc-black-075 mt12 " data-post-id="12549283" data-min-length="15"> <ul class="comments-list js-comments-list" data-remaining-comments-count="0" data-canpost="false" data-cansee="true" data-comments-unavailable="false" data-addlink-disabled="true"> <li id="comment-16900740" class="comment js-comment " data-comment-id="16900740" data-comment-owner-id="" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment16900740_12549283"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">Object is deprecated? Source please!</span> – <a class="comment-user "></a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/12549252/should-i-use-object-or-iframe-for-loading-a-video#comment16900740_12549283"><span title="2012-09-23T02:55:12.077 License: CC BY-SA 3.0" class="relativetime-clean">Sep 23 '12 at 02:55</span></a></span> </div> </div> </li> <li id="comment-16900745" class="comment js-comment " data-comment-id="16900745" data-comment-owner-id="1241619" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment16900745_12549283"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">@pst, http://support.google.com/youtube/bin/answer.py?hl=en&answer=171780&expand=UseOldEmbedCode#oldcode I mean deprecated for use with YouTube.</span> – <a href="../../users/1241619/daniil-ryzhkov" title="7,416 reputation" class="comment-user ">Daniil Ryzhkov</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/12549252/should-i-use-object-or-iframe-for-loading-a-video#comment16900745_12549283"><span title="2012-09-23T02:56:24.723 License: CC BY-SA 3.0" class="relativetime-clean">Sep 23 '12 at 02:56</span></a></span> </div> </div> </li> <li id="comment-16900850" class="comment js-comment " data-comment-id="16900850" data-comment-owner-id="159145" data-comment-score="0"> <div class="js-comment-actions comment-actions"> <div class="comment-score js-comment-edit-hide"> </div> </div> <div class="comment-text js-comment-text-and-form"> <a name="comment16900850_12549283"></a> <div class="comment-body js-comment-edit-hide"> <span class="comment-copy">To be fair, `<object clsid="">` is also deprecated (not to be confused with the W3C-approved `<object type=""></object>`).</object></span> – <a href="../../users/159145/dai" title="141,631 reputation" class="comment-user ">Dai</a> <span class="comment-date" dir="ltr"><a class="comment-link" href="../../questions/12549252/should-i-use-object-or-iframe-for-loading-a-video#comment16900850_12549283"><span title="2012-09-23T03:17:20.420 License: CC BY-SA 3.0" class="relativetime-clean">Sep 23 '12 at 03:17</span></a></span> </div> </div> </li> </ul> </div> </div> </div> </div> </div> </div> <div id="sidebar" class="show-votes" role="complementary" aria-label="sidebar"> <div class="module sidebar-linked"> <h4 id="h-linked">Linked</h4> <div class="linked"> <div class="spacer"> <a title="Vote score (upvotes - downvotes)"><div class="answer-votes default">8</div></a> <a href="../../questions/13178646/object-vs-iframe-video-embeds" class="question-hyperlink">OBJECT vs IFRAME video embeds</a> </div> </div> </div> </div> </div> </div> <script src="../../static/js/stack-icons.js"></script> <script src="../../static/js/fromnow.js"></script> </body> </html>