CHAPTER 2
Understanding Client-Side AJAX
The Essential AJAX Pieces
Examining JavaScript
Some Basic JavaScript Tools
Working with JavaScript Objects
From Objects to Functions
Counting on JavaScript Arrays
String Theory
Understanding Browser Differences
Reviewing the HTML Document Object Model
Playing with User Interfaces
Creating a Clock
Building an Asynchronous Object Registry
Working with Asynchronous Server Content
Introducing the XMLHttpRequest
Parsing and Serializing XML
Playing with Parsing
Seeing XML with Serialization
XPath and Transformations
Walking the Walk with XPath
The Art of XSLT Transformations
A Brief Note on JSON
Summary

CHAPTER 3
Designing AJAX Applications
The Effects of AJAX
Characteristics of AJAX Design
Back to the Drawing Board
Creating AJAX-Based Components
The Principles Behind AJAX Components
The Drawbacks to Inline AJAX
Using AJAX for Binding
Binding.xhtml
jsbinding.css
Bindings.js
Instantiating the Bindings
The Knee Bone Is Connected to ...
XIncludeBinding.js
Digging into the XInclude Binding
AJAX and the Server
Retrieving (and Sending) File Content
Combining Components and Services
The Power of Prototype
Final Thoughts on Components and Design Principles

CHAPTER 4
Mobile AJAX
Roadmap
The Mobile Data Industry
The Wireless Network
Localized Networks
The Radio Frequency (RF) Network
Cellular Data Transmission Techniques
The Historical Evolution of Data Transmission Techniques
2G Systems
2.5G Systems
3G Systems
The Mobile Application Value Chain
Types of Mobile Data Applications
Browsing Applications
Downloading Applications (Smart Client Applications)
Resurgence of the Browsing Model
Problems Facing the Industry Today
Problem One: Market Fragmentation
Problem Two: Porting Woes
Problem Three: Application Distribution Without Walls
Browsing Offers Some Solutions But Has Its Own Issues
Browsing Applications and the Role of AJAX
AJAX – An Overview
AJAX on Mobile Devices
Widgets and the Disruptive Potential of AJAX
Design of Mobile AJAX Applications
Factors Affecting the Design of Mobile Browsing Applications
General Design Principles
Content Adaptation
Navigation and Links
Navigation and Links Recommendations
Page Content and Layout
Page Definition
User Input
AJAX Design Considerations
General Browser/Mobile-Level Recommendations
JavaScript Constructs
DOM
CSS Optimization
Widget Design
The Opera Platform
Developing AJAX Applications
A Big Picture View of Application Development Steps
The ‘Hello World’ Widget (Browser)
Creating the Widget Configuration File
Running Your Widget for the First Time
Adding Style
The Hello World Widget (Mobile)
Creating the Opera Platform Application
Adding Your Application to the Framework
Packaging and Deploying Your Widget
Conclusion
Appendix

CHAPTER 5
The Web Page as an Application
Assumptions and Guidelines
AJAX UI in a Nutshell
AJAX UI Architecture
Server Side – Controller Servlet
Client Side
Model
Object Identifier
Client Data Cache
Immutable References
Change Set for Server-Client Interaction
Message Format for Server Invocation
Metadata
View
HTML Elements and DOM
HTML Templates
Components
Alternative to HTML Templates
List of Component Classes
Controller
MVC Interaction
An AJAX UI Versus Server-Side Presentation
Secret Sauce in AJAX UI
AJAX Pages and Workflows
Source Code Organization – Directory Structure
A Sample Application
JavaScript Functions as a Class
Utility Classes and Functions
ElementCollection
AjaxEngine for Client/Server Interaction
DataRequest Class
Stepwise Refinement of the AJAX Page
Shell Main Page
Navigation Bar as a Template
Loading the Navigation Bar Template
Navigation Component
Navigation Controller
XMLToDataSet Class
Project List Page
SimpleTable
Loading Table Data
Row Selection in the SimpleTable
Row Selection Listener
Example Components
Component
Inheritance in JavaScript
TextComp
SelectComp
DateComp
TextAreaComp
Project Detail Form
Form
Displaying Selected Rows in the Form
Propagating Changes
Retrieving Change List
Controller Servlet in Detail
Post Changes to the Servlet
Client-Side Renderer
Conclusion

