Home » Guides Beginner Article

JavaScript-Fu: Guidelines for Web 2.0 Mastery

4.0/5.0 (1 votes total)
Rate:

Gianni Milanesi
August 04, 2006


Gianni Milanesi
Copyright © Gianni Milanesi under the Creative Commons Licensing.
Gianni Milanesi has written 1 articles for JavaScriptSearch.
View all articles by Gianni Milanesi...

There are probably as many ways to engage in the practice of JavaScript-Fu as there are individuals. These are but a collection of guidelines taken from the sacred scriptures of Web 2.0. Your method will grow out of being mindful of your practice. In the absence of a teacher these guidelines can serve you well, if you continue to follow them in good faith.

What is JavaScript-Fu

Because JavaScript-Fu is beyond words, and yet because it is our habit to try to convey meanings through words, there are many answers to the question, “What is JavaScript-Fu?” Here are a few:

  • JavaScript-Fu is the apotheosis of JavaScript. JavaScript-Fu is a way of seeing clearly Web 2.0 and what Web 2.0 is, and a way of developing next generation Web applications based on that clear vision.
  • JavaScript-Fu is an area where many people interested in it face much puzzlement and a lot of misunderstanding. This is quite ironical because JavaScript-Fu is actually simple, direct and effective. We can avoid a lot of misunderstanding if we are aware that the term “JavaScript-Fu” has the following four related meanings: 1) unobtrusive and accessible use of JavaScript, 2) thorough knowledge of Web standards, 3) rich yet usable presentational scripting, and 4) clean, readable and thoroughly commented code.
  • True JavaScript-Fu consists of developing quietly in the correct posture. It is not a special way of writing code; it is the normal way of writing code: reusable, accessible, and unobtrusive. JavaScript-Fu means to put the mind at rest and to concentrate on Web standards and Best Practices. It is not knowledge to be grasped by the brain. It is solely a practice, a practice which is the true gate to happiness, peace and a Web 2.0 killer app.

The True Zen of JavaScript-Fu

You may reach a point in your path to JavaScript-Fu Mastery where you feel the need to discover the hidden and most advanced secrets of JavaScript. JavaScript is not only about variables, functions and ready-to-use libraries; the true essence of JavaScript lies in the knowledge and correct usage of information hiding through private and privileged members, closures, object orientation, prototypal inheritance and DOM manipulation, to name a few. As an apprentice you must study JavaScript continuously, because the path to Mastery is never ending.

A university professor went to visit a famous JavaScript-Fu master. While the master quietly served tea, the professor talked about JavaScript-Fu and Web 2.0. The master poured the visitor’s cup to the brim, and then kept pouring. The professor watched the overflowing cup until he could no longer restrain himself. “It’s overfull! No more will go in!” the professor blurted. “You are like this cup,” the master replied, “How can I show you JavaScript-Fu unless you first empty your cup?”

Follow the Path of the Framework to the End

JavaScript-Fu is about discipline, knowledge and wisdom. As an apprentice of JavaScript-Fu, you must learn to understand thoroughly the scriptures of the JavaScript libraries you choose to use. The choices before you are many, but the four sacred libraries are: Prototype/Script.aculo.us, Dojo, MochiKit and Yahoo! UI.

All JavaScript-Fu Masters strongly believe that you should choose a library wisely and follow the path to its understanding to the end, without surrendering to the temptations of new and improved libraries. This practice can help have a clearer vision and a better understanding of your JavaScript skills and the library itself. One too many times I’ve spoken with young apprentices that were so eager to abandon their library of choice for a new one just because another apprentice was using it. You must remember that the fundamental nature of JavaScript-Fu is discipline. Without discipline you can’t become a true JavaScript-Fu Master.

A JavaScript-Fu apprentice approached his teacher with a question. “I’d like to improve my knowledge of JavaScript. In addition to learning from you, I’d like to study with another teacher in order to learn another library. What do you think of this idea?”
“The hunter who chases two rabbits,” answered the master, “catches neither one.”

Practice the Art of Namespacing

Namespacing in its essence is the art of clearly seeing your code as one being. Namespacing is the path to prevent clashing of variable and function names in the jungle of scripts, and is one of the points of the JavaScript-Fu Star of Unobtrusiveness.The way of the Namespace is simple and clear once you learn to understand its true meaning. The following mantra can help you better understand the path you have to follow to reach the Namespace nirvana through the use of Object Literal Namespacing:

