ColdFusion 10 features

ColdFusion 10, the next major release of the Adobe Programming language is almost ready for prime time and they have recently released some articles to explain all the new features the language will support.


The next version has greatly improved support for HTML5 related technologies, such as web sockets, next it now generates charts using JavaScript (instead of Flash - but this is still a fallback mode if needed) and it also adds support for closures. You can look at the videos here and here for some quick demos.


Finally, a change under the hood has been made to make ColdFusion more mainstream, it now uses the Apache Tomcat Web Server, instead of antiquated JRun Server, which it had been using for many years now. A short video regarding ColdFusion and Java changes can be viewed here.

Page caching and the HTML5 onPageShow window event

Just last week I was confronted with a problem that occurred only in Firefox. This is rare, since Firefox is very good at implementing HTML/CSS/JavaScript standards. Basically what I had was a report criteria page being displayed to a user and then once he hit the submit button, we pop-up a JavaScript overlay saying "Processing...". Thing is, if the user hits the browser's "Back" button (yes that horrible button), the overlay was remaining, even thought in the window onLoad event we were telling the overlay to unload itself.

I believe the problem starting with a recent version of Firefox where the browser implemented page caching. Subsequently, when the "Back" button is hit, the page is loaded from the cache and the onLoad event is not fired again. So our code to unload the overlay was not being executed.

The solution as I found it, is that in this scenario, Firefox is firing the onPageShow event, giving us a chance to do our clean up work. So we basically added the following line of code in the window onLoad event handler:

$(window).bind( "pageshow", function() { $.unblockUI(); } ); 

We still left the old code there so that it works for other browsers and older versions of Firefox.

More info on Adobe Shadow

In my last post I spoke about Adobe Shadow, their new tool for test web applications on various mobile devices concurrently. Since then, Adobe has posted a couple of short videos displaying the capabilities of Adobe Shadow. So what are you waiting for, click on the links below to check them out!

• Shadow Intro
• Remote Inspection

Adobe releases Shadow beta

In this mobile crazy world we work and live in today, as web application developers one of the hardest things to do is testing. With all the various devices and all the various screen sizes, testing your web application to make sure it looks and works properly in various permutations can be a difficult thing.

Enter Adobe Shadow, an inspection and preview tool. Here is how it works. You link a device (phone, tablet) to your main computer and then as you browse your web site on your main computer, the same web site automatically appears on your linked device(s). Furthermore you can remotely inspect the DOM and CSS from the web browser of the device, make on-the-fly changes and see them take effect in real-time. This is a great way to do testing across different devices and get your web application just right. Check out the quick tutorial video to learn more!

Using Flex SDK with Intellij

A long time ago, I use to use JetBrain's Intellij IDE for all my Java development. But since then I have mostly used Eclipse to do so. But with all my HTML/JavaScript/CSS development lately I have been looking for a good IDE for such development so I am considering going back to Intellij in the neat future.

And actually, Intellij has supported Flex very well for long time, so that's a good thing as well. And now that Adobe has donated Flex to Apache, you might be inclined to download the open source SDK and play with it. And if you are thinking of doing so, there is a very nice demo of how to do so right here.

HTML5 Local Storage vs Session Storage

Some new features in HTML5 are really useful, like Web Storage, but you have to make sure you understand how it works and make sure you use it in the correct scenarios. There are actually two ways that HTML 5 Web Storage works: local and session storage. I ended causing some end-user confusion by using local storage all the time, so here is breakdown of how both work and when they should be used.

Local Storage

When using window.localStorage, the data associated to this object will never expire. So long as you don't uninstall your browser (or forcefully delete the data), the data held within this object will remain forever.

So a good example of using localStorage is when you have a web application where you create data and want to remember the last country selected, so the user doesn't always have to re-select it. So write your JavaScript code to remember the last country used and then retrieve it the next time the user comes to the page to preset the last selected country.

Session Storage

When using window.sessionStorage, this data will only be retained for a browser session. Meaning that once the user closes the browser instance, the data is gone.

This is useful when you have a search page and want to always retain and show the last criteria entered by the user. But once the user closes the browser, you want the data to be gone, so when he or she re-enters your application the next time, they start with a fresh page.

New Apache Flex Logo

With Apache now taking over the Flex SDK, one of the first order of business was to get a logo for the project. They did creating a contest and allowing people to submit their own creations. Well as of January 26th (yes I know I am late in posting this), a winning logo was voted upon and you see it here or in animated fashion here.

I think the logo is nice and I am eager to see how the future pans out with all the changes being made this year. Anyways, time will tell, in the meantime you can visit the official Apache Flex website here.