Saleh Blog

A problem I was facing recently, that the JSON was being receive properly on Firefox 3.6 my work development machine. Finished the project and deployed it. I haven’t tested it on other machines, how clever am I?! I opened my laptop to see how it would appear on other browsers, and shockingly, it wasn’t working at all!

After spending hours trying to locate the line where the error occurs and find out what’s the problem it turned out that I have to decode the JSON output before sending it. I wasn’t using any PHP built-in functionality for JSON, that’s because at work, we are still using PHP4 which has none. I was basically writing the JSON output explicitly. The text output can contain some special characters that need to be encoded and escaped before sending it. After digging around a bit I found out a solution from this post. Everything is pretty much explained there.

In a nutshell, you’ll have to use json_encode() to encode the data from an array and then output it. A JSON library is provided along with that post. There is also a decoding function, but I haven’t use it since I’m receiving my data on a javascript.

While doing my daily shifts in the World Wide Web and buzzering out of world class music with my surrounding sound system dancing all around my desk, I cracked out of my seat – again while still in music mood – with great news from Google jumping of my screen. That thing that came out my screen, that tiny little piece of text, that title is “Google Releases Language Translation API”.

The language API supports many languages such as Arabic, Chinese, France, Russian, and Korean and of course English. As clearly as their announcement is, it support 12 languages and cover 29 translation pairs and it is extremely easy to use for programmers.

For more information on how to use the API, you can check out the official documentation here. Be advised, it is made for Javascripters.

I found this great source of tutorials for anyone who’d like to learn a new JavaScript and Ajax framework. RoseIndia has a whole section in its web site just for Dojo Tutorial. A great free way to learn Ajax with step by step tutorials but you must have some knowledge in using JavaScript.

Ajaxian‘s Ajax survey shows that Prototype is the most used framework for Javascript and Ajax. That’s really shocking, or at least for me, I never though Prototype is that famous. But still, Dojo is my favorite 🙂

After being in beta like forever, Dojo 1.0 is out in full release. Dojo is one of the famous JavaSript libraries out there. It is an open source project and has been developed by many talented programmers. Ajax lovers will love this library for all the functionality it provides for developers and how easy life can be when developing with JavaScript.

Here are some features of Dojo 1.0:
Accessibility including keyboard navigation, low vision support, and ARIA markup for assistive technologies
High performance grid widget supporting 100,000+ rows of data
Browser-native 2-D and 3-D charting
A full library of easy-to-use, attractive UI controls
Universal data access for simple and fast data-driven widget development
Internationalization with localizations provided for 13 major languages
CSS-driven themes to make customization and extension simple
Dojo Offline, based on Google Gears, which makes offline applications easy to build
Support for the OpenAjax Alliance Hub 1.0 to guarantee interoperability with other toolkits
Native 2-D and 3-D vector graphics drawing
Access to many more widgets and extensions through the Dojo package system

Thomas Hansen‘s new vlog tutorial on creating Ajax chat application. Here is the post

Need to know more about Ajax?
Want an example on using Ajax? (using ColdFusion)
If yes, then here is the article in Ajax World Magazine.

I also posted a few weeks ago about ajax here.

Introduction

I decided to write about Ajax because so many people don’t know anything about it. Most of them never heard about it. At least that’s what I find when asking my colleagues and friends in Kuwait University even computer engineering students. The buzzword “Ajax” seems to be a strange word around our community. I wonder if even “Web 2.0” or “Mash-up” is known among computer engineering students here?

If you have been one of the users of the internet for many years, you have noticed the tremendous improvement in web experience. From static ugly looking web pages to fully dynamic web pages with rich user experience and social contribution wikis. From a fully static text web pages to highly user friendly drag and drop web applications.

There are many ways to create RIAs (Rich Internet Application). The most two common methods are JavaScript (with Ajax technique) and Adobe Flash. Those two methods have played a tremendous part in shaping the way the web can be used interactively in modern website. Recently Microsoft announced SilverLight as a new development tool to create RIA which aims to compete with Ajax and Flash.

What is Ajax?

