The coding examples shown below can be scrolled, scanned and copied (CTL-A followed by CTL-C) in most browsers). Of course the JavaScript is on the left and the PHP is on the right. That is obvious - what may not be obvious is that all of the JavaScript code is executed only on the browser; where as the PHP code is executed only on the server. Now it is possible to have JavaScript execute on the server side but only a few Web servers, mostly from Netscape use it (though that is changing with ActionScript, a JavaScript clone from Macromedia, garnering new interest). Java, C++, PHP, Perl, and C# currently dominate Server side scripting. Likewise there are unsubstantiated rumors that PHP version 5, to premier in the Summer of 2004, will have some client side capabilities(it does, see our PHP commandline tip).

There are some striking similarities shared by the two scripts. First, both scripts share a common C programming language heritage and it shows in the comments, semi-colon delimiter, ++ and -- operators plus many other common syntax and statements. As well both languages are embedded into/within the HTML; neither is dependent soley on <EMBED> tagged functional calls likeActiveX, Flash SWF files, and Java applets. However,as previously noted, a key difference is that PHP code gets resolved up at the Web Server and then ships out pages of HTML (plus possibly JavaScript and/or XML or other Web code) to be executed at the client browser. In contrast, JavaScript code is executed locally by the browser in whatever device is being used.

This architecture presents advanatages and disadvantages to each language. For PHP, it is easy to interact with databases and other server-side apllications where as these are cut-off for most client side JavaScripts. But on the other hand PHP is at a disadvantage in this type of client application because it has to go up to the server everytime a new calculation is required. So as developers can see there are trade-offs with both systems.

Lets examine the code for each Web page. The JavaScript on the left is taken from directly from David Flanagan's JavaScript:The Definitive Guide which we recommend as the one of the top JavaScript references. The code uses JavaScript DOM capabilities to read and write the form's text fields.

The critical routine in the JavaScript code is calculate(). This code not only does the loan calculations but also a simple validity check to make sure reasonable. The JavaScript code is at the bottom of the page; but it could just as easily be at the top in its traditional position between the <title> tags. Note that <script> ... </script> tags. Note that the code is called in four places. First, it is called in the onchange(calculate()) event for each of the ifirst 3 inputs (Amount, interest, and periods). This means a ny change in one of those variables will recalulate the loan data. So then the Compute button and its onclick(calculate()) call is somewhat redundant. However, as you will see if you download and try the code, the calculations are very fast because the JavaScript does not have to send the data back to the server.

In contrast, the PHP code is a bit more complicated because it is divided into two parts. The first part writes the form and page; the second half validates the data inputs and does the loan calculations and then rewrites the page. In effect, loancalc.php has to goes to the server and back everytime the Compute button is pressed.

Now the two programs are identical in how they do the calculations and the results that they produce. But they differ in the data validations. It started in the JavaScript code where David has a check on reasonable results:

if (!isNaN(monthly) &&
  (monthly != Number.POSITIVE_INFINITY) &&
  (monthly != Number.NEGATIVE_INFINITY)) {
...//do the loan calulations and display the results in the form
}

There could have been much more elaborate validations-checking each variable as it was entered on the form during the onchange() event. But David only did a summary check to see if the monthly payment was reasonable. So our PHP routine had to do some validation.

But first a word again about the structure of the PHP code. First, it is located at the top of the coding. Second, the code is check for the state of the page with the following:

if(!IsSet($_POST['Submit']) || $_POST['Submit'] !="Compute"){
  ... setup the variable for initial, blank layout
} else do {
  ... do the validations and if okay then the loan calculations
} while();

The first if statement acts as a state check. If the Submit button has not been written, then the form is assumed to be empty and so the initialization of the form's variables is done. However, if the Submit button is initialized thn do the validations and then if all the input variables are good follow with the loan calculations.

The programming is a little more complicated but of even more concern is the response time. Because the PHP form must go back to the server evrytime a validation/computation is done; it takes about 2-5 times longer than the JavaScript code. So performance is part of the trade-off, especially when there are a lot of local calculations and validations on a web page. However, PHP has one advantage, it can generate JavaScript as well as HTML. So this PHP program could be setup to generate JavaScript validations (and we leave that as an exercise for readers to do). The disadvantage of such a setup is that now the Web developer must add JavaScript to the already long list of programming skills requied when using PHP.

Now to be fair, a comparison which had the data in the forms loaded from a database would tend to favor PHP since serverside database transactions are easy to do in PHP. The serverside database connections could be done in JavaScript but for most applications would use Java, C++ or C#.NET. In the case of PHP, the server side database connections could easily be done with PHP and MySQL or a whole host of popular databases such as DB2, Oracle or SQL Server. Now there are certainly other functionality trade-offs but those will be addressed in other tutorials.

In sum, PHP excels on the serverside but has to setup elaborate two-state processing if extensive client side validations and coding are required. JavaScript on the other hand easily handles the client side validations and other operations. Also because web browsers offer more uniform CSS and DOM support, it has become a much more viable web development platform. However, on the server side JavaScript has grudging support among popular Web application servers for server-side includes. As well JavaScript itself has mixed support for database transactions plus native database links; thus many developers utilize other tools and languages for server-side development. So gauge your use of PHP versus JavaScript on how intensively your web application needs client versus server functions.