rapid dom/ajax development

It took me a while to decide which panel to go to — I was very tempted by the social sharing session — but I decided I needed something really nerdy to kick it off.

I was going to try to do some work on a couple of side projects this afternoon, but I’m not working in my familiar computing environment, so I don’t think it’ll happen. 🙁 I suppose that’s more polite to the speakers, tho. 😉

Whoa, it’s crowded! As in, asking people to make room. I hope that bodes well.

Too much noise out in the hall…Nick Finck is doing a kinda dull intro.

Kewl, now the mic is on. I can hear him. Going to cover: his experience. Slides to be available afterwards.

What is DOM Scripting/AJAX? Quick definitions. I like that he uses Jeremy Keith’s term. they’re both just javascript. shouldn’t it be rapid javascript? has to keep up buzzword quotient.

people underestimate what’s possible. functional programming language: can pass functions to functions, and get functions as result of function. [okay, why?]

anonymous functions. function() { } vs function loadImages() { } — I missed why they’re good.

useful for callbacks, etc.

closures. means that we have access to internal scope variables. (I thought that was a bad thing?) example.

keys to rapid development: maintainability. finding bugs, managing the work of others. extensibility. flexibility. tieing to specific JS libraries, page class names.

using a coding style. no such thing as a real constant in JS, but by using syntax, tell self or others in the future that it shouldn’t be changed.

namespace. a variable that contains all of your particular scripts. weird.

underscores for internal methods. which methods to use or not.

he talks too fast…or maybe just fast AND vague.

singleton, design pattern which means there is only one of that item. use either object notation or the New keyword. can no longer create more versions of that object. event management is a good use of singletons. I feel like I’m missing something. also good for animations, use of timing. (C found a singleton beetle during an insect survey at Evergreen, years ago!)

object notation syntax. (what all this means, in short, is that between JS & PHP, I finally need to learn OOP)

use debug tools. excellent tool is firebug for firefox.

trace http calls — live http headers firefox extension — for AJAX more particularly. to see what’s happening.

on extensibility….

callback: Call this function when I’ve done something.

override. uses s5 as an example; this is the first thing that I can start to see concretely. the problem I have is that I think concretely, in examples, and these examples, for the most part, are very symbolic.

on flexibility….

don’t use predefined class names or element names. okay, here’s another good example, not tying to a library.

separation of behavior from presentation from content. don’t change styles directly, change the class name instead. element.className = ‘error’ vs. element.style.color = ‘red’

attach to elements. scope issue. I sorta get that.

libraries to avoid reinventing the wheel. (have we actually invented the wheel yet?)

reduce the mundane (document.getElementById() vs. $()) and/or create effects (primarily to reduce the gruntwork of cross-browserness)

more examples, mostly from Prototype. add/remove class names, particularly in situations where an element may already have a class. (I remember that example from the DOM Scripting book.) also example from JQuery. (have I seen jquery?)

click-to-expand FAQ. hey, neato!

chainable methods — receive object, perform action and so on, all in one line.

“sizzle” — fading sliding etc etc.

good libraries help, and fulfill his 3 requirements for good rapid development. “play well with others”

“which library should I use?” default answer: it depends; what are you trying to accomplish? avoid overkill. ooooh, comparison chart! name, size & compressed vs. uncompressed. Yahoo library is ginormous, but alacart: only pull in what you need. Dojo is similar.

and then there’s AJAX. nowadays anything with JS seems to get called AJAX. ways to improve connections to server. JSON. parsers exist for many serverside langs, incl. PHP. JSON Transformations? XSLT syntax. (yipes! run for the hills!)

two ways to call a json value — dot syntax vs. square bracket. (so, for java people vs. php people?) a way to do dynamic select lists.

use innerHTML. (isn’t this one of those religious debates.)

premade html shells — populate with data as ready, faster than innerHTML.

again: use a library.

where to from here: usability (dexterity example re: drag-drop shopping cart), accessibility. test, test, test!

what kind of compression? removed carriage returns, comments. could make smaller using gzip on server.

common pitfall for new developers: not testing enough. assuming that stuff will just work.

plugged back in

I’m back to being continuously connected, at least for the next day and a half. 🙂 In true geek convention fashion, I’m sitting on the floor juicing up a laptop, checking my email, looking at my aggregator (755 items!), and yes, writing this post.

The trip down to Portland was the journey of near-disasters. We went the long country way instead of taking I5, going around the back of Mt St Helens. We almost hit a deer, then we got stuck in a ditch, but two very nice women in a very large truck helped pull the car out with a chain. The drive around the mountain was gorgeous but uneventful. (Reminder to self: Iron (???) campground would be a really nice place to stay. The associated picnic area was quite lovely.)

We camped on Monday night at Battle Ground Lake State Park. It was something of a shock after driving all day in the middle of nowhere, to come out into the town of Battle Ground, and to have the first thing we saw be a brand shiny new Fred Meyer, in a strip mall with two Starbucks (one was inside FM)…with the same sale, even, as the one we were shopping on Sunday night in Lacey.

The campground was very well maintained, and the staff cheerful. The drive-in spots were pretty much full, but we’d booked ahead…and had a spot 3 minutes walk from the bathroom! There are also walk-in spots, and during our walkaround later in the evening, those spots looked to be mostly empty. Something good to note for later.

The lake itself is gorgeous. Alas, all I had was my cameraphone, so no pics. It’s an old volcanic cone, like a flatter Crater Lake, and there’s a trail all the way around.

Of course, in a final near-disaster, I took a good hard tumble on the rocks on our 2nd walk around the lake. I lost my footing and went down in a crazy upside-down pose. But…no cuts, only a couple of minor scrapes, a bit of soreness in my left shoulder, and a huge blue-purple bruise on my calf. And we made it the rest of the way around in the twilight, no more missteps.

The last time I went camping, I hardly slept a wink, because I could feel every little bump, and there was absolutely no cushioning underneath my hips. This time, I bought an air pad ahead of time, and slept like a rock.

I had an early morning walk around the lake, while C was still dozing, and as the sun was cresting over the edge of the crater. (Oh how I love summer at this latitude!) Mist was rising off of the water, and the air was cool & soft. Just about perfect.

After a little breakfast, we drove down to Portland and hooked up with my old friend Tom. I’ve known Tom since ’97, when we worked at United Way together, when I was an administrative assistant, and he was working on the Web site (among other things), and that’s one of the things that got me into this biz. Also, Tom was one of the witnesses to my wedding. He’s only just recently come back to Portland from the UK, and is being gracious enough to let us crash on a futon in his living room. (It’s a great place: a house from the 20s that’s been converted into two apartments, in a lively neighborhood.)

So far we’ve had great Mexican food, pizza, and homemade Thai. Yum…one of my favorite things about Portland (which is one of my favorite places) is the great food. Plus we had breakfast at Roxy’s yesterday; we go there every time we’re in Portland. (The Soylent Green omlette? Highly recommended.)

I am on C’s new laptop, which we bought yesterday (educational discount + no sales tax!), and trying to figure out how this OSX thing works.

The last two days, we’ve spent the afternoon on the beach at Sauvie Island, just kinda dozing in the sun/dappled shade, swimming in the mighty Columbia. Also, I’ve been working my way through the last book of the Baroque Cycle. (Which fscking RAWKS.)

This morning I skipped the morning panels and instead we went to the Chinese Garden downtown. A little dowdy, with some stagnant spots of water, but generally quite lovely and inspirational.

It was good (where good = refreshing, meditative, and theraputic for my hands) to be mostly disconnected for a few days. It is equally good (where good = invigorating, engaging, and creative) to be back online.