YOUR FEEDBACK
NGASI Releases AppServer Manager 8.1
Dave Jenkins wrote: The remote server management is a welcomed added feature...


2007 West
GOLD SPONSORS:
Active Endpoints
Your SOA Needs BPEL for Orchestration
BEA
Virtualized SOA: Adaptive Infrastructure for Demanding Applications
Nexaweb
Overcoming Bandwidth Challenges with Nexaweb
TIBCO
What is Service Virtualization?
SILVER SPONSORS:
WSO2
Using Web Services Technologies and FOSS Solutions
Click For 2007 East
Event Webcasts

2008 East
PLATINUM SPONSORS:
Appcelerator
Think Fast: Accelerate AJAX Development with Appcelerator
GOLD SPONSORS:
DreamFace Interactive
The Ultimate Framework for Creating Personalized Web 2.0 Mashups
ICEsoft
AJAX and Social Computing for the Enterprise
Kaazing
Enterprise Comet: Real–Time, Real–Time, or Real–Time Web 2.0?
Nexaweb
Now Playing: Desktop Apps in the Browser!
Sun
jMaki as an AJAX Mashup Framework
POWER PANELS:
The Business Value
of RIAs
What Lies Beyond AJAX?
KEYNOTES:
Douglas Crockford
Can We Fix the Web?
Anthony Franco
2008: The Year of the RIA
Click For 2007 Event Webcasts
SYS-CON.TV
TODAY'S TOP SOA & WEBSERVICES LINKS


Alex Iskold's "AJAX Patterns" Series: From Java to JavaScript
"JavaScript and Java Have Little in Common, Except for the First Four Letters"

Digg This!

In the beginning of 2006, Alex Iskold - after spending the last 10 years of his career programming in Java - took off his Java hat and started a Web 2.0 company called adaptiveblue. In this Web 2.0 Journal exclusive, he shares his insights on transitioning from Java into the Web 2.0 development world.

I spent the last 10 years of my career programming in Java. When I first discovered it in 1996, I was instantly enlightened. My life in the C++ box of ambiguities and strange side effects came to an end, and boy, was I relieved! Since then, I lived, breathed and thought exclusively in Java.

There are a few a lessons that Java taught me all that I think are really important. The first lesson is that even complex software can be written in a simple and elegant way. The second lesson is that software development is not just about language, it is also about the libraries. The third lesson was that software engineering, like architecture, is about patterns.

In the beginning of 2006 I took of my Java hat off and started a web 2.0 company called adaptiveblue. In a few weeks I brushed up on my JavaScript, learned PHP and XUL. At first, I found the lack of debugger and everything else that should be part of normal development environment, rather frustrating. But after about one month, I started to like this new world order. I realized that I can get things done really quickly. It felt like... well... It felt like hacking. I knew that it was time to stop and take a deep breath.

Do not hack, engineer!

I do not believe in hacking, I believe in software engineering. While getting things done quickly is rewarding you can not build any serious piece of software by just hacking it together. First you need to understand the problem at hand, then you need to come up with the solution strategy, pick tools, decide on the architecture and plan the execution. In a nutshell, you need to engineer the solution.

More importantly, a 1000 little hacks do not deliver the same value to the consumers as a single integrated, well thought through system. Its cool to see many little web applications that combine X and Y to make Z. But cool and useful are not the same thing. Modern web software needs to leverage burgeoning web services and facilitates intelligent, holistic, consistent end-to-end user experience.

New game, old rules

As a Java engineer coming to the web 2.0 world, you naturally ask: What do I need to do differently? Clearly there is a set of new technologies that needs to be understood and learned. But there are no fundamental differences in how we should approach the software engineering itself. Change in a programming language, tools and environment does not mean the change in patterns and practices of software engineering. While the fans of Python, Perl and PHP, each believe that their language is the best, these languages are basically equally powerful.

To write good software in any language you need to be familiar with tools and standards and you need follow a software development methodology. Good tools make you more productive, while standards help your solution play nice with the other software. But in the end of the day, it is up to you to understand and follow the basic modeling principles, ensure modularity in your system, continuously cleanup and refactor your code and ensure the quality by doing testing.

The beauty of Web 2.0 platform is in its flexibility and the ability to bring together wide range of applications, data and technologies. This beauty and flexibility, however, come with important cost – fragility. Because we are dealing with scripting languages, evolving API and frequent changes, the software that we make is fragile. This is why applying basic software engineering principles is absolutely essential.

Lets take a look at the Web 2.0 development landscape and see what is there to help us get organized. The development practices combined with industry offerings make up our toolbox. Knowing what we have, what we do not have and what to ask for is important for dealing with Web 2.0 dynamic development environment.

No IntelliJavaScript yet...

To start with, we have a problem, because there is no smart IDEA for JavaScript yet. The overall IDE market right now looks sparse. I am not aware of any widely adopted JavaScript IDE at this point. (Please post the IDE that you use in the feedback section of this article). I've seen JSEclipse mentioned a few times and looked at the demo on their we site. It looks promising, but I have not tried it yet.