CHAPTER 6
Building AJAX-Friendly Web Services
Limitations on Cross-Domain AJAX
HTTP Is a Fundamental Transport
XML or JSON 285
RSS as Web Service
Flavors of XML
POX, REST, SOAP, WS
Common Server-Side Languages
Language Rundown
PHP
Perl
ColdFusion
Creating an AJAX-Friendly Web Service
Creating a PHP Web Service
The Code
Dissecting the Code
Creating a ColdFusion Web Service
Dissecting the Code
Server-Side Architectures
AJAX Without a Server-side Framework
What It Does
Creating a Live Search Web Service with PHP
Consuming the Live Search Web Service
How It Works
Using a Client-Side Framework
AJAX with a Server-Side Framework
Using TinyAjax to Create Live Search
The TinyAjax Code
How to Improve the Example
AJAX in a Service-Oriented Architecture
Cross-Domain Issues
Cross-Domain Proxying
Proxying with Apache mod_rewrite
Cross-Domain Proxying Summary
Advanced Techniques
Multiple Requests/Responses in a Single Call
Request Throttling
Guarding Against Hung Services
Summary

CHAPTER 7
Going Deep into the AJAX User Experience
Strategy #1 – Define Your Problem
Strategy #2 – Create a Model
Strategy #3 – Measure the “User Experience”
Strategy #4 – Create Personas
Strategy #5 – Create a Storyboard
Strategy #6 – Perform an Application Walkthrough
Strategy #7 – Do a Heuristic Analysis
Strategy #8 – Create a Cheat Sheet
Strategy #9 – Go Classic
Strategy #10 – Don’t Use AJAX for Navigation
Strategy #11 – Eat Your Own Dog Food
Strategy #12 – Be Consistent
Strategy #13 – Completely Test What You Build
Strategy #14 – Break the Back Button (When It Matters)
Strategy #15 – Don’t Break the Back Button (When It Matters)
Strategy #16 – Allow Bookmarks and Forwarding Links
Strategy #17 – Keep Users Informed
Strategy #18 – Don’t Ignore the Browser-Challenged
Strategy #19 – Notifying the User When Something Has Changed
Strategy #20 – Do Things in the Background to Help the User
Strategy #21 – Auto-Complete Fields (If You Can)
Chapter Summary – AJAX User Experience Strategies

CHAPTER 8
A Safer More Secure AJAX
The Best of Scripts, the Worst of Scripts
Don’t You Know That You’re My Hero?
Cross Site Scripting, AJAX’s Double-Edged Sword
JSON – An Attempt to Bring XSS Back
The CPAINT Hole
Good Old Network Security
HTTPS
Encryption
Exploit with Care
Conclusion: I Must Exploit: I Must Not Be Exploited
Full Code Example: The Samy MySpace Virus

CHAPTER 9
Tuning AJAX Applications for Performance
A Warning About Performance Tuning
Measuring Performance
Timing Execution Speed
Code Optimization
Object Literal Syntax
Dereference Dot Notation in a Loop
For Loops
JavaScript Profiling
Memory Optimization
Object Pooling
Improving Network Performance
Measuring Browser Network Performance
Web Server-Based Compression
Compacting JavaScript
Combining Resources
Tweaking the Cache: The Art of Not Downloading At All
Conclusion

CHAPTER 10
Leading-Edge Best Practices
Web 2.0 and AJAX
Users as Testers
Real-Time Monitoring and Sampling
Shadow Applications
Permanent Revolution
Public APIs
Graceful Degradation
Summary
Additional Information

CHAPTER 11
Enterprise AJAX
The Emergence of the Rich Client for SOA and the Enterprise
So What’s an SOA and Where Does AJAX Fit?
Base Services
Abstract Services
Orchestration
Interface
Understanding SOA Levels
Enterprise AJAX Tools
Summary

