« October 2007 | Main | December 2007 »

November 2007 Archives

November 1, 2007

Who is replacing the web?

These days a lot of posts have been made around a new technology by Mozilla: Prism.
Prism has been announced on Mozilla Labs as an experiment that tries to create desktop-based applications using web technologies.
Prism allows you to create shortcuts on desktop or start menu to your favorite web applications.
These applications will start in their own window without the Firefox chrome,
that is you will not see back and forward button or a file menu anymore, just the normal desktop window with the web application.
You can say there is nothing exciting; yes, i agree, but you should notice the potential behind the technology.
Mozilla developers are planning to include local data storage, 3D capabilities and more, moving web application closer to desktop application;
Prism is built on Firefox, so it supports all the technologies like HTML, JavaScript, CSS supported by the browser itself. By now there is only a Windows build; Mac OS X and Linux builds are coming.

According to the post in Mozilla Labs:

"Unlike Adobe AIR and Microsoft Silverlight, we’re not building a proprietary platform to replace the web. We think the web is a powerful and open platform for this sort of innovation, so our goal is to identify and facilitate the development of enhancements that bring the advantages of desktop apps to the web platform."

Leaving aside Microsoft Silverlight, that can be barely compared to Adobe Flash, we can do a comparison between AIR (Adobe Integrated Runtime) and Mozilla Prism.

Prism tries to enhance web applications and the user experience with the help of desktop technologies, but they are and remain web applications: whatever runs in Firefox, runs in Prism.
On the other hand, AIR is a complete new world that allows developers to deploy rich internet applications right on the desktop, thanks to a runtime available at the moment for Windows and Mac OS X (and soon on Linux).

An important post has been published by Mike Chambers on his blog commenting this news: http://www.mikechambers.com/blog/2007/10/25/mozilla-prism-and-the-disingenuous-web/
This post focuses on this topic: is Prism really so different from AIR or the only difference between the two technologies is the open/closed source model?

Asa Dotzler exposes his thoughts on the topic here: http://weblogs.mozillazine.org/asa/archives/2007/10/mike_chambers_i.html

My personal thought is that Prism and AIR are going into complete opposite directions, the former is something evolutionary, the latter is revolutionary; Prism is going to improve the Firefox platform, AIR can create a completely new experience in which the web is not the only actor; however closed source or not, neither will "replace the web".

November 11, 2007

Using Maven for building Flex enterprise applications

Maven is a project management and comprehension tool that covers all the phases of a software product development, such as building, documentation, reporting, dependencies, configuration management, releases, by applying well known patterns to a project's infrastructure. These characteristics allow multiple individuals to work at the same project, or at large projects that require the development of minor projects, without the need to understand all the phases, building order or generally the project in its ensemble. Maven goes beyond project building and towards complete project management, thus is appealing to project managers; the projects are managed through the POM structure, which is the Project Object Model that Maven introduces, and refer to library repositories that are required for a particular project. Repositories can be local or remote, the last ones can be mirrored and update the local ones; they allow developers to use the same versions of a library and generally to deal less with them.

The POM describes the project metadata, handles dependencies, describes goals; goals are tasks performed on a project, they have an output and are reusable, just like methods for an object. Maven is structured in modules, some of which included by default and handle common phases like build and deploy, others can be added and combined to best fit the project's requirements.

