Comet Programming: the Hidden IFrame Technique - Page 2 | WebReference

Comet Programming: the Hidden IFrame Technique - Page 2


[prev]

Comet Programming: the Hidden IFrame Technique [con't]


The updateStock() function has been altered to return the remaining CD inventory. The loop in the main script body exits once the number falls to zero. Rather than print the number, the IFrames version echoes JavaScript code to call our updateCount() function in the main page, passing in the CD $count. Again, flush() is used to make sure that the string is not held in the buffer:



HTML Markup

Without an XMLHttpRequest object, we need to submit the form's contents the old-fashioned way, using a Submit button. The frmCdSales form's action is set to the same file so that submitting the form will not unload the page. Equally important in this regard, is that the target must be set to the name of the hidden IFrame because it's the one that executes the scripts. The method is set to GET so that the txtQty textfield will be sent in the Request query string, as before. Its name has been changed to num, to match the property name that the PHP script is expecting.

There are any number of ways to stop the IFrame from displaying. Our solution is to set its height property to 0. Here is all of the HTML markup:



Hidden IFrame Gotchas

Although this technique is as straightforward and non-technical a way to implement Comet streaming in a Web page as you're likely to find, there are some caveats that you should be aware of.

IFrames were never meant to serve as a control for handling streaming. As such, this approach has been criticized by some as being a bit of a "hack". While it is true that there are better alternatives emerging, it can still be a suitable solution in smaller-scale applications. One reason that today's example is not a great candidate for large websites is that PHP does not scale well in terms of concurrent connections. PHP scripts are run in a separate instance for each client request, making for a potentially resource intensive implementation. For high volume utilization, languages like Python and Java Servlets are better choices, as they are designed to handle hundreds or thousands of simultaneous connections.

Another problem is that IFrames are not terribly fast-loading elements, to say the least. As the following chart indicates, IFrames just might be the slowest-loading element there is!

Element Download Times Chart

There is a JavaScript issue in that IFrame's parent's onload doesn't fire until IFrame and all of its components are downloaded. In streaming Comet, that could be never! One possible workaround is to set the IFrame's src in JavaScript:



IFrames share the connection pool with the parent; that greatly reduces the number of other data transactions you can perform on the page. Internet Explorer 7 has a per-server connection limit of 2, whereas in IE 8 the number has been increased to 6.

Comet Streaming Technologies

There are many tools available to help you perform Comet streaming. Here is a sampling of them taken from the ajaxpatterns.org site:

  • APE: Ajax Push Engine (APE) is a complete packaged solution, designed to push real-time data in a lightweight, highly scalable and modular way, only using JavaScript for the client side. Their server supports patterns such as XHR long-polling (cross browser), forever frame and many more.
  • LivePage: Included with Nevow, a Python-based Web application framework.
  • Jotspot Live: A live, multi-user, wiki environment which uses HTTP Streaming to update message content.
  • Realtime on Rails: A real-time chat application that uses Service Streaming on Firefox and Periodic Refresh on other browsers.
  • Lightstreamer: A commercial "Push Engine" for performing large-scale HTTP Streaming.
  • Pushlets: A Java servlet library based on HTTP Streaming, and supports either Page or Service Streaming.
  • CogStream: Another commercial HTTP streaming solution. The Web Server runs in WinTel and Linux environments.
  • Caplin Liberator: A free version of a commercial Comet server from Caplin Systems. Liberator can handle many thousands of concurrent users with high update rate and low message latency. Liberator is a standalone server that runs on Linux.
  • Kaazing Enterprise Comet: Provides the industry's most productive and advanced environment for creating real-time Web applications that extend SOA's event and message delivery to the browser, allowing browsers to participate in the server-side message bus. All applications developed with Enterprise Comet are deployed to standard Java EE containers with no browser plugins.
  • RMDS2Web Server: Migratory Data Systems RMDS2Web Server is currently the industry's most scalable real-time Web streaming solution able to serve 500,000 concurrent users with low latency from $2,000 hardware.

Additional References

Here's the source for the PHP file that we worked on today.


Running the Demo

I used the Abyss Web Server for testing, but you can use any server that supports PHP.

To view the IFrames Streaming demo, launch your server and enter the URL to the CometHiddenIFrame.php page in the address bar; it's "http://localhost/caching/IFrames/CometHiddenIFrame.php" in my browser. You should see the number of CDs gradually decrement in steps of 1 to 3 as imaginary shoppers snatch them up. Entering a number in the Quantity textbox and clicking the Purchase button should update the number immediately.


That concludes our look at Comet and the Hidden IFrame technique. It's an easy way to add Comet streaming to small-scale Web apps.


Rob Gravelle combined his love of programming and music to become a software guru and accomplished guitar player. He created systems that are used by Canada Border Services, CSIS and other Intelligence-related organizations. As a software consultant, Rob has developed Web applications for many businesses and recently created a MooTools version of PHPFreechat for ViziMetrics. Musically, Rob recently embarked on a solo music career, after playing with Ivory Knight since 2000. That band was rated as one Canada's top bands by Brave Words magazine (issue #92) and released two CDs. Rob's latest, entitled KNIGHTFALL, was a collaboration between himself, the former Ivory Knight vocalist, and legendary guitarist/producer, Jeff Waters of Annihilator fame. Rob is available for short-term software projects and recording session work. to inquire, but note that, due to the volume of emails received, he cannot respond to every email. Potential jobs and praise receive highest priority!

Original: April 3, 2009


[prev]