Inside Facebook

Every Facebook application developer faces a major architectural decision when starting a new app: whether to build canvas pages in FBML - Facebook’s subset of HTML with some elements removed and other proprietary elements added - or iframes. Over the course of the last year, many developers have chosen to build in FBML because new platform features have usually been released for FBML-based applications before iframe-based applications.

While there have always been advantages and disadvantages to each, Facebook itself has usually recommended FBML to developers, but has always ultimately left the question open.

However, tonight, Charlie Cheever, a lead engineer on the Facebook Platform, has written a lengthy essay on the differences and tradeoffs between FBML and iframes. His conclusion? “I think I’d use iframes.”

All developers interested in learning about the details of the differences between FBML and iframe Facebook application development should definitely read the entire essay. It’s a clear and articulate explanation of the way that each works. For those interested in the Cliff’s Notes version of Charlie’s post, here are the key points on “Why We’ve Been Recommending FBML Up Until Now and What’s Changed”:

1. Speed

• What’s Changed: Facebook Chat and XFBML. While Facebook Chat makes FBML canvas pages slower, XFBML can make IFrame canvas pages faster.  The big disadvantage for IFrame canvas pages in terms of speed was having to make an API call to Facebook before sending back content to the user’s browser.  XFBML lets you avoid that… We developed XFBML as part of Facebook Connect as a way to quickly get social content onto any webpage, and since IFrames are just webpages, XFBML can speed those up as well.

2. Convenience

• FBML is really nice when its important to batch your data access
• FBML is nice for Facebook-provided widgets and dialogs
• What’s Changed: XFBML gives you access to all this within Iframes

3. Looks

• What’s Changed: Now, there’s an easy way to get your IFrame to resize automatically

4. Preload FQL and the List of Friends for Free

• What’s Changed: Now, there is a way to do something similar in IFrames

Cheever then goes on to discuss some of the URL and authentication issues for which good solutions haven’t completely been found yet. Ultimately, he concludes,

• I think using IFrames for canvas pages is probably a better choice…  In particular, if you are doing a lot of AJAX in your application, it will be snappier in IFrames since the requests don’t need to go through Facebook proxy…
• That said, there are a number of things we’re likely to release in the future that will bring FBML and IFrames even closer to converging on a point of parity….
• In brief, if you use the new features we recently released, using IFrames for canvas pages is probably a little bit better choice than using FBML for canvas pages.

Developers should definitely check out the full article for details on the ways Facebook is planning on continuing to develop support for both IFrame and HTML-based applications in the future.

FBML Canvas Page (by Charlie Cheever)

IFrame Canvas Page (by Charlie Cheever)