Monday, October 23rd, 2006
Category: Presentation, The Ajax Experience
Being a semi-professional experience ruiner myself, I was attracted to this session with Aaron Gustafson – Easy Designs, LLC at The Ajax Experience).
Much of the content was fairly basic “must know” stuff. A little review never hurts though; Besides — if you don’t know this stuff: you really _need_ to know before you get much further down the road.
These are things like:
- Terrible error messages (”Error: Can’t display error message”)
- Non-scalable font sizes
- Distracting layouts
- Not knowing your audience – Are they ready for the coolest new JavaScript trick?
- Relying on JavaScript without a fallback.
The second half of the presentation revolved around that final bullet. Some tips, tricks, and approaches to “Hijax” (covered here previously).
- Expanding/displaying hidden content on a javascript action, but falling back to a simple anchor href
- Making up for an absence of js with css, using :target (and again providing a fallback, of course)
- Proving the “submit” for the form if xhr can’t be used
As a frequent reader of ajaxian – these are things you aren’t considering earth shattering – but you DO use them everyday – and you know (probably first hand) that they can hurt your site.
Category: Presentation, The Ajax Experience
The argument against data visualization in JavaScript is obvious: it’s intense stuff. Potentially millions of computations running continously under the covers is daunting enough – throw in the animation monkeywrench and the prospect of a JavaScript implementation may be just a tad daunting. The answer to the question “Where do we have available CPU cycles?” may be “The client”, but unfortunately “The client” is also the answer to the question: “Who lacks the patience to wait for CPU cycles to complete?”.
Kyle Scholz’s talk at The Ajax Experience carried the disclaimer “may not be suitable for your large dataset”, but he provided an overview of how the process can be both practical from an efficiency standpoint – and even entertaining to the impatient user, using animation of the graph reaching a static state.
The talk began with some general background on JavaScript, as well as some background on force directed layout algorithms (*flashback to high school chemistry) using a graph of adolescent relationships (*flashback to the _other_ high school chemistry). The jewel of the talk was JSViz – A JavaScript library for generating animated connected graphs (Tree and Force Directed). JSViz prefers SVG for it’s shape and line rendering but falls back to a plain(er) HTML implementation when it detects that SVG is not an option (which, I would imagine, would be fairly often at this point). It’s extendable and open source.
Kyle walked through several tutorials that are available out on his site (code also available there). If you want a quick example of what this is all about: an example app is also available out there demonstrating an implementation of JSViz used to graph music “familiarities” via an Amazon web service mashup.
…if you’re fiending for some more complex graphing examples (not necessarily having anything to do with ajax), check out visualcomplexity.com
Wednesday, September 20th, 2006
Category: Presentation, Prototype
Thomas Fuchs has posted his slides on unit testing JavaScript from his talk at RailsConf Europe (large PDF).
The presentation covers:
- The history of JavaScript testing :)
- His unit test package
- Benchmarking
- Tying into rake
- Behaviour Driven Design based testing
- Debugging utilities
Thursday, July 27th, 2006
Category: Conferences, Presentation
On the SitePoint Blogs today, “live” from this year’s OSCON, there’s a new post covering the talk from Kevin Henrikson concerning how to squeeze the most out of your Ajax connections – a few handy optimization techniques.
Kevin Henrikson of Zimbra gave a brisk presentation covering some of the lessons his organization has learned and the “dirty tricks†it has implemented to improve the performance of web applications that rely on large JavaScript/CSS codebases. Here’s a quick run-down of the items he covered. The slides of the talk are up on the Zimbra blog.
Among the tips mentioned are:
- using a web page analyzer to find the trouble spots in your pages
- Javascript compression tools to reduce the size even more
- properly structured HTML to make for faster rendering times
The post also mentions two of the case studies Kevin did – one centered around a blog post he did on optimization and the other on lala.com. Check out the slides for the full story…
Saturday, June 24th, 2006
Category: Ajax, Conferences, Presentation, Prototype, Ruby
(Note From Rob: This session write up comes courtesy of Jim Halberg. Jim is not an official Ajaxian, though he dreams about being one when he grows up. Thanks, Jim!)
Are we still at the point where a talk on ajax must start with the "What is ajax?" question? Well, at least the explanations seem to be getting shorter =) (Rob: note to conference speakers – can we please just assume basic Ajax knowledge at this point?!)
Justin spent the majority of the presentation showing uncluttered examples of various Rails/Ajax/Prototype capabilities. Auto-complete search, drag-drop, and the like. These were delivered in a "if you haven't played with this yet" sort of way but he also managed to keep it quick enough – and drop in enough 'even if you've done this before you may not know about this' tidbits to keep the more experienced portion of the audience interested.
There was some talk on RJS and he spent some time on the always requested ajax topics… How do you deal with JavaScript disabled? What if a user has an old browser? How do you handle the introduction of new idioms?
The presentation ended with a bang as he demo'd creating an application with the soon to be released Streamlined. Streamlined is an open source framework, developed by Relevance LLC, to bring the simplicity of ActiveRecord to the view layer (coincidentally, this is #2 of the "3 Unsolved Problems" posed in Dave Thomas keynote yesterday). This is really slick – a lot of functionality – good looking (although they are looking for a designer to contribute some improvements) – and best of all: _very_ quick and powerful. I'm definitely looking forward to this being released at OSCON.
Friday, May 19th, 2006
Category: Dojo, Presentation
Brad Neuberg has posted his slides from the Ajax Experience 2006 conference covering his look at persistent storage methods for your web applications, both off and online. It focuses specifically on using the Dojo.Storage to keep large amounts of data at the fingertips of your app.
Web applications have been constrained by the 4K limit of cookies for years. Learn how the new dojo.storage system can allow web applications to persistently and securely store large amounts of data. Developers will be shown how to use the dojo.storage API; example applications that use these APIs, such as a web-based word processor that persists its file’s locally rather than on a server; and details of how dojo.storage is internally implemented.
The presentation walks users how to use the Dojo.Storage module inside a full-scale open source application (,a href=”http://codinginparadise.org/weblog/2006/05/moxie-open-source-web-editor-with.html”>Moxie) to manage text in a word processing environment both off and online. There’s also links to the demos mentioned in the presentation – one for Moxie and the other a test of the Dojo.Storage interface.
You can check out the presentation in various formats – HTML, OpenOffice 2.0, and PDF.
Sunday, May 14th, 2006
Category: Ajax, Dojo, Presentation, The Ajax Experience
Thanks to all who attended!! The weather was great, the St Francis hotel is amazing, and we had all sorts of great feedback and discussions with everyone who came. We are looking forward to the next Ajax Experience, hopefully coming soon somewhere on the east coast…
Some more links, reviews, and notes:
Whew! If you have any followup notes, reviews, or ideas, please comment!
Category: JavaScript, Presentation, Programming, The Ajax Experience
We were lucky enough to have Brendan Eich, creator of JavaScript, give a keynote at The Ajax Experience.
We have placed the presentation online so everyone can read up on some of the thoughts and discussion on JavaScript 2 and more.
Here we got to hear from the mouth of someone deep into the ECMA process about what we are going to see in JavaScript 2 and importantly why:
Motivation for JS2
- Fix problems in JS1 that bug people daily
- A type system to enforce invariants
- instead of writing/debugging lots of value-checking code
- optional annotations, an extension to JS1
- Programming in the large
- Package system
- Visibility qualifiers (namespaces,
private internal public)
- Optional static type checking
- Support bootstrapping and metaprogramming
- Self-host most of the standard objects
- Self-host compiler front end and type checker
- Reduce need for future ECMA Editions
As Brendan flicked through these slides, I couldn’t help but realise how important the decisions are. These changes are probably going to profoundly effect all of our lives in the near future.
Coverage on the talk on InfoWorld
Thursday, May 11th, 2006
Category: Ajax, Presentation, Prototype, Ruby, The Ajax Experience
Notes from Thomas Fuchs' session on Ajax and Javascript/DOM techniques to build a better user experience. Thomas is the creator of Script.aculo.us, a member of the Rails core team, and has his own blog at mir.aculo.us.
Why use tools and frameworks?
- Don't reinvent the wheel
- Javascript gives you a ton of power within the browser
- Use a framework to write less code
- Let the framework take care of the browser bugs
- Javascript can be written very similiar to Ruby, due to dynamic, high-level nature
- at version 1.5, bundled with rails 1.1
- ajax support - no XML support - HTML/javascript snippets only
- behaviours - generate javascript on the server and send back as
content-type:text/javascript to be automatically executed
- hooks for easy integration with effects
- extensions ot built-in objects: String, Number, Array, etc - example:
JAVASCRIPT:
-
[1,2,3].each(function(n) {
-
alert(n);
-
});
- $ and $$ functions - $ is shortcut for getElementById, $$ is shortcut for CSS selectors ex:
JAVASCRIPT:
-
$$('p.hint').each(Element.hide)
- events without cross browser pain -
JAVASCRIPT:
-
Event.observe('some_input', 'blur',
-
function(e){ alert('clicked me!') });
- at version 1.6, Thomas Fuchs the creator
- easy visual effects, can combine effects for more advanced cases
- drag and drop support - sortable lists demo
- real time search, autocomplete, inplace editing, slider control
- extras: javascript unit testing, DOM builder
- look at the unit tests to see good examples of how to use script.aculo.us
- baked in to a ton of frameworks
- resources - wiki, Rails spinoffs mailing list, irc channel - #prototype on freenode.net
Visual Effects
- advanced engine for effects - time based so you can control duration
- more then eye candy - provide visual feedback
- make your app feel snappy, make loading times "feel shorter"
- can help you move away from certain proprietary plugins
- yellow fade, fade in and out, sliding panels, puff and shakes
- very simple example: [javascript]new Effect.Appear('message');
- Nice usage of panels, fades done at www.christofwagner.com - looks like Flash, but pure javascript
- Fuchs has an article on creating your own effects at Vitamin
Activity Indicators
- available at local and global level
- can queue up indicators for time-based appearance or for execution in parallel
- build your own indicators at ajaxload.info
Lessons learned
- not all browsers are equal
- learn CSS, get a CSS expert on your team
- DOM api can be slow - Firefox is the slowest, esp. on Mac - IE and Safari are better
- cache element references in javascript variables for things you access frequently
- innerHTML is good and fast
- use Venkmann for profiling
Security
- an ajax request is the same as any other HTTP request
- so -> don't trust it
- always verify data, clean input
- take normal web security precautions
Data formats
- for trivial stuff: HTML
- complex updates: javascript with css selectors
- use proper HTTP caching, only send the js libraries to client once
- don't over-engineer - keep it simple and lean
Tips
- don't use display:none in external CSS
- browser cannot determine original, built-in display value because you overrode the default
- use inline style instead
- IE doesn't hit the cache when HTML fragments are loaded via ajax that have images
- bugs with reserved ids and IE - don't use "length", "item", "namedItem", "tags", "urns" as ids - see Eric Meyer's entry on this
- watch our for trailing commas in javascript anonymous function creation
- debugging - get Firefox, get the extensions
- Firebug is fantastic, Venkmann for debugging, etc, etc
Q & A
- learn the libraries - look at Prototype and Script.aculo.us source code so you know whats going on
- plans for the future of P/S? - no concrete plans, follow what the community needs and what contributions happen - use extractions for existing apps
- browser support - full: IE6, Safari, Firefox. Partial: IE5.5, Opera. None: Netscape 4, HotJava, Lynx
Wednesday, March 8th, 2006
Category: Ajax, Articles, JavaScript, Presentation, Programming
Simon Willison has posted the complete slides (low quality) (higher quality via flickr) to a three hour tutorial he gave at ETech on JavaScript. It looks very thorough with over 100 slides, starting out with the basic syntax and types and working up to objects and first-order functions. He also has made his notes available that he used in preparing the presentation, which looks like a great reference for the language in of itself.
(via Harry Fuecks at Sitepoint.)
Monday, February 13th, 2006
Category: Ajax, Presentation
Harry Fuecks has posted his slides from the recent PHP Conference UK 2006 with some of his perspectives on the popular technology.
The slides, in PDF form, start at the beginner level ("what is Ajax?" and "why do we need it?") , then on to the actual technology behind it all - the "stack", network latency issues, and methods to help counteract them. He notes some of the limitations that the XMLHttpRequest object has and includes a few other resources, like the "30 Second Ajax Tutorial".
Harry is the author of the JPSpan javascript library.
Tuesday, January 31st, 2006
Category: Ajax, Presentation
Eric Pascarello, coauthor of the book "Ajax in Action" will be giving a talk to the Washington, DC area BEA User Group the evening of February 9th, 2006.
The meeting is open to anyone in the area, and will be from 6:30pm to 9pm (it's a Thursday night) at the Embassy Suites at the Chevy Chase Pavilion. If you're planning on attending, you'll need to go and register at their dev2dev site.
Plus Eric will be giving away free copies of "Ajax in Action"!
Friday, January 27th, 2006
Category: Dojo, Presentation, Prototype, Usability
Brad Neuberg has a post worth reading on where to render the UI for ajax apps over on his blog. He talks about two general approaches you can take:
- Thick Client - basically the server just gives you answers to RESTful web service calls, and your client side code has its own mini-MVC approach so it can handle displaying objects, manipulating them, etc. Dojo facilitates this type of approach.
- Thin Client - just capture events and call the controller on the server, and the server returns chunks of prerendered html or javascript for display. This is more the Ruby on Rails/Prototype approach.
He goes on to give examples of both approaches and talks about the pros and cons of each. The thin client approach is more comfortable for server side developers, but can run into performance issues for complex UI's, as you have to hit the server for every user event. The thick client approach requires more knowledge in client side technology, but can pay off in performance and responsiveness. There was also a discussion about this recently on the dojo-interest mailing list for further exploration.
Friday, December 9th, 2005
Category: Editorial, Presentation, Toolkit
Yesterday Ben, Dion, and yours truly went down to Chicago for Adaptive Path's Designing and Building with Ajax workshop. It was a full day event with presentations from Jesse James Garrett and Ben and Dion, followed by breakout sessions in the afternoon and a final panel discussion.
The crowd was a great mix of designers and developers, and there were some great questions and discussion going on between sessions. I've attended several of the No Fluff Just Stuff events, and while they are the best technical sessions money can buy, they are very limited to programmers and developers. It was nice to see that this event mixed the design folks and development folks. The age of the generalizing specialist is here, and it can only be good for the two groups to crossover and learn from each other. Thanks to everyone who attended!
It was announced that there would be slides and code up at www.ajaxian.com/ap/ right away, but since Ben and Dion are on their way to Javapolis in Europe right now I'm just going to post what I have access to now. I can't set up that redirect, though, so a regular post will have to do.
Slides and Sample Code
Resources and sites discussed
This covers the bulk of what was talked about - if I'm missing any links or resources we covered just let us know: .
Thursday, November 17th, 2005
Category: .NET, Examples, Presentation, Screencast
Atlas is Microsoft's big push into the Ajax space for the .NET platform (read our past posts or read Scott Guthrie's "Atlas Unleashed" for more info). Well, XML for ASP posted the strangely named "Using Atlas to View Customers". It has sample code and a video presentation of a demo app using Atlas to retrieve customer data via a web service, using ajax techniques of course.
The video [WMV, 10 megs] is about ten minutes long and demonstrates the Atlas controls for things like autocompletion and a Virtual Earth component. Or you can grab the code, which you'll need the Atlas preview release to run it.
Saturday, October 22nd, 2005
Category: Presentation
I had a great time presenting to the Euro OSCON crowd on Ajax this week.
As promised, I have placed the slides up on the site.
Having to squeeze the presentation down to 45 minutes was tough, as we have so many exciting things in Ajax to chat about.
What is special about speaking at events such as these, is the crowd.
I was a little curious to see what the crowd would be like, considering that the talk just before mine was by Autrijus Tang
, on learning Haskell. Autrijus is the great fellow who has founded Pugs, an implementation of Perl 6 written in Haskell.
At the end of his talk i expected everyone to get up and leave, and was surprised to see quite a few people hanging out to listen to me chat about Ajax. What an interesting niche, of developers who wanted to learn about Haskell AND Ajax in the same day. Great stuff!
You also learn a lot of humility at these events. I happened to be wearing my Firefox t-shirt, and of course discussed Firefox in the presentation.
At the end, a group came up with questions, and thoughts, and some of the questions were on Firefox again. As I was attempting to help out one nice fellow, I noticed the person next to him listening in. I looked at his conference badge and found that it was no other than Ben Goodger of Firefox (and Google in his day job).
"Erm, you may be better off asking this gentleman about Firefox things!"
I had a nice chat with Ben and some other Mozilla folks, and I am really excited about what they are adding to the browser. The thought of support for a standard offline storage API makes us very happy, and this is one of a million things they are working on. I hope we get to chat more in the future.
So, thanks to all that came to the presentation, you made it fun.
Oh, and it was funny to talk about Ajax in a town where the "Ajax" football team was playing midweek :)
« Previous Page —
Next Page »