Another concept introduced by Maven is the archetype, which is defined as an original pattern or model from which all other things of the same kind are made (http://maven.apache.org/); it's a template that can be reused or created ad hoc, for example to reflect the common structure an organization wants its projects to have.

This tool can handle large, enterprise projects that involve different technologies and manages different stages of the development project. Maven can be used for the development of Flex applications also and its characteristics come into play when the application uses remoting services such as LiveCycle Data Services together with Java EE: Maven allows to integrate the build, test, integration and deploy processes through unique commands, at the cost of the creation of the POM files. There is a Maven plugin for Flex that can be found at http://www.israfil.net/projects/mojo/maven-flex2-plugin/ that enables Flex applications building using Maven and Flex SDK. The plugin has to be obtained separately and has to be instructed on where the Flex SDK is installed on the system. The plugin provides three goals: flex2:compile-swc, flex2:copy-flex-applications and flex2:compile-swf that allow to build a swf / swc file and move it to a specified location; the goals are highly configurable and provide parameters to best customize the build.

The plugin developer site offers an example on how to create the POM files for a Flex application that uses Data Services. The example is at http://www.israfil.net/projects/mojo/maven-flex2-plugin/examples/simple_war_project.html and worths illustrating some of the aspects: two POM files describe the build of the swf application and of the WAR application; the swf POM defines common compilation parameters such as useNetwork and dataServicesConfig (for the path to the data services services-config.xml file); the war POM file, besides build configuration, sets all required dependencies and one of them is the swf build, as a tag.

Maven is a smart tool that greatly helps managing large or complex projects and through its plugins can be easily used to develop simple Flex applications as well as data services Flex applications, that are heterogeneous in technology; its structure allows the deploying of such applications to be made in single, defined steps: just call the deploy goal and all the backends, frontends and configuration files are being placed as defined in the POM file.

November 14, 2007

Widgets and Social Commerce: news from the front of Web 2.0

I am just back from the Web2.0 Expo of Berlin (5-8 November). Besides sharing "Choosing the appropriate RIA technology" with Marco Casario (that was the title of our joint speech) I also had the opportunity to attend several speeches during the 3 days expo.

Two words, or concepts, particularly caught my attention because they were mentioned recurringly throughout most of the speeches. They are:

1.widgets

2.social commerce.

I already knew what they are but I did not know that, mutually related in a circular manner, they are going to play a fundamental role in the web 2.0 ecosystem. I will try, as usual, to syntesize the matter:

• the possibility of initiating successful communities is (nearly) over. There is, in fact, a wide number of communities already in place, and it is increasingly difficult to tap on people’s shoulder and ask them to join a brand new community

• widgets represent the future of communities because they help the users get the preferred contents and services out of the communities. Therefore widgets permit selective participation to several comunities at once

• social commerce (or we-commerce) represents the future of e-commerce; this model, in fact, will give the online commerce sufficient visibility thanks to active support from users, each participating to the editing of contents related to the products being sold, and thus helping to promote such products whithin the communities which they are part of

• social commerce is therefore based on communities, so widgets are destined to play a role in social commerce as well! And it is easy, after all, to think of widgets helping people sort the desired items out of the multitude of proposals existing on the web.

By the way: www.zlio.com is an actual example of a social commerce business model already in place, while www.stardoll.com is based on an extraordinary business model which, gearing the belonging/social needs of humans(remember Maslow?) is capable to sell virtual staff for real money!


November 20, 2007

Bug when modifying DOM hierarchy with Javascript using ExternalInterface

I was working on a project using Javascript and Flex. The communication between ActionScript and Javascript is managed by the ExternalInterface class, it is great, simple and it works without problems. But if you are using a DOM function, as appendChild, on a DOM node that contains a Flex object, you can see a strange behavior: Internet Explorer will return an unspecified error and Firefox will refresh your Flex movie. Mozilla had probably the same error of IE, but they reported and corrected it using the refresh workaround. It can be sometimes a good solution, but not always because you could lose all the data in the flex movie. In some special conditions this ExternalInterface bug can make your browser crash.
Let's see when this bug appears:
we need an HTML page with a flex movie inside a div with id "swfMovie", two Javascript functions and a form with two buttons.

Javascript:

function thisMovie(movieName) {
  var isIE = navigator.appName.indexOf("Microsoft") != -1;
  return (isIE) ? window[movieName] : document[movieName];
}
function appendSwf() {
  document.getElementById("container").appendChild(document.getElementById("swfMovie"));
}

The first is the standard JS function used to find a swf movie in an HTML page. The second method use the appendChild function to change the DOM hierarchy and move the div containing the swf movie.

HTML Form:

<form>
  <input type="button" onclick="thisMovie('ExtInt_bug').ASFunction();" value="Call AS function" />
  <input type="button" onclick="appendSwf();" value="Append" />
</form>

The "Call AS function" button calls the Actionscript method exposed by the ExternalInterface class in the swf movie. It simply show an alert message confirming the correct execution of the function.
The "Append" button calls the JS function appendSwf that moves down the div containing the flex movie.

Actionscript:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="onCreationComplete()" width="300" height="300">
  <mx:Script>
    <![CDATA[
      import mx.controls.Alert;
      import flash.external.*;
      
      private function onCreationComplete():void {
          ExternalInterface.addCallback("ASFunction", ASFunction);
      }
      
      public function ASFunction():void {
        Alert.show("ExternalInterface works");
      }
    ]]>
  </mx:Script>
</mx:Application>

Let's see the bug in action:
go to the test page, click the "Call AS function" button, then click the "Append" button. If you are using Firefox you see that the Alert message disappears, this is caused by the refresh of swf movie. Using Internet Explorer you can notice that the "Append" button works correctly, but it fails when you click again "Call AS function".
There is not a real solution to this bug, but there's a workaround to avoid the JS error in IE and make IE works as Firefox. Just add a line in the appendSwf function:

function appendSwf() {
  document.getElementById("container").appendChild(document.getElementById("swfMovie"));
  document.getElementById("swfMovie").innerHTML = document.getElementById("swfMovie").innerHTML;
}

The second statement simply refresh the flex movie such as in Firefox, registering again the External Interface callback.
Both browsers will crash if you change the Actionscript ASFunction in:

public function ASFunction():void {
  ExternalInterface.call("appendSwf");
}

I have tested this bug only on Internet Explorer and Firefox on Windows and I think there's not a solution yet. I hope someone will have some good news on it.

November 26, 2007

Choosing the appropriate RIA technology

While choosing the most appropriate RIA technology for a project, we should consider several factors:

1. the reach (% of users who will be able to get the RIA experience with their installed browser and plug-ins)
2. the availability of open source vs. commercial products
3. the company’s internal knowledge
4. the development time (time to market)
5. the community and support infrastructure

In addition to the above factors, that we can define as “supporting considerations” to the process of choosing the most appropriate RIA technology, we should consider a 6th factor which consists of the “intimate” suitability of a RIA technology to manage:

- Users interaction
- Rich media content

At Comtaste, we have defined the following chart to describe the positioning of 6 different RIA technologies respect the 2 above mentioned parameters (each measured in terms of several features): Ajax, Adobe Flex, Java FX, Lazlo, Microsoft Silverlight 1.1 and XUL .

The chart has been named “the RIA domain” because it represents, like for a mathematical function, the area within which an application can be defined as a Rich Internet Application. It corresponds to our personal feeling and experience as RIA developers.

RIA%20technologies%20positioning.JPG

This chart has been included in the slides presented by Marco Casario at the Web 2.0 Expo of Berlin. The complete set of those slides can be found here.

About November 2007

This page contains all entries posted to Comtaste Consulting | Enterprise RIA consulting and development in November 2007. They are listed from oldest to newest.

October 2007 is the previous archive.

December 2007 is the next archive.

Many more can be found on the main index page or by looking through the archives.

Powered by
Movable Type 3.33