Ajax is the acronym for Asynchronous JavaScript and XML. It is based on an XML DOM (Document Object Model) which is an XMLHTTPRequest object, and it is supported by almost all browsers lately. “Ajax isn’t a technology. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways.”(1). It is not a new technique; it has been used before the term was introduced, but only recently it gained popularity. In fact, XMLHttpRequest (XHR) has been used since 1999 when Internet Explorer 5 released.

Why Ajax?

• Less Resource Consumption
The main advantage of Ajax is less resource consumption on the server side. That’s right; you don’t have to load the whole page every time a user clicks on a link. Let’s take Gmail for instance, when you click on one of the links on the menu, it does not reload the whole page. Only part of the page will be reloaded. That’s called “Call on demand”, and it means it only loads what needs to be changed on the webpage. That’s how Google saves bandwidth, by sending less data to users when navigating, and also saves CPU, RAM, and many other resources. Therefore, Google will pay less for providing its email service to users which means that Google will economically gain more profit with their system.

• Faster Browsing
Browsing the website is much faster and less tedious since you are loading only part of the page that is needed to be loaded rather than loading the whole page. It is a big advantage for companies that rely on users to browse their websites to boom their business. The faster the website is loading, the more the user will be comfortable browsing it.

• A Web 2.0 Standard
Ajax is a web 2.0 key component which was defined by O’Reilly. Using it is a big plus. Many companies hire web designers just because they are familiar with web 2.0 standards like Facebook and Flicker. After all, web 2.0 is business hype.
Ajax developers get paid more than non-Ajax developers. Few days ago from the time I write this article, a principal USA Department of Defense agency was looking for Ajax developer, offering salary of $200K a year with no taxes. That’s around $16,500 (5000 K.D) a month.

• Cross Browser and Cross Platform
Ajax works on all servers, even the simplest one. All you need is a server that can show/run html web pages. Ajax can work on your local computer by just opening the webpage file!

Ajax also works with many browsers despite of some inconsistency among popular browsers because Ajax is based on open standards.

• Competes Flash/Flex
I really love Flash ever since Flash 4. But I have to admit it, Ajax in many situations, is much better. Can flash run without plug-in? Hell no! And Ajax in many cases produces a smaller size files than Flash and sometimes runs faster than Flash.

• Compatible with many programming languages
Ajax is compatible with any server-side language such as PHP, ASP, Ruby, Perl and so forth. Heck, Ajax can even work with Adobe Flash/Flex effectively by a JavaScript bridging tool provided by Adobe lately.

and Disadvantages
At the same time, there are number of disadvantage to Ajax. One is that Ajax is based on open standards. That means browsers can freely change how XMLHttpRequest works. But that can be easily overcome by a method commonly used by developers. Some consider open standards as an advantage because it is supported by many browsers and there is no vendor lock-in or monopolizing.

Another disadvantage is the integration with the browser; the common ‘back’ button problem with Ajax and bookmark problem. Making XHR request does not modify the history stack of your browser. Therefore, the ‘back’ button will have some issue and bookmarking the page will not work properly.

Conclusion
There are many advantages and disadvantages for Ajax. Ajax is neither perfect nor bad to be used as a web application. It has gained popularity among top websites and the industry seems to be agreed on using Ajax, no doubt it fueled the web 2.0 movement. Ajax has become a phenomenon that shaped the web and made the internet a happier place. JavaScript 2.0 is being developed by the time I am writing this article, we are looking forward to see what will happen to Ajax when JavaScript 2.0 is out.

(1) by Jesse James Garrett of web design firm Adaptive Path

Resources:
http://en.wikipedia.org/wiki/Ajax_(programming)
http://en.wikipedia.org/wiki/ECMAScript
http://www.adaptivepath.com/publications/essays/archives/000385.php
Foundations of Ajax, by Ryan Asleson and Nathaniel T. Schutta. Apress.
Ajax in Action, by DAVE CRANE and ERIC PASCARELLO. Manning.
Ajax for Web Application Developers , By Kris Hadlock. Sams.
Ajax for Dummies, by Steve Holzner. Wiley.