This past weekend I spent an hour optimizing the Flex 4 scrolling demo that I posted last week. The original demo was intended to show how to hook up touch events to the Flex 4 List / DataGroup controls. This new version adds some optimizations for the touch event handling and adds the kinetic flick behavior. Check it out and let me know what you think:
I’ve posted the code for this second version of the touch scrolling demo. It was pretty trivial to optimize it this far. With a little more work it’ll be as smooth as silk and as fast as Apolo Ohno. :)
Over the past few days I’ve received some questions about the performance of Flex apps on mobile devices. My Census RIA Benchmark has been a great way to compare the performance of various data loading techniques and technologies. Now that I have my Android based Nexus One mobile device with an early build of Flash Player 10.1 I wanted to see how fast I could load and render large amounts of data in a Flex application. I’m really impressed with the results! 20,000 rows of data loaded from the server and rendered on my phone in about 2 seconds! Those 20,000 rows can then be sorted on the device instantaneously. Pretty amazing performance for such a little device! Check out the video:
You can run the mobile version of the Flex AMF Census Test and check out the source code. Let me know what you think.
24 Comments
Real Nice! And Super Fast! – Suppose you could use Catalyst to make custom components that are more ‘finger friendly’? Look forward to demos of the AIR apps on android too – do you reckon this is something you will demo on the blog here? Thanks for keeping us up to speed.
James,
The performance of the datagrid with 20.000 rows had the Wow Effect on me.
Still cann’t believe it…. it’s WOW !! Fast !!
thanxs for showing that to me ! (thanxs to ted who twittered it !)
Yeah, I’m super excited about Flash 10.1 being mobile….
I can’t wait until all the current Android devices get the update as well!
but what is about using an itemrenderer inside the grid ?
@tranquila What do you mean?
Thank you for your fast optimization! You impressed me again!
I will looking forward for your next demonstration.
James,
What about next generation of flex output on mobile devices which is completely native application
Is this possible to do it exactly like this with fully interaction with server-side back-end such as LCDS and BlazeDS via RPC,RTMP, etc?
-Hr
Hey Hamidreza,
LCDS and BlazeDS work great with Flex apps on mobile devices. The Mobile Census demo uses AMF Remoting. The Tour de Flex Dashboard demo uses LCDS / RTMP:
http://www.jamesward.com/2010/02/17/flex-apps-on-mobile-devices/
-James
Yes but I’m talking about native applications without flash player on mobile devices
My Question is flash native applications On iPhone and generally on portable devices can do this exactly as well as flex/flash apps under flash player on mobile devices?
Also what about iPad James? Has Adobe the plan for this device like iPhone on the future?
You know one GHz is slow for flash player rendering system to run flex/flash apps on it. either iPhone!
Best
Great demo, and performs really well!
I’d be interested to see how a Flex 4 medium sized app runs (i.e. as soon as we have multiple containers inside each other, all calling validation on each other, does it grind to a halt?).
@Hamidreza Some mobile devices will support Adobe AIR for installed apps. For others like the iPhone we cross-compile to native apps.
@Tink Check out my first Nexus One video where I show the full Tour de Flex Dashboard.
Hey James, nice work. I have been doing some similar work, and the stopPropogation on the events was one of the things that gave my sliding list better performance. You can also get a little more performance out of this if you mark the functions as final, resulting in quicker lookups when running. I am still working on it but leveraging startTouchDrag and stopTouchDrag that are part of AIR 2, might also give you a speed increase during the swipe/flick/throw since that should be a native way to move the entire list while your finger is still down during the move event, since you could avoid some of the calculations and scrollTo tweening, and let the player core handle the updates/movement until release, and then apply the kinetic ease. Working on something similar.
Regards,
Rob
It should be noted that Ward isn’t using DataGrid…its a DataGroup which is much lighter than a Grid. I’d be curious to know if the DataGrid would make the phone crawl.
@Kevin
In the Census demo I’m using a DataGrid.
James,
All of your demos are super exciting, but you need to get a Droid and test on that, for performance comparison. The Nexus One is the fastest on the market, It would be interesting to see these examples on a slower phone.
Hey James,
Loaded your Mobile Census onto Nexus One – is the data service available to the yokel off the street?
Thanks,
–
Jon
Yeah. Should be. Are you having any problems?
Yes, selecting 2000 records starts “Test running…” but it never returns or times out.
Is this the AIR app or the browser app?
Whoops. Just realized that my server was broken. Should work now.
It’s unbelievably cool to see this actually working on a phone. Downloading, sorting, scrolling thousands of columns in fractions of seconds…. the future is here.
–
Jon
hey ward,
great work on the scrollable list in flex. what level of effort would it take to make this possible with just flash and a long movie clip that would need scrolling. the movie clip count be just text or images…basically any length of content that is longer than the stage height that would need touch scrolling for an Android AIR app. i’ve looked all over the web and can’t seem to find anything that could help me.
I know this has been done but I have no idea what level of effort it was. You probably want to ask this on the AIR for Android prerelease site.
2 Trackbacks
[...] James Ward – RIA Cowboy Rich Internet Applications | Flex | Adobe AIR | Java | Open Source | Linux | Enterprise Software | Cloud Skip to content Ask The RIA CowboyFlex and Java ResourcesPortable RIAs TutorialpbjAS – AS3 Pixel Bender LibraryJames Ward’s Bio « Flex Apps on Mobile Devices Flex Performance on Mobile Devices » [...]
[...] that will be available to the broader public. And a lot of the evangelists have been creating some cool demos of how Flash Player 10.1 behaves on the Nexus [...]