PHPClasses 2.0 Beta, AJAX XMLHttpRequest x IFrame

By Manuel Lemos

manuellemos.net

<email contact>

Hello,

- PHPClasses 2.0 Beta

This month I have been working more intensively on the upcoming new services for premium subscribers. As I mentioned before these are additional services to be made available exclusively to subscribers that are willing to pay a small monthly fee.

Premium subscribers benefit from services that enhance the site usage experience and valuable resources that may benefit your PHP work. The other subscribers will continue to use the site the same way as before.

Several things have been planned since 2002 but only now they are effectively being implemented. Since I have already mentioned what is being planned in past newsletter posts, I am not going to mention them here again. If you are not aware, you may read more about it here:

phpclasses.org/blog/post/47-Planned ...

Since a few things are already implemented, it is neither too soon nor too late to put them to test. Therefore, the site is now starting a beta testing initiative that is called PHPClasses 2.0 Beta.

PHPClasses 2.0 designation does not really have to do with Web 2.0 buzzword of the moment. It is rather intended to be the first major overhaul of the site since it was started in 1999.

Users that are really interested to participate in the beta testing initiative, spending some time contributing with helpful feedback, should request to become beta testers by going to this page:

phpclasses.org/beta/

Note that not every user that requests to become beta tester will be approved. This initiative is mainly targeted to users that are considering to become premium subscribers when the paid services are made available. The beta testing initiative is not meant for users that are just curious about what is coming up and do not intend to provide any feedback.

Beta testers are not entitled to free premium subscriptions. However, some users may be compensated later if they make outstanding contributions to the site. That may be the case of beta testers that make good suggestions, although nothing is being promised now.

By the way, as may notice that the new site pages exhibit a slightly different visual aspect. These pages use a new theme template engine that will allow premium users to choose the presentation theme they enjoy the most.


- Initial progress

Currently there are not many new features completely implemented. A selected number of beta testers has already been able to experience navigating the site without part of the advertising that causes significant page loading delays.

Several new features will provide better navigation experience. That will be achieved in part by the use of AJAX to update parts of the site pages with minimal delays.

AJAX is not being used because it is the latest Web tech fashion. Its use will be moderate and it will only be applied where it makes sense and improves the site navigation.

One of the things that has been implemented and can be tried by anybody, even by non-beta testers, is the AJAX enhanced login page:

phpclasses.org/login.html/v/2

There is nothing in the new login page that you may have not seen elsewhere. It uses AJAX to submit the login form and only updates parts of the page to reflect the login progress and validation results. Once it succeeds, it redirects to the normal welcome page.

There is another thing that may interest all of you that would like to start using AJAX to enhance your own sites.

I have developed an Open Source component to submit forms and process server responses using AJAX. It is a plug-in class that is part of the forms generation and validation class. This is a class that I have been developing since before this site was started in 1999:

phpclasses.org/formsgeneration

It can be used to submit any kind of forms, including those with file upload inputs. The plug-in lets any application dynamically generate the response to the form submission by the means of actions that are executed on the browser side, like: updating parts of the page, wait for a moment, redirecting to a new page, etc.. To use this plug-in you do not need to know JavaScript.


- AJAX XMLHttpRequest versus IFrame

This AJAX plug-in that I developed does not use XMLHttpRequest objects. It uses an hidden IFrame instead. Some people consider that AJAX only refers to browser-server interaction done with XMLHttpRequest objects. That detail should not matter because IFrame can be used for the same purposes.

What I would like to share with you are the reasons why I have chosen IFrame over XMLHttpRequest objects.

Since Mozilla 1.0 release, there is a lot of excitement in the Web development community regarding the use of XMLHttpRequest objects to implement AJAX enhanced applications.

However, after some preliminary studies, I have reached the conclusion that using IFrame is much better than using XMLHttpRequest objects. Here is the summary of my reasons to choose IFrame:


* Browser compatibility

Not all browsers in use support XMLHttpRequest. Most new browsers versions already support it. Users will eventually upgrade, but it will take time. Still some users will not upgrade. Supporting those users will be an headache. IFrame is more widely supported among all browsers, even in older versions.


* Browser security constraints

Under Internet Explorer 6, XMLHttpRequest requires an ActiveX component. The latest Microsoft security patches disable ActiveX by default. XMLHttpRequest is not available under the default security level of installations that use that security patch. Thanks to Björn Schotte of ThinkPHP for bringing that to my attention in his blog:

blog.thinkphp.de/archives/43-AJAX-r ...


* Single JavaScript base code

Several browsers now support XMLHttpRequest but each one has a different way to create these objects and access them. This causes a maintenance headache because you need to generate browser specific JavaScript code. IFrame is an HTML tag consistently supported across all modern browsers. A single JavaScript base code works with all supported browsers.


* Response speed

Last November I attended to an AJAX conference session by Guilherme Blanco, an awarded author of the pAJAX framework published in the PHPClasses site last year.

phpclasses.org/pajax

In the conference, he presented a few benchmarks that roughly conclude that XMLHttpRequest can be faster for small requests but IFrame can be faster for larger requests.

The slides of conference are in Portuguese, but for those that are interested, session materials may be found here:

prophp.com.br/conisli.php

Despite the conclusions of the benchmarks, there is one detail that makes IFrame provide much faster interaction with the server.

From what I could gather, the response of a XMLHttpRequest, either in XML or in text, can only be accessed when the data is completely received by the browser.

As for IFrame, since it receives an HTML page, it may contain JavaScript blocks that may start executing right away even before the whole IFrame page response is loaded.

This means that the AJAX server response may be processed by the browser much earlier than with XMLHttpRequest.

Another detail is that an IFrame may load a page with JavaScript that instructs the browser to execute multiple actions, with eventual time delays between two consecutive actions.

This is very useful to provide progress feedback to the user during lengthy operations, using a single HTTP request.

To obtain a similar effect with XMLHttpRequest, you would need to keep polling the server with multiple HTTP requests. This is a much less efficient and slower way to make the browser interact with the server.


* File form upload

In my research I could not find a way to upload files with XMLHttpRequest. The problem is that for security reasons you cannot access the value of form file inputs to populate an XMLHttpRequest.

With IFrame there is no need to access the actual form file input values. You just use the IFrame name to set the target of the form with the file input that you want to upload. When the form is submitted the file is uploaded with all other fields of the form.


Well these are the conclusions of my preliminary studies about this matter. In consequence, the forms AJAX submit plug-in uses an hidden IFrame.

However, I assume that I may have missed other details that I have not considered. If my conclusions are not totally accurate, I would like to know about that.

Therefore, I encourage you to send your comments to this post in the blog comment forums. Please share your thoughts about these and other topics mentioned in this post.


Manuel Lemos