AJAX Whiteboard

[attachment=17397]
A Few Words on AJAX
AJAX is a complex phenomenon that means different things to different people. Computer users
appreciate that their favorite websites are now friendlier and feel more responsive. Web
developers learn new skills that empower them to create sleek web applications with little effort.
Indeed, everything sounds good about AJAX!
At its roots, AJAX is a mix of technologies that lets you get rid of the evil page reload, which
represents the dead time when navigating from one page to another. Eliminating page reloads is
just one step away from enabling more complex features into websites, such as real-time data
validation, drag and drop, and other tasks that weren't traditionally associated with web
applications. Although the AJAX ingredients are mature (the XMLHttpRequest object, which is the
heart of AJAX, was created by Microsoft in 1999), their new role in the new wave of web trends is
very young, and we'll witness a number of changes before these technologies will be properly used
to the best benefit of the end users. At the time of writing this book, the "AJAX" name is about
just one year old.



Introducing the AJAX Whiteboard
Although it isn't apparent, AJAX can draw as well, and in this case study we'll see how. Our goal
here is to build an online whiteboard application, where your visitors can draw and publicly
express their artistic skills.
Implementing a whiteboard certainly isn't the best real-world scenario for using AJAX, because
technologies such as Flash or Java do a much better job at handling complex graphics. However,
implementing a whiteboard with AJAX allows us to study some of the more sensitive areas of
AJAX development, such as:
• Drawing graphics using specific algorithms and div elements
• Efficiently packaging data for client-server communication
• Synchronizing the same view among many clients
• Optimizing the database storage and SQL queries for increasing performance
For the whiteboard application we'll build in this chapter, we have the following requirements:
• Responsiveness is a key factor: We seek for low times of response from a real-time
application.
• Support for concurrent access, enabling collaborative work: Two or more users need
to be able to access the application at the same time.
• Data sharing: All participants can interact with the whiteboard differently, yet they
must share the same view of the board, just as with the blackboard used in a
classroom. (All of us need to have the same view in order to participate in the
classroom, don't we?)
One might say that these are the characteristics of a desktop application, more or less. One wellknown
example of a whiteboard is NetMeeting from Microsoft. Popular instant messenger
applications such as Yahoo Messenger and MSN Messenger support this feature as well.