In the mean time, I still code in IntelliJ, because it supports JavaScript syntax highlighting and does string-based variable/method name completion. But IntelliJ's JavaScript support is not even close to the support this great IDE provides for Java. The lack of a smart IDE is a big blow to our productivity, because JavaScript files can quickly grow long and messy, buggy and unmaintainable.

Refactor, refactor and, if in doubt, refactor again

The solution is to combat the mess and complexity with refactoring. Even if it means doing refactoring via string replace and manually moving pieces of JavaScript around, it is still better than not doing it. Continuously refactoring JavaScript code, making it modular and splitting the responsibilities is your ticket to a healthy system.

It is also necessary to capture core abstractions, separate them into different source files and think about the interfaces that glue them together. This does not mean coding the way we coded in Java. In fact creating classes in JavaScript is not essential. But just like we wrote modular code in C, we need to do the same thing in JavaScript. Unfortunately, lack of refactoring support makes all of these activities much more difficult and error-prone, but they can not be skipped.

Complement/Replace debugging with unit testing

Lack of good IDE also means that there are no good cross-browser debugger. Most Firefox developers use Venkman and for IE there is Microsoft Script Debugger. But often people resort to printf-like debugging, which in JavaScript takes a form of alert popups. This style of debugging can lead to a big waste of your time, since you have to click 'Ok' to close every popup.

Instead, you will be much better off using Unit Testing. Ever since I first encountered JUnit four years ago I am more and more convinced that unit testing is an absolutely essential software development activity. Instead of old-fashioned 'If it ain't broken don't fix it', the modern motto should be 'If it ain't tested it ain't working'. Particularly because software quality is what is going to help you gain validation and customer acceptance in the Web 2.0 world.

There are a few JavaScript unit testing frameworks that are out there. Two of them are called JSUnit because they were developed simultaneously. One can be found here: http://www.edwardh.com/jsunit and another one here: http://jsunit.berlios.de/index.html. Both are similar to JUnit. Another unit testing framework is part of the scrip.aculo.us library.. All of these frameworks allow you to run the tests inside an HTML page. Of course, it would be nice to have the unit testing integrated into the JavaScript IDE.

Use existing libraries, but handle with care...

Now for the good news. There are tons of JavaScript libraries and most of them come with wrappers for AJAX, date functions, animation and DOM manipulation. Unfortunately none of them are standard, so you have to do research and pick the ones you find more appealing. Here are the libraries that receive a lot of attention: prototype, script.aculo.us, rico and dojo. For a good list of libraries, please see this blog.

At adaptiveblue we have been using the library called MochiKit, developed by Bob Ippolito. So far we have no complains and no bugs to report. We choose MochiKit because of its comprehensive documentation and complete set of tests. Reading Bob's comments made us convinced that he really knows and understands JavaScript and that we can trust him and his code.

Trust is no small issue in this case. With Java, we are all safe because Sun is a responsible company that has made a huge commitment to the language, libraries and development community. But with JavaScript the situation is different. Since there are no standard libraries, we have to use the code developed by individual enthusiasts. This begs questions like: How long will this library stick around? Will the bugs be fixed on time? Will the features that I need be added in the next version? These questions are not easy to answer right now. We need to have standard libraries. And it matters less which code we adopt, as long as it becomes the standard.

Patterns

No software engineering discussion would be complete without patterns. Since the famous GoF book, we have been discovering and applying patterns in all of our projects. Patterns form the back bone of any modern software, they ensure correctness and validate the architecture. Web 2.0 environment applications are no exception.

For an excellent, comprehensive overview of the Ajax patterns please visit Ajax Patterns web site. In our daily development work on blueorganizer Firefox extension, we have found the two patterns particularly useful: Singleton and Naming or Interface pattern. Lets take a look at them in turn.

The Singleton pattern, is probably the most well-known pattern. In JavaScript the singleton guarantees that only one object of a particular type is instantiated. However, we typically use singleton for a different reason. We use it to mimic namespaces. The lack of the namespaces in JavaScript can lead to strange side effects, like someone else defining a function with the same name as your function. To minimize the likelihood of this, we define our utility classes as singletons and prefix them with adaptiveblue, accomplishing Java-like namespace behavior. You can find additional information about singleton, as well as example code here.

Since JavaScript is not quite an object-oriented language, there is no concept of an interface built in. This does not mean, however, that you can't code to an interface. Quite the opposite. The interface in JavaScript are simply naming conventions. This is exactly the same as the bean property accessors and modifiers in java beans or naming conventions in EJBs. Using naming conventions to define the interfaces is simple, yet powerful way to introduce OOP style into your JavaScript. For example, imagine a general DOM traversal, which applies the node visitor to every node. The node visitors are simply objects that all have visit( node ) function. Simple naming conventions can get you pretty far.

Conclusion

JavaScript and Java have little in common except for the first four letters. If you are transitioning from Java into Web 2.0 development world it is worth while to familiarize yourself with the tools, standards and vendor API. It is also worth while to map each activity from your Java development process onto the Web 2.0 development world. But once you master the language, the libraries and the tools, it is back to old software development methods. Think interfaces, decoupling, refactoring and testing and
you will be able to build robust AJAX applications.