CHAPTER 12
AJAX IM Client
Design Process
A Note About IM Services
IM Client User Interface Design
The Basic HTML Structure
The Basic CSS and Visualizing the Client
HTML Controls 1: My Buddies and My Status
HTML Controls 2: Chat Windows
HTML Controls 3: The Debug Log Window
HTML Controls 4: Login and Logout
Complete HTML and CSS, Default View of the UI
Designing the Server API
Displaying the Client UI
Returning a List of Users
XML, HTML, and JSON
The Server API (Application Programing Interface)
Buddy Results
Message Results
Overview of the IM Server Code
Building Out the AJAX
Logging Functions
The Initialization, Login and Logout Related Functions, Round 1
Load Users
Login and Initialize
Logout
Global Variables
Basic Process Flow of the IM Client
Buddies and Chat Window Objects
Buddies Object
Initialize
Load Buddies
Display Buddies
Change Status
Post Status Update
Destroy Buddies
Go Chat
ChatWindow Objects
Open or Focus Chat Windows
Load Chat Messages
Display Messages
Chat Send Message
Send Message
Input Focus and Blur in Chat Windows
Hide Chat Windows
Destroy Chat Windows
Refresh
The Initialization, Login and Logout Related Functions, Round 2
On Unload
Complete JavaScript Code
Exercises for the Reader

CHAPTER 13
Corporate Mashups: Composite Applications Simplified
Through AJAX and SOA
What’s Old Is New Again
Where Is This AJAX/SOA Approach Applicable?
Anatomy of a Typical System
Use Case: 360-Degree Customer View
Implementation Strategy
Getting Started
Use of Dummy Data in These Exercises
Exercise 1: Find Customer Dialog
Configure the Service Call to Put Data in the Cache in Common Data Format (CDF)
Generate Code to Call the XML Service and Bind an Event to Invoke It
Exercise 2: Update Customer Views
Publishing the customerSelected Message
Subscribing to the customerSelected Event Subject and Publishing the
CustomerDataReady Event
Subscribing to Data-Ready Message
Where to Go from Here

CHAPTER 14
The AJAX News and Feed Reader
The Architecture
Client-Side Code
Server-Side Code
Where to Go from Here

CHAPTER 15
AjaxWord: An Open Source Web Word Processor
Document Templates and “New File” Wizard
Technical Overview
Launching AjaxWord
Running AjaxWord
Exiting AjaxWord
The Code
A Generic DHTML/JavaScript Toolkit
Creating a “Window” Widget
Defining the View
Defining the Controller
Window Initialization
Window Event Handling
Window Widget API
AjaxWord Client Application Logic
Loading the Application
Initializing the Application User Interface and Asynchronous Communications
Connecting the UI to Application Logic
Event Processing
Handling the Application’s Exit
AjaxWord Server Logic
Summary

CHAPTER 16
Business RIAs: Creating the ‘AJAX Bank’ Application with
the JackBe NQ Suite
Advantages
Components
Development Modes
JackBe Visual UI Builder (JackBuilder)
Session and Mode Information
Menu Bar
Toolbar
Mode Display
Session Info
Toolset Group Selector
Properties Palette
Canvas
Form Tab Selector
JBML JackBe Markup Language
Tool Chain
Resource Bundles
Building an Application with JackBuilder
Creating the Screen in JackBuilder
Saving the JackBe Form
JBML Code Description
Runtime File Description
Displaying the Form in a Browser
AJAX Bank – Building an Application with JackBe
Composite Views
Creating the Helpful Information Drag-and-Drop
DropTarget
Menu Container
Draggable Object
Waste Basket
Functionality
Account Activity Screen
Participants and Responsibilities
JBTable
DataModel
Pager
Slider
Creating the Screen
Slider
JBTable
Pager
Functionality
Filtering Functionality
Data Binding
Conclusion

REFERENCES 611
Setting Up the Environment
Installing Real-World AJAX Sample Applications
Tools and Utilities for AJAX Developers
Editors and Integrated Development Environment (IDE)
Debuggers
DOM Viewers
JavaScript References
CSS References
DOM References
List of AJAX and JavaScript Frameworks and Libraries
AJAX Toolkits/JavaScript Frameworks
AJAX Libraries and Hybrid Frameworks
.NET AJAX Frameworks
PHP AJAX Framework
Ruby AJAX Framework

INDEX