• The Ajax Experience Wrap-up

    Oct 26 2006

    I had a really great time at The Ajax Experience, and got to meet a lot of really cool fellow JavaScript hackers. The sessions were all very interesting, but what really stuck with me was the difference that a good JavaScript library can really make in your development.

    John Resig's talk on Choosing a JavaScript Library showed how much cleaner and faster development can be when a library offers elegant solutions to very common problems. And I assume John used some kind of Jedi mind trick because his talk made me choose his own library, jQuery. I even rewrote my talk's examples in jQuery to make them shorter. I'm sure I'll be writing a lot about jQuery on here in the future.

    My "Unobtrusive Ajax" talk went pretty well, I thought. I realised afterwards that I hadn't pointed people at my examples for download. So if you attended and want to take a second look, or if you didn't attend but still want to see what it was all about, go check out the downloads below:

    And please, contact me if you have any questions or comments about any of this stuff.

  • Defining functions in a loop

    Oct 19 2006

    Do you ever try to define a function in a loop, like an event handler for example, and find that it's always the last variable in the array that is pointed at by every event handler? It can take a while to debug this stuff. Let's say you do something like this:

    var links = document.getElementsByTagName('a');
    for (var i=0;i < links.length;i++) {
        var link = links.item(i);
        link.onclick = function() {
            alert(link.href);
            return false;
        };   
    }

    (Stupid example, I know). Well if you run this on a page, you would expect that everytime you click a link, you will get an alert with the href of that link. Well that's wrong! You actually get the href of the last link on the page every time!

    This happens because of closures in JavaScript. You would expect that the link variable has the same value inside the onclick function as it does outside. But in fact, every time the loop comes around, link gets a new value, and actually the link variable in all those other onclick functions changes. So when the loop finishes, every onclick function will alert the href of the last link.

    So to avoid this, you can do a few things. You can make a separate function that attaches the event like so:

    function attachLinkEvent(link) {
        link.onclick = function() {
            alert(link.href);
            return false;
        };   
    }
    
    var links = document.getElementsByTagName('a');
    for (var i=0;i < links.length;i++) {
        var link = links.item(i);
        attachLinkEvent(link);
    }

    This works because inside the attachLinkEvent function, the value of link points at the argument, which is a copy of the link in the loop. This way it doesn't change when the original link changes. Confusing? You bet.

    Rather than use this workaround, you can just avoid using the link variable altogether in the onclick function, and replace it with this. Inside an event handler like onclick, this will point at the element that the event handler is attached to. In this case, this points at the link:

    var links = document.getElementsByTagName('a');
    for (var i=0;i < links.length;i++) {
        var link = links.item(i);
        link.onclick = function() {
            alert(this.href);
            return false;
        };   
    }

    Of course, real life examples are a bit more complicated. There are also different workarounds to fix the problem. But typically, one of these two solutions will fix things.

    For way more information on closures than you will ever need, read Richard Cornford's essay JavaScript Closures

  • Unobtrusive Ajax at The Ajax Experience

    Oct 10 2006

    I'll be presenting at The Ajax Experience. This is an Ajax conference taking place in Boston from October 23-25, 2006.

    My topic will be "Unobtrusive Ajax", which I've described as so:

    Learn how the separation of content, presentation and behavior can not only make your web applications more accessible, but also easier to develop and maintain. See how to implement modern web interfaces so that they are enhanced by JavaScript and still work fine without JavaScript.

    Jesse will walk you through lots of examples and show you solutions for some common problems in Unobtrusive Ajax development. Although some of the examples will use a bit of PHP, Jesse will focus on the JavaScript and HTML, so you'll be able to apply the lessons learned to any server platform.

    I'll mostly be talking about the practical benefits of separating JavaScript, CSS and HTML, as well as why you shouldn't assume people have JavaScript, and how to design (or re-design) some common Ajax interfaces to avoid this assumption.

    I'm a bit worried I'll be the party pooper at the conference.. everyone'll be so excited about using JavaScript, nobody will want to be reminded about the minority that doesn't have JavaScript. But I think the presentation will be a lot of fun and I'll hopefully show people that it's not a big deal to support non-JavaScript users, and it may even make your code more stable and easier to manage.

    If you'll be attending, please, let me know. I'd love to meet some fellow Ajax hackers.

    Update Oct. 26, 2006: Click here for a write-up and links to my slides and examples.

  • Freelancing: First two months

    Oct 8 2006

    It's been two months now since I announced I would start freelancing full-time, and hardly anything has gone the way I expected. Here's a little list of some of the things I've learnt or found surprising:

    1. You don't work as many hours in a day as you think

      Originally, when trying to figure out how many hours I'd be working per day, I just figured I'd do the same I did at my day job: 8 hours, from 9 to 5.

      The first time I tried to work that long, I realised it just wasn't going to happen. I discovered that it takes me about an hour of checking email, reading news, etc. to wake up enough to start working. Then, I can only work about 2 hours straight before my mind turns mushy and I have to take a break.

      I quickly realised that my prime working length was around 5 hours in a day, spread out over a period of 7 or 8 hours. But when you're billing by the hour, you really should only charge for the time worked, not the time eating lunch or surfing the web. This is a major difference between freelancing and a regular job.

    2. Scheduling can be very hard

      Scheduling is a juggling act based on a few difficult tasks: estimating how long it takes to do something, and figuring out when you'll have time to do that work. Multiply these simple looking problems by the fact that you'll occasionally be stuck waiting for something from clients. This can create these weird bubbles in time where you have nothing to do, but know that a few days from now you'll have way too many things to do.

      With web development, the size of projects can vary from an hour or less to over 400 hours of work. It's especially hard to deal with very large projects. You can say it'll take 100 hours, and that it'll take a month to work those hours. What do you do while you wait for the client to get back to you - tell everyone else who asks for work that you're all booked up? Then what happens if the project never happens? You get screwed!

      I'm starting to figure out I have to just explain my situation to my clients, tell them I don't know exactly when I'll have time, but that I should be able to finish within the next month or two. I'm also being careful not to commit more than maybe a third of my time to any one project, because anything can happen. The more flexibility I can work in, the better.

    3. Freedom isn't free

      Probably the best part of freelancing is the freedom to work when and whereever you want. While this is true in theory, when you schedule work for yourself, you have to make the commitment to actually work those hours. If you don't, well, you'll either have to work extra hours later or else deliver things late. These are the only stresses that really force you to work, but I'm glad that they're there, or else I would probably be taking off way too many days.

      Freedom also gives you the opportunity to find your own rhythm. I'm starting to think that I may work better in the evenings, though my girlfriend isn't so excited about that idea. It's actually not so easy to figure these things out, something you don't have to think about when you're told exactly which hours you have to work at.

    4. No time for blogs

      When I had a day job, and I wanted to take a little break, I just loaded up Bloglines and tried to catch up on the 200 or so feeds I subscribe to. Now, I can say I haven't read any of them since I went completely full-time. You may also have noticed that I've hardly blogged at all during this time, either.

      The reason is, now that the computer at home is where I work, when I take breaks or stop working, I want to get as far away from the computer as possible. It's like blogging and even reading blogs is a part of work that I need to schedule in or make time for, except it seems like the least important thing I have to do, so I never end up with time for it.

    5. It's not so hard to find work

      I once told a guy who worked at a web development company that I was about to start freelancing. He said, "That won't work. When will you have time to find clients?" I haven't had that problem at all.

      Okay, I do have the advantage of having this blog. Nearly all of my clients come from my Hire Me page. But I'm not scared that this will stop. I know that I can easily find more work through sites like Rent A Coder or Guru, even if it pays a bit less than I prefer. I could also step up my marketing efforts at any time (which means doing any, since right now I'm doing practically none).

      Okay, it's true, I don't have a lot of time to go find clients. But if I ever ran out of work, I'd certainly have the time to find new clients. It should balance itself out quite well.

    So there's some of the things I've learned. Do any other freelancers out there have anything to add to this list?