I recently added an Accordion widget to the right panel of my blog. The accordion has the last five entries for each blog category, so the reader can preview the contents of a category without leaving the front page.
I used the Accordion Widget from the OpenRico library for this project. It took very little time to implement, and was a fun little “quick win” project. This is the kind of thing that AJAX can be great for: adding a little interactivity to a basically static page.
0) Turn debugging on in IE
Go to tools->internet options->advanced. Make sure that “Disable Script Debugging (other)” and “Disable Script Debugging (Internet Explorer) are NOT checked.
1) Get Microsoft Script Editor
Install Office 2003 or Office XP, if you don’t have it already.
Check that you have it by selecting View->Script Debugger->Open from IE. If you have Script Editor, then you’ll be offered the choice of “New Instance of Microsoft Script Debugger” or “New Instance of Microsoft Script Editor”. Otherwise, you’ll just see “Microsoft Script Debugger”.
If you see that, then you have Script Editor installed. Congratulations!
2) Using Microsoft Script Editor to debug
In general it is easiest to launch the editor from IE (rather than launching it as a stand-alone application). One handy way to debug is to use IE View->Script Debugger->Break at next statement.
It will create a breakpoint automatically (in Venkmen debugger as well as Script Editor).
When this breakpoint gets hit, your debugger will launch. You will see a message that says “An exception ‘runtime error’ has occurred in script. Possible Debuggers:”.
Don’t fret, nothing has gone wrong. Select Microsoft Script Editor from the list.
Now you’re debugging! Simply step through the code, the way you would in Venkman.
3) After you’re done
Special care needs to be taken to clean up when you’re done debugging, otherwise IE (and possibly the entire operating system) will hang. I recommend F5 (to continue), removing all breakpoints if that is necessary. You need to make sure that the browser isn’t waiting for the debugger. Then shut down the debugger. When it asks you if you want to stop debugging, say “yes”.
4) Related articles / further reading
An article on IE debugging from Microsoft
The ViewRenderedSource Firefox extension makes troubleshooting your DOM tree a snap.
A nice blog article on the Microsoft Script Editor
A great installation guide to Microsoft Script Editor
MacRumors has released the results of their experiment using AJAX to deliver presentation updates from MacWorld. The numbers are simply jaw-dropping, a 6X reduction in bandwidth.
“[We] consumed over 32 GB of bandwidth during the three hours surrounding the event. (For those interested, a non-AJAX version of MacRumorsLive would have required an estimated 196 GB of bandwidth over the same period of time)”
For sites that experience a highly variable load, AJAX can mean fewer servers, lower bandwidth bills, and less risk of failure. This is a huge, public win for AJAX as a bandwidth optimization strategy.
A new AJAX convention cropping up in a few places, one that is easy to implement and has real benefit to end users. I haven’t found a description of it anywhere, so I thought I’d write it up here.
The basic idea is that user controls (typically for editing the displayed data) should be hidden from the user until needed. At “rest”, an area of the screen displays information in read-only fashion.
On clicking an “edit” button, the div expands to display the widgets for changing the data.
Apache just received a proposal to bring AJAX tooling to the Eclipse IDE. The proposal is sponsored by IBM and Zimbra, and is championed by Sam Ruby. Toolkits that will be incorporated into the intial version include Zimbra AjaxTK and Rico. [via]
Flash gets a bad rep among programmers. The programming model is very different from typical programming languages, and the uses of the technology have typically been annoying (banner adds, skip-intro splash pages). More recently, AJAX has emerged as an extremely popular way of introducing dynamic behavior into web pages. So why do we even need Flash?