1

I am writing a post on HTML. Afcorse the post will have Codes in it. So for showing results in the post, I am taking help of JSFiddle, by embedding results of the code.

JSFiddle gives two methods for embedding results:

Script

<script async src="//jsfiddle.net/o7usdL0a/embed/result/"></script>

IFrame

<iframe width="100%" height="300" src="//jsfiddle.net/o7usdL0a/embedded/result/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>

My question is which method should be recommended for embedding results? (Script/IFrame)? Why?

Does any of the above method affect my site performance?

Is there any other alternative method/plugin which will be more fast and better than the above two methods?

  • Welcome to WPSE. You may need to edit your question to be more specific. What is the context of adding these? That may make a big difference on what will work best. – butlerblog Dec 1 '18 at 18:12
  • 1
    @butlerblog I edited my question as per the requirements... – nitasot Dec 2 '18 at 6:34
  • Any updates @butlerblog sir? – nitasot Dec 3 '18 at 16:07
0

The recommended method for embedding iframes is using the <iframe> tag. It makes for better syntax and also allows you to control the iframe much better.

For example, you are able to remove an iframe's border, control scrolling options, etc.

<iframe src="//jsfiddle.net/o7usdL0a/embed/result/" style="width: 100%; height: 300px"
scrolling="no" marginwidth="0" marginheight="0" frameborder="0">
</iframe>

The <script async> and the <iframe> methods are both the same when it comes to site performance as they are both asynchronous. If you use the tag it will load asynchronously by default, so no need to worry about blocking code.

  • Is there any other alternative method/plugin which will be more fast and better than the above two methods? – nitasot Dec 2 '18 at 13:20
  • You could load content via JQuery after the page fires the onload event by using Window.onload. That will ensure the content within the iframe doesn't load before the page fully loads. However, that might cause some artifacts because sometimes the onload function doesn't fire until all JS scripts are done executing. So if you have ads on your site, it might delay it. – Null TX Dec 2 '18 at 22:09
  • How to do that? Can I please have a code for it...? – nitasot Dec 3 '18 at 12:58
  • Any updates sir...? – nitasot Dec 6 '18 at 9:22
  • You could do something like this: stackoverflow.com/questions/7177080/… – Null TX Dec 8 '18 at 2:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.