A very smart practice in coding is to test if the function will have the ability to perform in a particular browser. This is especially true in Ajax-based websites as developers have to face constant browser incompatibilities. Objects could easily be a problem when everything is in place for a particular browser but it will just falter since development of the program has not considered other browsers.

Developers will have to use a code something like this:

if ( document.evaluate ) {}

This small value tries to evaluate the function against the browser. Each function is tested with this value which means some parts of the websites may not be tested. If the function is not tested, the function will still go through as long as the browser is compatible with it. Basically, the value is just there to evaluate if the function works in the browser and offer options if the browser will not be possible. This value could even be built in the coding as a function. The coding could also go for the whole webpage through this function:

if ( document.all ) {}

Problem will start to creep in when you start using the latter function. if ( document.all ) will evaluate every function of the coding and see if its compatible with the intended browser. But aside from evaluation, this code is an active function that fills in anything that is not there. This is especially true when you are using a library to develop your application. Automatically, anything that is not in the browser will be supplied by the library. For example, when you are running an application in Opera and the .getElementsByClassName is not there, the document.all will look for the function in the library and install it in the code so that the browser could read the code.

This problem only occurs in non-IE browsers only. The function document.all has the ability to check the function in IE only but on other browser like Opera, document.all could trigger fetching of function in the library to make it work.

This behavior poses an obvious problem to security. Since document.all extracts all the possible functions that are lacking in the browser, it might fetch very sensitive information. If a website is rendered this way, hackers could easily access all possible information. The information might not be displayed on the browser but it has virtually opened itself up for possible hackers.

The function document.all is very easy to implement but could have dire consequences to your Ajax-based application. As always being patient with the coding is one of the key steps to security. The library may have everything that you need but of course your interaction with the library will reveal sensitive information about the application. As much as possible use a smaller function so that this problem will never happen. When you point out a specific function for evaluation, you know which function is evaluated. This prevents from other functions from the library to be extracted and executed for security purposes.

Posted by MixedSoup | No Comments »

If you are starting out in your first Ajax based program, one of the biggest challenges that you have to face is to let your users remember not to hit the back button. Most of the time, Ajax based programs does not like the back button.

Unfortunately, Ajax does not have that functionality in bookmarking the previous page so that it could be reloaded anytime. With this development or some call it a disability; it is quite clear that today’s browsers were built without thinking of the possibility that a back might be extinct one day. It also goes to show that Ajax is way bigger than browsers and Ajax will definitely be going out of the browser one day.

Before we realize those realities, we have to acknowledge the fact that there is still a back button. The functionality of browser will be incomplete without a back button.

Back button function is a very efficient tool for everyone without which we might end up doing the same process all over again instead of just hitting back button to repeat the procedure. A back button should be implemented even in an Ajax based application.

It may sound like a complicated answer to the problem. But the only complication you would face in enabling the back button of your Ajax based application is developing this function for both Mozilla and IE web browser. Each of these browsers have their own configuration so that the back button could be used at any time.

Mozilla:

The first step in enabling the back button is to build a PageLocator function. This code will practically tell the browser where to go. If the webpage is built on different frames, the developer should specify the actual action to perform on previous action of the browser.

However, this code will practically let you go back to the previous webpage but will nevertheless reload. In a regular web-page such as an HTML based site, you can easily go back to the webpage especially the last state of the page before you left. Page locator will just let you go back and it is just like writing the link again in another browser.

To answer this, you have to add another function called setContent. But it does not end there, you have to add # in the parameters so that you will be exactly at where had to go and preserve the last state.

Internet Explorer:

On the other hand, IE needs a little different configuration compared to the Mozilla. In this account, it is highly recommended to use Dojo toolkit as they have a library that offers an easy functionality for an Ajax based function. The back button in this toolkit could be easily used.

Basically this library uses a lot of iFrame so that the webpage and state will be specified. Instead of using # for a more specified function, developers target .src and the load the webpage with the previous state. It is also necessary that a querystring be added that practically imitates the hash functionality.

Posted by MixedSoup | No Comments »

A regular website could easily cache the page’s information. The whole webpage is saved in the temporary folder so that it could be accessed faster the next time user visits the particular page. Unfortunately, this concept is only applied to HTML and other websites where the whole webpage is refreshed whenever something new is added.

Ajax on the other hand, refreshes only part of the page so the natural caching behavior is not applied as it does not detect any general changes on the webpage.

But there is actually a trick on how you can build a caching mechanism in your webpage. To understand this better, we go back to the basic operation of Ajax. Communication that enables changes on a specific part of the webpage requires the URL and the arrays which serve as a target for changes. You can use these elements as an array index that will serve as cached information. Regular caching procedures will follow – your computer will save the information in the temporary folder.

The next time you visit the webpage, instead of requesting the server for the page, you can compare the requested information with the cached data. Of course you have to add “if” function for the system to check the cached information first before proceeding to the server.

Problem comes in when too much information is requested. Even with a strong computer, it is only possible to store a small amount of information. When the temporary folder is “clogged” with temporary information from a particular website, the webpage and the whole browser will slow down and eventually stop functioning because of too much cached information.

To combat that problem an algorithm has to be established. You can use any function you want but while I was browsing through many options, I bumped into the Least Recently Used (LRU). This type of algorithm does exactly what it says in its name: it recognizes the least used cached and automatically deletes them as soon as new information comes in.