var mantra = "My JavaScript-Fu is strong";
function chantMantra(times) {
for (var i = 0; i < times; i++)
alert(mantra);
}
chantMantra(5);

Unenlightened JavaScript Code

var Enlightened = {
mantra: "My JavaScript-Fu is strong",
chantMantra: function(times) {
for (var i = 0; i < times; i++)
alert(mantra);
}
}
Enlightened.chantMantra(5);

Enlightened JavaScript Code

After ten years of apprenticeship, Kenno achieved the rank of JavaScript-Fu teacher. One rainy day, he went to visit the famous master Gan-jin. When he walked in, the master greeted him with a question, “Did you develop your scripts using Aptana?”
“Yes,” Kenno replied.
“Tell me,” the master continued, “did you use self-invoking functions that return object literals to achieve perfect information hiding?”
Kenno did not know the answer, and realized that he had not yet attained full JavaScript-Fu awareness. So he became Gan-jin’s apprentice and studied under him for ten more years.

Don’t Disturb the River Flow

If someone asks what true JavaScript-Fu is, it is not necessary to open your mouth to explain. Show all the aspects of your unobtrusive and accessible JavaScript, and then the spring wind will blow and will open the wonderful plum blossom.
In JavaScript-Fu the dynamic JavaScript layer should be completely separated from the presentational (or markup) layer of ones Web application. This form of enlightment has become commonly named “unobtrusive JavaScript” because only it can guarantee a complete and functional user experience to any and all users.

A Web 2.0 story tells of an old JavaScript developer whose website accidentally got Dugg, Slashdotted, Boing Boinged, Farked, New York Timed, CNNed and Google Newsed leading to a high and dangerous traffic spike. Onlookers feared not only for his web servers, but also for those visitors that weren’t using the latest browsers. Miraculously, all his visitors had a rich and complete user experience, and not even one complained about broken layouts or non-working features. People asked him how he managed to make his Web 2.0 Website so accessible. “I accommodated my code to the markup, not the markup to my code. Without thinking, I allowed my code to be shaped by the already accessible markup. This is how I attained unobtrusive JavaScript.

Awaken to a Common View

The way of coding standards help you clear away extraneous chatter to focus on what really matters. When your mind is clear, you will find it easier to concentrate on what you are doing, and on your JavaScript-Fu. You will be able to meet Web development problems calmly and more energetically. The fundamental purpose for adopting a set of coding standards is to make it easier for developers to read and understand each other’s code. A lot of precious time can be wasted just trying to decipher code that is not easy to understand.

A student went to his JavaScript-Fu teacher and said, “My JavaScript is horrible! It doesnt work on Safari. I feel like its bloated, full of bugs and unreadable. It’s just horrible!”
“It will pass,” the teacher said matter-of-factly.
A week later, the student came back to his teacher. “My JavaScript is wonderful! Its totally cross-browser, so clean, so alive! It’s just wonderful!’
“It will pass,” the teacher replied matter-of-factly.

Learn to Express Your Intent

We can look at the benefits of commenting your code from two levels: the mundane and the supramundane. At the mundane level, practicing the art of code documentation enables us to attain better results in whatever we do! This becomes understandable, when we realize that comments improve the quality of our code.

At the supramundane level, code documentation leads us to the highest attainment we can ever achieve, i.e. JavaScript-Fu Mastery.
Code commenting is an important practice and with the aid of the right tools it can become invaluable.

The JavaScript-Fu master Hakuin used to tell his students about an old woman who owned an Internet point in the village. She was skilled in code documentation, Hakuin said, and her understanding of JavaScript-Fu was superb. Many students wondered about this and went to the village themselves to check her out. Whenever the old woman saw them coming, she could tell immediately whether they had come to surf the Web, or to probe her grasp of JavaScript-Fu. Those wanting to surf the Web she served graciously. For the others wanting to learn about her JavaScript-Fu knowledge, she hid until they approached her door and then attacked them with a fire poker. Only one out of ten managed to escape her beating.


Add commentAdd comment (Comments: 0)  

Advertisement

Partners

Related Resources

Other Resources

arrow