Don't miss Alex Iskold's blog: http://alexiskold.wordpress.com

About Alex Iskold
Alex Iskold is the Founder and CEO of adaptiveblue (http://www.adaptiveblue.com), where he is developing browser personalization technology. His previous startup, Information Laboratory, created innovative software analysis and visualization tool called Small Worlds. After Information Laboratory was acquired by IBM, Alex worked as the architect of IBM Rational Software Analysis tools. Before starting adaptiveblue, Alex was the Chief Architect at DataSynapse, where he developed GridServer and FabricServer virtualization platforms. He holds M.S. in Computer Science from New York University, where he taught an award-winning software engineering class for undergraduate students. He can be reached at alex.iskold@gmail.com.

Dirk Fokken wrote: You are right Alex. In the twenty years of software development I went through, programming languages and techniques changed many times. What remain are software engineering basics. Even though, engineering styles were changing from procedural to object orientation. Basic patterns decide whether software will be good or not. One of these is simplicity. Systems I met over time that were based on simple structures were fast, reliable and maintainable. Another basic pattern what I call is 1-click-targeting for user interfaces. User interfaces that provide short ways to functions keep users happy and help tremendously in the acceptance of a system. For me, the move to what's called web 2.0 comes surprisingly late. The first purely Javascript based application I have written for a client in 1999. A finan...
read & respond »
Alexandra wrote: "No IntelliJavaScript yet..." ?!?! I can't beleive I'm reading it! One of the widely announced features of IntelliJ IDEA 5.0 was JavaScript support - it provided code completion, formatting, "find usages", structure view, etc. And it was released almost a year ago! In 5.1 release, the JavaScript editor was improved (and again, release was in Febraury, 2006 - almost half a year ago). Now IntelliJ JavaScript editor has refactoring, navigation, on-the-fly error highligting, and other productivity features. They are described here: http://www.jetbrains.com/ idea/features/javascript. html As for AJAX, there is a demo where Ajax page counter is created in 5 minutes with the help of InteliJ IDEA (http://www. jetbrains.com/idea/traini ng/demos/AJAX_demo.html) Even GWT is going to be supported in the nearest future,...
read & respond »
Ted wrote: Nice article. I can appreciate your frustrations and realizations as you made your transition. My company has been migrating all our development efforts to rich web applications, but we took a slightly different approach. We created a Java framework that handles all the browser HTML and JavaScript as well as the client-server communication layer. This allows up to develop rich web applications as if they were desktop Java GUI applications. We recently decided to release it open source under the GPL. You can check it out at http://www.thinwire.com
read & respond »
WEB 2.0 LATEST NEWS
ShoZu Adds Eight New Destinations to Mobile Social Media Service
ShoZu announced that it has expanded its mobile social media service to Photobucket, Dailymotion, Friendster, Twitter and four additional Web 2.0 and Mobile 2.0 communities. With these eight new integrations, ShoZu now enables mobile users to interact with their choice of 36 social net
Oracle Previews Fusion Middleware 11g
Building on its November 2007 preview, Oracle previewed additional planned feature enhancements of Oracle Fusion Middleware 11g. Based on feedback resulting from close cooperation with customers testing in real-world environments, the latest preview of Oracle Fusion Middleware 11g incl
3rd International Virtualization Conference & Expo: Themes & Topics
From Application Virtualization to Xen, a round-up of the virtualization themes & topics being discussed in NYC June 23-24, 2008 by the world-class speaker faculty at the 3rd International Virtualization Conference & Expo being held by SYS-CON Events in The Roosevelt Hotel, in midtown
Infragistics Announces New AJAX Tool
Infragistics announced the availability of Infragistics NetAdvantage for JSF 2008 Volume 1 enabling web developers to leverage the power of JavaServer Faces to create compelling User Interfaces (UI). This new release provides a comprehensive package of AJAX-enabled JSF UI components fo
Gluecode Creator Thinks He Can Take Google's App Engine
A Philippines-based Web 2.0 start-up called Morph Labs thinks its cloud can rain on Google's newfangled App Engine. Morph Labs was founded by Winston Damarillo, the guy who did Gluecode, the only open source company IBM ever bought, a move made to protect its precious WebSphere franchi
SUBSCRIBE TO THE WORLD'S MOST POWERFUL NEWSLETTERS
SUBSCRIBE TO OUR RSS FEEDS & GET YOUR SYS-CON NEWS LIVE!
Click to Add our RSS Feeds to the Service of Your Choice:
Google Reader or Homepage Add to My Yahoo! Subscribe with Bloglines Subscribe in NewsGator Online
myFeedster Add to My AOL Subscribe in Rojo Add 'Hugg' to Newsburst from CNET News.com Kinja Digest View Additional SYS-CON Feeds
Publish Your Article! Please send it to editorial(at)sys-con.com!

Advertise on this site! Contact advertising(at)sys-con.com! 201 802-3021

SYS-CON FEATURED WHITEPAPERS

ADS BY GOOGLE