jQuery: It’s a beautiful framework

June 27, 2009 § Leave a comment

I’ve been using jQuery for more than 4 months now, and I love it more and more.

Through out my career I went through Prototype + Scriptaculous, brief Mochikit, MooTools, and now jQuery. But this post is not about jQuery is super awesome and other framework sucks. It’s about why I really like jQuery so much.

jQuery helps me understand Javascript.

Even though I’ve been doing web development for a while, I felt like there were still holes in my brain about javascript. There were a lot of non-obvious little things like:

  • What callback function takes as arguments. (inside AJAX its data; Inside element it could be element or event; etc.)
  • Functions Scope. (I didn’t realize that, because of function is first-class, javascript scoping is similar to Python)
  • What unobtrusive truly means. (If the web app lost functionalities when javascript is turned off, then its obtrusive)
  • What is the best practice for binding/unbinding events.

Because I didn’t have above (basic) questions answered, it’s hard for me to appreciate framework(s) that monkey-patch global objects. That’s the same reason it took a while for me to get used to Rails.

jQuery solves my complains about Javascript

Javascript language is truly verbose, akin to java. IMHO, verbosity really kills scripting language, especially while typing in interactive console.

I can only type so much of these (example):

var domElem = document.getElementsByName(‘someClassName’);

for( var i in domElem ) { console.log(domElem.class) }

In jQuery, it becomes:

$(“.someClassName”).each( function(i) { console.log(i.class) })

Such conciseness is why I like Python and Ruby and jQuery. Shorter code allows me to see what truly important.

jQuery makes being unobtrusive Easy

ready(), click(), bind(), unbind(), and more truly makes being unobtrusive super easy.

I can achieve unobtrusiveness by placing javascript logic at the end of base view/template file (Example):

<script>

$(document).ready(function() {

$(“.someDomClass”).click(function(e) {

// Do some stuff

e.preventDefault();

})

})

</script>

Above technique is common place now, but jQuery makes it concise and easier to debug.

Conclusion: jQuery is awesome and worthwhile investment, for my career and for fun.

Javascript on Firefox 3 Slice Bug

April 5, 2009 § 3 Comments

See the code below:

container = ['localhost:8080', 'aaaaaaaaa', 'history']
for(var i in container)
{
console.log(container[i]);
console.log(container.slice(0,i+1));
}

The Firebug output is below:

localhost:8080
["localhost:8080"]
aaaaaaaaa
["localhost:8080", "aaaaaaaaa", "history"]
history
["localhost:8080", "aaaaaaaaa", "history"]

Notice the problem there? When i == 1, why slice() output is not:
["localhost:8080", "aaaaaaaaa"] ??????

I cannot explain why this is happening and yes… I have refreshed my browser multiple times.

Reference:

Mozilla Developer Center :: Slice

SquirrelFish Extreme: WebKit’s new Javascript Engine

September 19, 2008 § Leave a comment

On September 18th, 2008, the WebKit team announce SquirrelFish Extreme(SFX), their next generation javascript engine.

Based on SunSpider benchmark, SFX is 35% faster than V8, Google Chrome’s glorified javascript engine. See below:

 

 

References:

Javascript Shells

September 13, 2008 § Leave a comment

For those developing Javascript, It helps a bunch to have javascript shell/console. For other browsers besides Firefox, you can use these:

Now I know why I like Mochikit

July 24, 2008 § Leave a comment

Before, I really don’t care much about Javascript frameworks. They all do kind of the same thing and they all works.

Well, Prototype + Scriptaculous are serious pain in the neck, but I’ve moved on. I guess many Javascript developers have moved on from those two as well.

I still like Mootools. Their website is always so sexy, and the documentation is always clear. (+ 654768864 points for Mootools)

But I now know why I like Mochikit better:

“Mochikit does not mess with Base Object properties.”

Mochikit is simply a library of useful functions. Functions that make Javascript development more pleasant, and I like that.

Side Notes:

  • I never used Dojo, so I don’t know anything about them. That being said, Dojo is massive! 4.1 Mb of tar.gz file.
  • GWT doesn’t count in my preference list, because it’s a JAVA library that writes Javascript. Not my cup of tea.

References:

Javascript: Array.sort()

February 20, 2008 § Leave a comment

What is it?

It is a global function that’s a built-in of Array object.

Syntax:

Array.sort(comparisonFunction);

How to use sort():

  • If sort function is being used without comparisonFunction parameter, the values inside array will first be converted into string, and sorted lexically.
  • If sort function is used with comparisonFunction, it must return either 1, 0, or -1 depending on the comparison.

Here is a sample of comparisonFunction:

function compare(a, b)

{

if ( a < b ) { return -1; }

else if ( a > b ) { return 1; }

else () { return 0; }

}

Reference:

http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Array:sort

Flickr Backend

January 30, 2008 § Leave a comment

Early Flickr:

Flickr Architecture:

Where Am I?

You are currently browsing the javascript category at RAPD.