digg

Join DiggAbout

Discover and share the best of the web!
Learn more about Digg by taking the tour.

AJAX for n00bs

hunlock.com — Take a look on the net and you'll see endless pages of AJAX Frameworks: libraries which promise to do all the trivial and dirty AJAX work for you, leaving you free to code without actually understanding how the application you're writing really works. So lets pull back the smoke and mirrors and see what AJAX is and why it's just a simple evolution

Bury
show profanity settings
expand all
  • siddhartha211, on 10/12/2007, -0/+33AJAX is pretty simple, and the best tutorial (for free) is the W3C one. Go to W3CSchools.
    • billy1380, on 10/12/2007, -2/+43AJAX or not I think that W3CSchools is one of the most useful info/example/tutorial site arround... especially for folks who need to know bits and peices about lots of web technologies... IMHO...

      http://www.w3schools.com/
    • noodlez, on 10/12/2007, -2/+7i think this one and the w3schools one are similar-ish, but this one gives more of a layman's explanation of the technology, explaining what, exactly, it is and where it came from.

      i dugg it
    • LosingTheFight, on 10/12/2007, -2/+1I love W3Schools, I have used them for tons of info, including some college fundamentals (great tutorials on XSLT and SOA). On a slightly off-topic note, my friends was asking me whether their certifications were worth anything to try to break into web programming. I said I didn't know and would look into it. What do you guys think? Like I said, I know it's off topic, I'm just curious.
    • axel2k, on 10/12/2007, -1/+8I would prefer not to take programming advice from someone who refers to people as "n00bs."

      On a side note, AJAX is very simple. It's understanding the basic underlying (although pretty simple) concepts that many people have trouble with and, until they do so, they will not be able to fully understand how AJAX works or what is going on when they have a problem with an asynchronous request.

      Do yourself a favor: learn the basics of Web development, learn the basics of how Javascript/Ecmascript works, choose a technology (ASP.Net, PHP, RoR, J2EE, etc) and then go from there. I trust, by the time you learn these essential fundamentals, you'll better see when it's appropriate to use AJAX, its true benefits and drawbacks and you'll have a better understanding of exactly what is going on. Then you won't need a tutorial for "n00bs."
    • fyre2012, on 10/12/2007, -1/+1I'm a fan of the w3schools as well.

      It's uber handy to be able to learn some code, quickly, then have a nice easy tool to quickly test the things you just learned.

    • resplence, on 10/12/2007, -2/+2Hi guys, is this the w3schools fan table? Can I join you guys? I love it.
  • embarkadero, on 10/12/2007, -16/+4n00bs always looks like b00bs. funny.
  • austindkelly, on 10/12/2007, -3/+7this was not much of a tutorial...
    • webtekie, on 10/12/2007, -3/+3true, besides these simple tutorials are good for only one thing - displaying "hello world" and such. For application that does more than this you really need a framework that encapsulates all XMLHttpRequest calls so you don't waste time on little things. GWT is really nice so are tons of others.
    • PAJK, on 10/12/2007, -0/+4What more do you want to know? You can send and receive information. If you need to know more JavaScript, learn that; more server-side programming, learn that. AJAX is just not as difficult as you'd think it must be.
  • 2tomato, on 10/12/2007, -10/+4n, zero, zero, b, s means nothing to me.
  • victorin, on 10/12/2007, -10/+1At http://mo.neytrack.in we are using Yahoo UI Library (http://developer.yahoo.com/yui/).

    It helps to develop cool 2.0 functionalities like auto-completes, modal windows and ajax queries in an easy way. Check the samples
    • PAJK, on 10/12/2007, -3/+9I'm sorry, but your site uses an awful URL. Not just because it's painfully unoriginal, but because the name itself, "moneytrackin'" is stupid.
    • CaseyUCF, on 10/12/2007, -2/+3and that web 2.0 look you're going for is not working out at all.
  • Hypersapien, on 10/12/2007, -3/+4Why is he using iframes instead of httprequest objects?
    • armbar, on 10/12/2007, -0/+3He uses XMLHTTPRequest at the end to show that iframes don't have to be used, like in the old days.
    • iWasHere, on 10/12/2007, -0/+3Even though the httprequest is very nice and easy to use, by using IFrames, the back/forward buttons in the browsers will work as a user assumes they would with your web app, if written that way. GMail uses this method.
  • dognose, on 10/12/2007, -7/+2Maybe nOObs shouldn't be using ajax? The shouldn't even be coding html. This can lead to some pretty disastrous webpages!
  • TroubleInMind, on 10/12/2007, -1/+3If he used Trebuchet and rounded corners, he'd be fully web-two-point-oh.
  • tholder, on 10/12/2007, -0/+6http://www.jquery.com/ - it's all I need... and it's lighter than a salad with light mayo. Please make your apps work nicely without AJAX first though.
    • jabab, on 10/12/2007, -0/+4I agree, jquery is great, nice and small with enough features.
  • starguy, on 10/12/2007, -10/+3The stupidity of AJAX is there is always this little chatter back and forth between the webserver, and the webserver has to service all these little requests. I don't want that at all, it doesn't scale. What I want is once a website is initially loaded, the webserver is completly done, and taken out of the loop. I call this CLOROX. (You have to keep scrubbing with AJAX to get out a stain, but CLOROX bleach kills everything in one blow).

    You surf my site, a page is displayed almost immediately, but keeps on loading all data it will ever need, which usually only takes a second or two. The user doesn't even notice this. For most sites which are small, this is the way to go. A user clicks links inside the site, and instantly the page changes, because the data is already there in his webbrowser. In fact, he can disconnect from the internet, and still browse and use the entire site. If he accesses the site later, its entirely in his cache, and is there instanly because no network transaction has to occur. My webserver never has to service him again (at least not until I set the page to expire). In fact, the data can stay in his web cache, or in the upstream ISP caches, and my webserver (bandwidth) is free to service thousands of other new requests a second.

    For those few applications like Google Maps, where you have an ocean of data you can't or don't want to download to a webbrowser app, use AJAX methods. For the bulk of most other sites, however, where the data for an entire site can be stored in a few hundred K of programming and data, use CLOROX methods.
    • jsut, on 10/12/2007, -0/+6That scenario would probably be fine for a very static website, but for anything even slightly dynamic it doesn't sound so hot to me.
    • TheOddMan, on 10/12/2007, -0/+2This scenario could will lead to a whole bunch of completely redundant data being downloaded to the user's hard drive. This would be especially true when working with database driven sites that update regularly, which is what AJAX is designe for. For a static site that is rarely updated 'CLOROX' would be useful, but sometimes you just need to scrub *really* hard.
    • Thuktun, on 10/12/2007, -0/+6@starguy "I don't want [AJAX server interactions] at all, it doesn't scale. [...] You surf my site, a page is displayed almost immediately, but keeps on loading all data it will ever need, which usually only takes a second or two. The user doesn't even notice this. For most sites which are small, this is the way to go."

      You talk about AJAX not scaling, then point out something that only works for small sites? Ooookay.
  • timing, on 10/12/2007, -1/+2This is Yet Another Ajax Explanation YAAE! It's just a mirror of all the others.
  • kcornwell, on 10/12/2007, -1/+3From the article... "Internet Explorer uses an activeX object which is set up a little differently but once set up, behaves exactly the same way as XMLHttpRequest."

    This is not true. You cannot read the response contents in the ActiveX version while in readyState 3. You can in other implementations. This is a MAJOR limitation. Without such capability the connection must be complete (readyState 4) and connection closed. This prevents a persistent AJAX connection for real time updating. The only cross browser method for persistent connections is to use the "forever loading" iframe (that I am aware of).

    Here is a demo of readyState 3 reading of the responseObject... See this page in IE and FF... http://www.kevincornwell.com/sandbox/comet/comet_ajax.php

    other "comet" examples... http://www.kevincornwell.com/sandbox/comet/
    • fyre2012, on 10/12/2007, -0/+1yah, exactly!

      It behaves the same way that a Diesel engine works like a Boeing Jet engine.
  • whta, on 10/12/2007, -1/+1I don't know how much you can trust a site for web development when they're trying to teach you to use deprecated markup..
  • coder316, on 10/12/2007, -0/+1Would it be possible to remotely call a file? For example, this article uses the AJAX 'open' function. It forgets, however, to mention that the code will only work if the file it's calling is in the exact same domain/sub-domain. Does anybody know how to call pages outside of the local domain? Thanks.
  • fembotINuse, on 10/12/2007, -7/+0wtf is ajax
  • superpotential, on 10/12/2007, -7/+1dugg down because of the obscenely and offensively misspelled title title. it's "noobs" not "n00bs"
  • Bigfootsdick, on 10/12/2007, -5/+2***** please
  • drewbe121212, on 10/12/2007, -0/+0I prefer to use Feather AJAX library. It is extremly lightweight. It has only the bare minimum to get AJAX working (which for me worked out great because I wanted something that simply was cross-browser compadible).

    Feather AJAX does this.

    Send the request and get the response back. Nothing else is needed IMHO. All that crap that exists in internet for AJAX is nothing more then what lazy programmers use. Get your heads out of your asses!

    Feather Ajax:
    http://celtickane.com/programming/code/ajax.php
  • Scriptor, on 10/12/2007, -0/+1Hmm, so basically, if I write a basic tutorial that shows you how to "hello world" with something and then gives an explanation of what happens, it'll get me over 1400 digs?

    Neat.
  • FlexLoader, on 10/12/2007, -0/+1Since when was a technology that was used months and months before they even called it AJAX, something you could only purchase to fully utilize?

    I'm using a 29-line AJAX script on my site right now. Anyone can use it...
    http://flexloader.net/habboremix/js/ajax.js

    ...morons.
  • ajaxguy, on 10/12/2007, -0/+0Best Ajax samples, tutorials and services at http://www.ajaxlines.com

    visit http://www.ajaxlines.com
  • gary7771956, on 10/12/2007, -0/+1I really appreciate this straightforward and practical advice on coding and working with AJAX. Very nicely written, understandable and helpful. I like your act of sharing and aiding others in their coding pursuits. Thanks a bunch from "one of the nOObs".
  •  

    Login or register to add a comment

    Create a new account or login to join in the conversation on Digg. You'll also be able to Digg stories to help promote things you like.


© Digg Inc. 2008 — Content posted by Digg users is dedicated to the public domain.
DIGG, DIGG IT, DUGG, DIGG THIS, Digg graphics, logos, designs, page headers, button icons, scripts, and other service names are the trademarks of Digg Inc.