Here are places it’s useful to use Ajax
: (This is a collaborative wiki
list – feel free to add your own ideas to it)
- Form driven interaction.
Forms are slow. Very slow. Editing a tag (the old way) on a del.icio.us bookmark? Click on the edit link to load the edit bookmark form page, then edit the field and hit submit to wait for the submission to go through, then return to the previous page and scroll down to find the bookmark to see if the tags look right. Ajax? Click on the edit link to instantly start changing tags, click on the submit button to asynchronously send off changes to the tags and quickly see in place what changed, no reloading the entire page.
- Form driven interaction- Subset:Linked Select Menus.
Imagine a T-Shirt with 3 options; Size, Color, and Style. When tracking inventory for your product, you know you have Large, Red, Polo shirts in stock, but you’re out of Small, Blue, T-Shirts… It is frustrating to the user to pick this combination and then receive an error on the checkout page stateing that you are out of stock… and then have to go back to the selection process and reconfigure the item… Using AJAX, you can check the stock of the options as the user picks them and only return or show the items which are in stock.
- Form driven interaction- Subset: Autosave.
Think of someone writing in Word. Which button do they use the most? Save.
- Deep hierarchical tree navigation.
- Rapid user-to-user communication.
In a message posting application that creates immediate discussions between people, what really sucks is forcing the user to refresh the page over and over to see a reply. Replies should be instant, users shouldn’t have to obsessively refresh. Even Gmail, which improves on the old hotmail/yahoo mail ‘refresh inbox, refresh inbox’ symptom, doesn’t really push Ajax far enough yet in terms of notifying new mail instantly.
- Voting, Yes/No boxes, Ratings submissions.
It’s really too bad there are no consistent UI cues for Ajax submission, because submitting a vote or a yes/no response is so much less painful when the submission is handled through Ajax. By reducing the time and impact of clicking on things, Ajax applications become a lot more interactive – if it takes a 40 seconds to register a vote, most people would probably pass unless they really care. If it takes 1 second to vote, a much larger percentage of people are likely to vote.
- Filtering and involved data manipulation.
- Commonly entered text hints/autocompletion.
- Interactive Errors
If someone is entering complicated data, it doesn’t make sense to tell them they have failed only after a lengthy submission process. Ajax can speed up this workflow by quickly letting the user know of an error condition before they try to submit. Example: a username chooser, instead of making the user submit the entire form, try a new name and repeat, or keep trying a ‘is this name chosen’ form, the username chooser can simply indicate to the user whether the username is unique or not, while the user is still typing it.
- Long Running Queries/Remote Calls
If a query or a call to a remote webservice is going to take a long time that cannot be avoided, Ajax works well to manage the time a user waits for the call to return. For example, SWiK uses Ajax to fill in results from webservices detailing new projects: a user doesn’t have to wait for Google webservice to return before starting to edit a new project
- Computationally Expensive Operations
- Server Savings
Sometimes, a process users do over and over on a site requires only a small amount of new data to be sent over the wire, but loading entire new pages can be a strain on the servers in bandwidth and resources. Ajax can be used to load pages more efficiently, as seen in various tests. Of course the ease of making new or multiple requests from the server using Ajax also means that it’s easy to overtax server resources as well.
- Interactive Panning And Moving Over Data
Moving and scanning over large data sets makes it impracticable to pre-load all of the data. Loading the data just ahead an just behind the user gives the appearance of the entire data set being accessible, and helps eliminate loading times. A great example of this is Google Maps’ scrolling tiles system that gives the effect of moving over a map by picking up tiles behind and placing them ahead of the user, filling them with new data requested via Ajax.