Including HTML fragments in a page - methods?

Question

heya,

This is an extension of an earlier questions I asked, here:

http://stackoverflow.com/questions/1519198/django-parse-xml-output-as-html-fragments-for-iframe

Basically, we're looking at integrating various HTML fragments into a page. We have an small web app generating little fragments for different results/gadgets, at various URLs. This is not necessairly on the same domain as the main page.

I was wondering what's the best way of including these into the main page? We also need the ability to skin the HTML fragments using CSS from the main page.

My initial thought was iFrames, however, I'm thinking the performance of this might not be great, and there's restrictions on CSS/JS manipulation of the included fragments.

Are SSI a better idea? Or should we use php includes? or JS? Any other suggestions? The two main considerations are performance of the main page, and the ability to style/manipulate the included fragments.

Cheers, Victor

Answer 1

This sounds similar to what Facebook Platform applications do. One kind simply uses IFRAMEs, the other takes output from a backend and transforms it -- <fb:whatever> elements are expanded, JavaScript executed, and things like buttons are skinned. You could look at them for an example.

Using IFRAMEs would probably make things complicated. By default you cannot modify styles inside them from the outer frames, but you could probably use something like Google Closure's net.IframeIo to work around that.

I would try loading widgets using cross-domain scripting. Then you can add the widget's content to the page, however you wish, such as inserting it into the DOM.

Answer 2

iFrames should not be a problem performance-wise - It won't make a difference whether it's the browser doing the querying our your server. You may get design problems though. SSI and PHP are more or less the same, but they both have the same problem: If the source page is down, rendering of the whole page is delayed.

The best thing performance-wise would be a cached PHP solution that reads the snippet, and is thus less vulnerable towards outages.

Funnily enough, I have written a PHP-based tool for exactly this purpose, and the company I wrote it for has agreed on publishing it as Open Source. It will be at least another four weeks, though, until I will get around to packaging it and setting up the documentation. Should that be of any interest to you despite the timeframne let me know and I will keep you updated.