But another solution is to increase the cache size. Normally you will have at 5MB of cached information. Just like any HTML based websites you can, easily increase this through a command. The downside of this is your website might run slower that expected because of too much cached information.

Your website will spend too much time checking if there are any matches in the cached section. If you cannot run away from a bigger cache size, consider doubling the link of each cache. Every cache will have forward links as well as backward links. Through this technique which is also called the doubly linked list, you can minimize the temporary stored information.

Caching in Ajax is possible. We had to struggle a little bit in this situation because of browser problem especially on IE but we have found a simple and efficient solution for that. Now, we just have to control the influx of temporary information so that our Ajax based websites will work as efficiently planned.

Posted by MixedSoup | 1 Comment »

RIA (Rich Internet Applications) is highly demanded nowadays. We have to admit that we’re not just content with simple information online. We’re looking for better interaction, faster response, and smarter browsers and programs that could virtually do everything. Various programs have been created to cater to these needs. Just in time for these demands, Ajax has been developed ensuring better interaction and the ability to create a good program without having to rely on bandwidth for data transmission.

Ajax and RIA has been seen to work together however, it’s not necessary that Ajax has to be used for an RIA application. RIA on the other hand doesn’t have to rely on Ajax to create a good application.

So where do you draw the line and what cases should you forget about RIA and concentrate on Ajax? We take a look at some of the situations where an RIA is not necessarily an Ajax based application.

1. Office Applications – Creating simple programs for office applications should always be limited to Ajax but not necessarily an RIA. One great example of office productivity is e-mail. Take for example, Yahoo Mail and Gmail. The latest version of Yahoo Mail has emulated the outlook powered by Adobe AIR while Gmail has used GWT (Google Web Tookit) to develop their e-mail. Since Gmail has limited the information to e-mail without other advertisements and links, it has fared well compared to Yahoo Mail.

2. Online Collaboration Tools – Although office applications is very important to be highly interactive. A great example of this program is the Zoho collaborative tool. You’ll be able to use so many tools to get people to interact with one another. Ajax is used in this project in real time bases but speed is not just the important part, tools is as important with this tools.

As you can see, Ajax is needed in simple programs that rely on speed rather than function while RIA relies on the things that you can do with the program aside from speed of the application. It’s correct to think that Ajax could actually be an add-on to an RIA. However, you have to consider that Ajax also has the ability to create an RIA on its own without using programs that can render RIA (Such as JavaFX and Adobe AIR) without using a single code from Ajax.

Developers are now faced with this challenge: how to render a good looking Ajax without overdoing it. Without experience, developers could still develop a strong Ajax based program but the end result is a program full of functions but has greatly compromised in speed. On the other hand RIA could be rendered with so many flashy functions but has actually forgotten about the essential function or will also slow down the operation of the program.

Balance in RIA and Ajax should be observed. As they go hand in hand, each program should complement each other. A great program doesn’t have to be really flashy; a great program should only answer to the need of the user and exceed them with speed and ease of usage.

Posted by MixedSoup | No Comments »

Time and time again, developers are at awe on any Ajax based website. It’s complexity that matches its efficiency has made the developers and web owners to scramble for knowledge to develop this technique to this hottest web coding today. Although other codes have been thriving, none of them could be compared to JavaScript and the mark-up language XML – the main components of Ajax.

Fortunately, there are individuals who are already proficient in JavaScript long before it even become integrated to Ajax. Because of this, they were able to move ahead of figuring out how Ajax can be built in a simpler manner. Frameworks after frameworks have been released along with the battery of libraries that provide pre-built functions to developers. All the developers need to do is to change some things in the current library.

But that does not mean building an Ajax based website and application is easier in itself. Even with the framework, it is still complicated and could not be handled by any starting developer.

On the other hand, if you are rearing to try your hands to develop an application in tune with today’s hottest development technique here are the simple steps in developing an Ajax based application:

Select the right framework – Let’s face it, you need a framework to build and application. Do not think that the set of libraries will diminish your creativity. There are already hundreds of frameworks out there and each of them has so many functions that most of them might not be even used. There are also frameworks that will help you develop an Ajax based application that do not even require knowledge of JavaScript. Personally, you might end up with a server side if you do not know JavaScript as most of the non-JavaScript frameworks are on that side.

Never overdo the framework – Keep it simple. There are so many functionalities out there and they might have “special considerations” especially for browser compatibility. There are lots of frameworks that could have cross browser so you will not have to stick to one framework and look for answers so that it could be compatible to different browsers. The libraries are already made so you just have to stick to the plane and customize only according to looks.

Not everything should be Ajaxed – Ajax is a very fascinating development technology but it does not have to be used in every part of the webpage. As of this writing, Google’s web crawlers for recognizing web content are not that optimized yet for Ajax. Leave some parts for HTML and meta-tags so that your website will somehow be recognized by web crawlers and be provided with the appropriate ranking.

Test your code – Never, never let your application go without testing it. As of today, there are applications that have been built to test Ajax based website. Some of it could come with a fee to ensure that the application works as planned.

These are only four steps to an Ajax based application. It stresses the importance of using a framework as this provides stability and reusability of the application. Use them and test the so that your application works as planned.

Posted by MixedSoup | No Comments »