Live data from Hacker News

John Resig annotates original jQuery source code

genius.com

61–70 of 102 posts

Re: John Resig annotates original jQuery source code

#61

What surprises me is the lack of comments in the original file. This leads to e.g.: this._get(i).$$tmpFunc = f; this._get(i).$$tmpFunc(i); this._get(i).$$tmpFunc = null; with the comment (from now): So this may look crazy — it certainly does to me! Why not just do: f.call(this._get(i))? If I remember correctly, and I just did some double-checking and I think this is the case, but IE 5 didn’t support .call()! The orig…

Absolutely agreed - comments are so important! Seemingly when I was working on jQuery alone and without much feedback I was totally fine just having no comments. I noticed that in the subsequent releases of the code that the number of comments quickly rose - likely as people started to use the library I felt bad that the code was so poorly explained!

Re: John Resig annotates original jQuery source code

#63
post #8

I would actually like this in an IDE. Visual Studio kind of does this with header comments but it would be great to be able to show/hide comments with links, rich text,...

Kind of surprised Sublime Text 2 / 3 doesn't have a plugin that allows for annotation.

You might want to check this out: https://srclib.org/plugins/sublimetext/

srclib is the open-source library that powers Sourcegraph, a code search engine.

Re: John Resig annotates original jQuery source code

#64

Earlier quoted context omitted.

This looks like an ad for Genius, though, so that'd be why.

If it's supposed to be an ad for Genius, it's a pretty lousy one, in my opinion. Half of the time I click on a highlighted line, it opens the annotation and then scrolls away, so I can't see it. It's pretty frustrating. And the "view on Genius" link redirects to the top-level Genius.com page, which just makes me sigh and close the window.

Doesn't matter. People will be like "Oh! John Resig uses Genius! Looks like that's actually real software for the cools guys, not some stuff nobody uses."

Usability is optional for that.

Re: John Resig annotates original jQuery source code

#65

What surprises me is the lack of comments in the original file. This leads to e.g.: this._get(i).$$tmpFunc = f; this._get(i).$$tmpFunc(i); this._get(i).$$tmpFunc = null; with the comment (from now): So this may look crazy — it certainly does to me! Why not just do: f.call(this._get(i))? If I remember correctly, and I just did some double-checking and I think this is the case, but IE 5 didn’t support .call()! The orig…

Also with all my respects to mr. Resig, but this is not really code to learn from. It's full of bad habits and it's hard to read. Poorly named, mostly uncommented and pretty hacky.

Not really judging, it was just a bunch of handy hacks he had for personal use.

Another reason it's hard to follow is of course: writing a CSS selector is not a trivial task, and that with all the browser quirks workarounds. I'm sure getting it working properly wasn't a walk in the park.

That said, he often talks about how he wanted to make the code look "cute" by making it as compact as possible and to save weight. Although weigh matters a lot in the web, the source code is a terrible place to optimize. Instead, write readable code, with sensible names, and then compact it with tools.

Re: John Resig annotates original jQuery source code

#66

So glad jQuery came along and became what it is. Scary to think of a world where it was just bundled alongside Prototype. For those not versed in Prototype, those were dark days (at least for me).

I always kind of wished that MooTools had won out in their battle to overtake Prototype's crown. It had a much more sensible namespace, and focused much more on solidly structured code over "how short can I make this".

Re: John Resig annotates original jQuery source code

#68
post #13

Earlier quoted context omitted.

This formatting style for annotated sources always seems to work so well: http://robflaherty.github.io/jquery-annotated-source/docs/01...

Indeed, that side-by-side annotated style is great. For those who would like to create similar pages, the original program is Docco[0], a Javascript project. However it's been ported over to many other languages and can be found in these projects: - Pycco[1] Python - Rocco[2] Ruby - Shocco[3] POSIX Shell - Many more, as found here[4] Note each of these projects support highlighting different languages. For example, t…

I agree, Docco-style docs are really easy to read.

I built srcco, a Docco-style doc generator that links every variable, function, etc. within your project to its definition (similar to sourcegraph.com -- full disclosure: I work at Sourcegraph), to demonstrate how to build things on top of our free/open source language analysis framework, srclib[0].

You might find it interesting (the links in the code have white backgrounds): http://sourcegraph.github.io/srcco/srcco.go.html

It only works for Go because the only Go toolchain keeps track of comment ranges (because srcco removes the comments from the source code), but it wouldn't be too hard to add comment ranges to the other toolchains. If you are interested in language analysis for languages like Java, Python, Haskell, or Javascript, I would be happy to help you make your first contribution. Ping me: samer@sourcegraph.com.

[0] - https://srclib.org/

Re: John Resig annotates original jQuery source code

#69
post #15
post #5

I found myself wishing this was a screencast.

Paul Irish has done a few videos where he walks through some of the jQuery code: http://www.paulirish.com/2010/10-things-i-learned-from-the-j...

I can't believe that article was five years ago already! >.>

Re: John Resig annotates original jQuery source code

#70

Though Resig's anecdotes are fun and interesting to read, it doesn't help that much with understanding the actual source code. Here's a better version in terms of readability and depth: https://robflaherty.github.io/jquery-annotated-source/ https://robflaherty.github.io/jquery-annotated-source/docs/0... Sadly, no longer updated since jQuery 1.6.2 which was released in 2011.

Out of curiosity, do you know of any other ubiquitous projects that have had a similar treatment?

Backbone, Marionette and Underscore all have annotated source like this linked on their project websites.
Post reply on HN