Whilst many websites consist of static pages (pages that are composed of unchanging text, like those of a simple text document) it is increasingly becoming the case that websites are wholly or partially dynamic (page content or appearance changes without the actual code in the web page or script being physically changed). This is the case when page content is sourced from a database or server-based file system, such as with a search engine, news or ecommerce site. Each time new criteria are submitted the page is refreshed and the layout and content changed.

Historically the web server has handled the dynamic elements, whilst the browser has served the role of a simple client - interpreting the HTML and CSS code and displaying the content that the server has sent according to prescribed standards. With the introduction of JavaScript in 1995 and, to a lesser extent VBScript, together with JavaScript augmented web browsers, it was possible for the web page to be modified without a request being made to the web server. With the aid of CSS (Cascading Style Sheets), which allowed pixel-perfect positioning and precise document formatting, these client side scripting languages had complete control over the structure of the document. Initially interaction was limited to the checking of form values and image roll-overs, together with the ability to write entire sections of HTML code using JavaScript at page load time using document.write. When I started work at supanet in 2000 the entire portal of over 5,000 pages used a significant amount of JavaScript code. This allowed parts of the page common to the whole portal, such as the header, menu and footer to be written by several included JavaScript files. Not only did this allow non-client-side programmers to make central changes to the menu and header but the caching of this file meant than subsequent visits to any supanet page were much quicker due to the actual "hard-code" page being smaller than a conventional one.

As Netscape ne Mozilla ne Firefox adopted the full DOM (document object model) standards it became possible to alter and reflow the content of the page after it had loaded. What of it I may hear you ask - why not just let the server do this? Consider that you have submitted a search and are viewing a list of 200 records, split up into 10 "pages". You have ordered them from A-Z and you realise that Z-A would have been a better sort as you wished to look at users beginning with A. In order to carry out the sort you need to resubmit the form with the sort order reversed. This involves submitting the exact same criteria but with a different order to the server. The server will then invariably query a database, possibly searching millions of records, which may or not be a timely operation, then sort either in the DBMS or via the programming language, recreate the entire table structure and page layout and send the code back to your PC, where the web browser assembles it back into a new page that very closely resembles the previous one.

Now contrast this behaviour with your favourite PC-based email client. Assuming that you are using POP3 your client will have retrieved the entire headers and body of every message. However what you will see is invariably a list of all the messages in your inbox. You will have the opportunity to sort these simply by clicking on the column headings, which will toggle the sort order - no having to go back to your email server. Say that you want to view the content of one message you will simply click on the subject will magically appear in another pane. Wouldn't it be great if your web page could handle records like that? Well it can!

There are two ways to handle this:

1. Design the server side programme to server a web page that contains all the content that you are likely to need to view but display it in a fashion that is in accordance with modern GUI (graphical user interface) design. This can be achieved:- a) by using JavaScript to store the information in data structures, such as arrays, which it will use to manipulate the DOM (Document Object Model) by creating and removing nodes. b) by writing the records out as pure HTML but using JavaScript to manipulate this HTML in the same way as described above.
2. Create an interface to the server from the current web page that fetches content on demand but does not require a complete page relload. Again there are two mainstream accepted methods of achieving this. a) Use the