Question

93

Alternative to iframe

rated 0 times [ 94] [ 1] / answers: 1 / hits: 30923 / 13 Years ago, wed, january 11, 2012, 12:00:00

So I've been looking around and am a bit lost on this topic. People have said that there's alternatives to iframes, but I don't see any that fit the bill for what I'm trying to do. I essentially created a small game that uses videos and plays particular ones based on corret button input from the keyboard.

All of that is in a seperate html file, and I want to display it on a different html file to be in an iframe like state on a different webpage. But I can't seem to figure out the best approach to this.

The iframe is just too slow, the game itself runs fine, but when I put it in an iframe it lags like crazy half the time, or stuff doesn't render because it's going so slowly.

Any ideas of where to start?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

isaac

Add To Favorites

Follow

Total Points: 645

Total Questions: 109

Total Answers: 96

Location: Cayman Islands

Member since Fri, Mar 4, 2022

2 Years ago

answered 13 Years ago yaquelina · Accepted Answer

There is one alternative to <iframe> and that's the <object> tag. It can display content from different sources as well. The pro is it being conform to the xhtml-standards and encouraged to use but there's not such a broad / usable support in older browsers (you have to mess with it to get it right in IE). It's used as followed:

<object data=page.html width=400 height=300 type=text/html>

    Alternative Content

</object>

That being the direct answer to you question I don't think it will give you any speed advantage. Already for the reason that the <iframe>-element is much more used and so more tested and cared for than <object>.

I for myself never saw an <iframe> being the cause for a slowdown, but that still might be possible. If that is an option, you should definitely try what ocanal said before in the comments: Let your script work on an wrapper container-div instead of the body-element and so embed it directly on the mainpage.

For the browser it shouldn't be much more than some overhead from handling a second document, so you could guess that it's just that little more to make your pc run slow. So it might be a good idea to optimize the code in general:

Look if you can find the bottleneck causing the slowdown. Possible causes could be
- altering the DOM a lot - which is always slow
- acting a lot on things not even visible on screen
- getting attributes from objects. For every additional period you use it means more work for your cpu:
```
// instead of using this over and over again

house.roof.window.handle.open();

house.roof.window.handle.close();



// save it to a var and use that instead

var handle = house.roof.window.handle;

handle.open();

handle.close();
```

Updating the game in short equal intervals by window.setTimeout() may also be too fast and waste cpu power unnecessarily (or too slow and won't look fine then, but never really right) - so you can use the new window.requestAnimationFrame. The vendor-prefixed variants are implemented in the current versions of all important browsers and it's easy to provide a fallback to the old method.

As a last thought: Maybe it even helps in some meta-magical way to include the script file itself on the mainpage and not in the embeded document