Solution Hacker

When you come to the world of offline/disconnected application, you will hear the new buzzwords – AIR and Gear. Before I talked about these technologies, I want to talk about what problem we are trying to solve first. What we need an application to be able to function offline? First, Internet access is not everywhere. When you are on the plane, at the coffee shop, on the Maui beach etc, you may not be able to connect to your favorite Web applications. What if you want to look at some of your reports? I would like to see the traffics statistics for my own little wedding website company – Jusproposed.com. However, I don’t see Google Analytics available offine

OK. There is need for it. Although the need may go away once the whole world is wired by WiFi or other technologies (may still take a while), we may want to solve this problem to improve user experience. Here is how the problem get solved in high level?

1. User request is captured locally.
2. All your operation is handled locally to the local database.
3. When Internet access is available, synchronize the local database with the server database.

How Gear solves this? (I learn it here)

1. LocalServer module captures browser HTTP and HTTPS requests if there is no internet access (Browser plugin works only with Firefox 1.5+ and IE6).
2. Database module (uses SQLite) stores the updates and provides the information needed. (news). When Internet access is available, it will do the synchronization work for you automatically.
3. Google gear also provides background processing mechanism taht allows I/O or compute-intensive Javascript to run without blocking the user interface.

How AIR solves this?

1. Adobe AIR is desktop application that runs without browser.
2. Apollo provides SQLite as well for storing the updates and provides the information needed.
3. Sync module will do the synchronization work when Internet access is available.

My preference

I have to pick either one of them. I would select AIR b/c ilike the power of Flex in UI. So, if AIR solves the problem, I may just stick with it. Simple?!! Since I am working for the Performance Ad Network right now, if I can pull enough data across the wire and store it locally, then I can run OLAP and other complex queries and visualize the data with the advanced data grid and charting available in Flex, that will be awesome!

Update: Flex and Gear actually can work together! (Someone demonstrates this combination via building a sales force application)

Open up FDS?

Adobe announced that it will open source the strip down version of LiveCycle Data Service called BlazeDS. From what I heard, BlazeDS provides AMF3 remoting without data management and its data push solution is not so scalable as LCDS. (features comparsion chart). The reason is that BlazeDB still uses the blocking IO to handle connections whereas LCDS uses Java NIO. The power of Java NIO is that the server thread will not be held up for the connection during the request is in process. (Detail here). So, BlazeDB is only good for tasting the power of AMG remoting and learning how AMG protocol being implemented.

Future of GraniteDS

However, if all you need a solid AMF solution to connect Flex 2 with Java, take a look at GraniteDS. I heard that it does a great job. However, GraniteDS may become obsolete soon as the founder, Franck Wolff, seemed a bit caught off guard and unsure what the future held for GraniteDS. However, finally he decided to continue GDS development. Here are why GDS is still better than BlazeDS:

1. BlazeDS does not offer any data management features.
2. FDS/LCDS has it own (proprietary and closed) data management system, offers (officially supported?) service factories for Spring and Hibernate (but without any lazy-loading support) and is, say, expensive.
3. GraniteDS integrates with known enterprise J2EE persistence systems such as EJB3 (session and entity beans with full lazy-loading support) and with wildly used and open source frameworks such as Spring (with Acegi security) or JBoss/Seam (with conversation scope support – new, coming in the next release).
4. GraniteDS provides a fast and powerful ActionScript3 code generator (Gas3): you just have to write your database model (EJB3 entity beans), Gas3 will generate corresponding ActionScript3 beans and Hibernate code generation tools will create your database tables. So, from an enterprise point of view, GraniteDS does not really compare to BlazeDS and, on the other hand, it seems to be still a powerful and free alternative to FDS/LCDS.

Update: GraniteDS 1.0 is released. Here is an article that discusses this release.

How about WebORB?

I also heard that WebORB is a powerful alternative to LCDS (compare them here). Again it is Free! However, it is not open source and its license may constraint you doing some interesting things. I will check this out more. However, here is a promising comment from the director of scrapblog.com – a fancy Flex example on Web. "Scrapblog.com needed a remoting solution to use with Flex 2, as it currently only supports Java. I didn’t think twice when choosing WebORB for this task. Version 3.0 [of WebORB] is simply amazing. You won’t experience the flexibility and responsiveness that WebORB offers with any other remoting solution. My hat goes off to Midnightcoders, keep the great work." – Omar Ramos, Scrapblog’s Director of R&D.

E4X is similar to XPath that is used to manipulate the structural xml in a scripting language. Here are some examples:

Delete node from XML

<root>
<level>
<detail></detail>
</level>
<level>
<detail></detail>
</level>
</root>

I want to make a copy of this XML (could be either of the three types of XML objects) and remove the <detail> nodes from every node no matter that hiarchy they are in.

private function testXML():void {
var xml:XML =
<root><level><detail></detail></level><level><detail></detail></level></root>
var test:XML = xml.copy();
delete test..*.detail;
trace(test.toXMLString());
}

Add new node to XML

