

JQuery deconstructed - syaz1
http://www.keyframesandcode.com/resources/javascript/jQuery/deconstructed/

======
madair
I was hoping for an article on the deeper semiotic meaning of why programmers
and which ones with what experiences were drawn to the ideas of jQuery when
they were. That's an interesting topic for any programming language that
achieves success and the micro intellectual developments that they represent,
SQL v NoSQL for instance, and other pendulum swings.

Problem is those always erupt into flame wars, people don't like being
deconstructed, I wish it wasn't so hard, self awareness is a good thing, even
if the deconstruction is a leaky abstraction as generalizations are.

Then again, we do have Yegge ;-)

~~~
dugmartin
Yes, I too was deeply disappointed. I believe you could do an entire PhD
dissertation of deconstruction of the semitoic meaning of why j is lower case
in jQuery. Is it symbolic of humankind's struggle against our basic instinct
to organically generate hierarchical structures to subvert understanding of
true meaning?

~~~
billybob
Hilarious. :) I hope that's how you meant it.

------
fforw
There's another way to deconstruct jQuery, which is often overlooked by
people.

jQuery's design, in large parts mirrors the needs
<http://en.wikipedia.org/wiki/Progressive_enhancement>. Once you reached
enlightenment / chose progressive enhancement as your client development
methodology, all javascript code boils down to two phases:

\- find the points in the document to enhance \- transform those DOM elements
into javascript enabled awesomeness

Which is exactly what jQuery does.

------
pak
I still long for the old <http://docs.jquery.com> from the 1.3.x days. The new
site that actually serves all the material, api.jquery.com, feels like exactly
that--an API reference--while the old format was much more browsable. Instead
of just alphabetical lists of methods you got a fuller explanation of what
each function did, and the methods in each section were organized by _purpose_
with surrounding explanations, not as a sterile alphabetical list. A world of
difference to the newcomer. Had the docs been the way they are now, I'm not
sure I would have been so happy to read them and get started.

~~~
jeresig
I've read your comment a couple times now but I'm struggling to think of an
example that hasn't improved with the new layout. Not only does the new layout
include a much more in-depth listing of properties and methods but it also has
a much more dynamic categorization system. Perhaps you missed all the
categories available on the sidebar of the site?

For example, all the method and properties relating to events:
<http://api.jquery.com/category/events/>

Detailed explanation and categorization of the event object properties:
<http://api.jquery.com/category/events/event-object/>

We studied how users were interacting with the jQuery documentation and
overwhelmingly they were ignoring (and out-and-out confused by) the
categorization and going straight to Google - because they wanted to find
methods by name or functionality. For this reason we improved our search
functionality and made the URLs super-intuitive (.html() is now just
<http://api.jquery.com/html>, for example).

Note that the rest of the "old" documentation is still in place - this
includes all the tutorials and other getting started guides - the only thing
that was "moved" was the API documentation. Undeniably the browsability of the
API docs has improved with this revision.

~~~
pak
You're right in that the old docs had really bad searching. That's much
improved in the new docs.

I might be different. I came to learn jQuery through the raw docs, not through
tutorials, and found that the old docs' organization was more friendly for
casual browsing & exploration, and the new is more amenable to API lookup ("I
already know the name of the method").

For example, compare the selectors page:

New: <http://api.jquery.com/category/selectors/>

Old:
[http://web.archive.org/web/20080516171346/docs.jquery.com/Se...](http://web.archive.org/web/20080516171346/docs.jquery.com/Selectors)

(The CSS is very broken on the archive--) but you can see that you used to
have it organized functionally, not alphabetically, which was great for me as
a learner to see at a glance the different axes of capability for jQuery's
selector engine, instead of a alphabetical mash of selector operators, some
titled by the operator, others by a description. If I didn't already know CSS
thoroughly, reading your selector operator list now would be very
disorienting.

I have to say jQuery and its community is amazing, without it QuickFuse
(<http://quickfuseapps.com>) would not have been possible. But one of its
strengths was being able to be grokked so quickly by newcomers, and I was a
bit disheartened to see the docs stray away from a introductory format more in
favor of a reference format. It's a bit more intimidating to the newcomer to
have to wade through categorical tagged lists of methods with brief
descriptions, instead of a human-organized page on each aspect of the jQuery
object that presents the methods in a sensible order.

------
Kilimanjaro
I like the idea, but...the goggles they do nothing!

Try removing the background colors and leave it b&w or gray shades.

And add a collapse/expand per sections.

~~~
code_duck
Gark, after reading this comments I was scared to click.

My screen is bright... I'm still blinking. The apprehension was justified, the
warnings were valid and sadly were not heeded.

Anyone want to rig up a quick alternate CSS we can apply with greasemonkey? Or
are those horrible things images?

ps. shade 3 welding goggles would do the trick

~~~
davestewart
OK, OK! This is Dave, I made the app.

I get the picture. I honestly didn't expect it to get the attention it's
gotten.

If any of you want to play with some CSS colors, or do a PhotoShop mockup, I
will happily provide an alternative color dropdown.

I guess I have my monitor set to a reasonably low contrast, so I'm not blinded
by looking at it.

:D

------
thinker
Neat idea but would love a more subdued pastel color palette

------
vijaydev
good concept! but the colors are bad on eyes!

------
SkyMarshal
Nice idea, bookmarked.

Observation: there's alot of dead space in the middle and right of all the
blocks. If there's nothing useful to put there, it might be worth considering
a different, more compact graphic layout.

The InfoVis and ProtoVis libraries, among others, may have better layouts for
this data:

<http://thejit.org/demos/>

<http://vis.stanford.edu/protovis/>

~~~
davestewart
Nice links!

Agreed about the amount of space used up when the blocks are closed, but once
you've clicked a few to view the internal code, it's not such a big deal.

Perhaps someone else would like to take up the challenge of make the jQuery
code navigable by treemap!?

------
davestewart
OK... jQuery Deconstructed now has 3 colour options: Colourful, Pastel and
Grey :)