var newItem:XML =
<level id=’1′>
<detail></detail>
</level>
test.appendChild(newItem);

Traverse

var myXML:XML =
<order>
<item id=’1′>
<menuName>burger</menuName>
<price>3.95</price>
</item>
<item id=’2′>
<menuName>fries</menuName>
<price>1.45</price>
</item>
</order>

myXML.item[0].menuName (for element traverse, use index to identify an element)
myXML.item.(@id=2).menuName (search an element using its attribute @)
myXML.item.(menuName==”xxx”).price

var total:Number = 0;
for each (var property:XML in myXML.item) {
var q:int = Number(property.@quantity);
var p:Number = Number(property.price);
var itemTotal:Number = q * p;
total += itemTotal;
trace (q + ” ” + property.menuName + ” $” + itemTotal.toFixed(2))
}
trace (“Total: $”, total.toFixed(2));

Assignment

myXML.item[0].menuName=”regular burger”;
myXML.item[1].menuName=”small fries”;
myXML.item[2].menuName=”medium cola”;

myXML.item.(menuName==”regular burger”).@quantity = “2″;
myXML.item.(menuName==”small fries”).@quantity = “2″;
myXML.item.(menuName==”medium cola”).@quantity = “2″;

var myXML:XML =
<order>
<book ISBN=”0942407296″>
<title>Baking Extravagant Pastries with Kumquats</title>
<author>
<lastName>Contino</lastName>
<firstName>Chuck</firstName>
</author>
<pageCount>238</pageCount>
</book>
<book ISBN=”0865436401″>
<title>Emu Care and Breeding</title>
<editor>
<lastName>Case</lastName>
<firstName>Justin</firstName>
</editor>
<pageCount>115</pageCount>
</book>
</order>

myXML.book –> XMLList (direct children of myXML object that has element name “book”)
myXML..lastName –> XMLList (any descendant that has element name “lastName”)
myXML.book.author.lastName –> XMLList
myXML.book[0]
myXML.book[0].title
myXML.child(“book”).title
myXML.book.(@ISBN=’0942407296′)
myXML.book[0].@ISBN –> output 0942407296
myXML.book.(title==’Emu Care and Breeding’)
myXML.book.(pageCount > 100)
myXML.book.(title.toString().search(‘Emu’) > -1)

var myXML:XML =
<order>
<item id=’1′ quantity=’2′>
<menuName>burger</menuName>
<price>3.95</price>
</item>
<item id=’2′ quantity=’2′>
<menuName>fries</menuName>
<price>1.45</price>
</item>
</order>;

var total2:Number = 0;
for each (var prop:XML in myXML.item) {
total2 += prop.@quantity * prop.price;
}

http://www.devx.com/Java/Article/21383/1763/page/1

Since I am leading the reporting team in Adconion, I would like to spend sometime on the new component “Advanced Data Grid” from Flex 3. Being excited to know that this component has added many cool features on top of the DataGrid, I would like to find out whether it meets all my needs. Before I introduce it to my company, I would like to write an example to exercise its power first. The example below will demonstrate some documented features in Advanced Data Grid and some custom features that I would like in my project. To make the example prettier, I would use Yahoo Flex Skin.

Yahoo Flex Skin

Apart from providing you flex skin, Yahoo also shares with you some custom-made flex components. Among them, I would like to look into Yahoo Map once I have time. (http://developer.yahoo.com/flash/maps/examples.html). However, it is out of my scope today.

What I want to show you in my example
There are some cool features I want to try out in this example. Here is the list:

1. Grouping
2. Tree view with “Expand All” and “Shrink All” features.
3. Multiple columns sorting
4. Auto-completed search filter
5. Smart resizing data grid

Flex Performance Guidelines

1. Avoid nested container - it is resource intensive for Flex to figure out the x,y of the elements via sizing and measuring algorithm. Tips: hard-code x,y and width and height.
2. Naviagtor containers have built-in deferred instantiation – eg. Accrdion, TabNavigator, ViewStack.
3. Progressive layout improves initialization experience using queued creationPolicy in the deferred instantiation architecture. UI element are loaded in the successively fashion. Progressive layout does not quantifiably reduce application startup time, but it significantly improves the perceived startup time.
4. Handle large data sets may make your Flex application appears slow. You can use pagination or other methods to address this. (reference).
5. Improve charting performance
   • All charts cache intermediary values in the transformation from data to screen, so that only the minimum amount of recalculation occurs in response to any change to the data or chart.
   • The most expensive actions to perform in Flex charts is forcing a chart to redraw an axis, or forcing a chart to recalculate its labels. So, change dataProvider is costly in this sense.
6. Use Runtime Shared Library (RSLs) to shrink the size of your application’s resulting SWF file. Because once you externalizing shared assets into standalone files, you can separately download and cache on the client. (reference)
7. Use Profiler: getTimer() to record the time in millisecond in ActionScript.

Reference

Good Video: https://admin.adobe.acrobat.com/_a300965365/p71169528/