3D Menu Performance Problem
I'm currently working on my first Titanium App for the iPhone, although I have experience with developing objective-c based applications, and I've hit a performance snag that I'm hoping someone can help with.
I have built a 3D menu that has 8 - 10 menu items arrayed as if they sat around a 3D sphere such that you can swipe up or down to rotate the menu around in 3D space. The easiest way to imagine this is to think of the giant wheel on 'The Price is Right'. I based my original implementation on code from Apple's HTML5 gallery example listed here.
Basically each menu item is a view upon which a rotation matrix is applied, then a transform, and finally a perspective matrix to give the 3D effect. In the simulator all of this works beautifully but today I put the app on an iPhone for the first time and it is amazing slow.
I'm hoping that someone here has some experience with 3D effects of this type in Titanium and how best to optimize them. I'm also disappointed that the simulator and device performance levels are so far removed from each other, I had assumed they represented similar performance, apparently that isn't the case.
On the device you can see each view move individually (so that the moving view will cover the one below it) until the loop has made it all the way around to the final view and moved it as well, on the simulator it all happens so smoothly you don't notice a thing. Could I possibly move all of the views at the same time instead of calculating the movement for each one individually?
If anyone can help with this I would greatly appreciate it. We need this menu to work so if it's not something I can accomplish in Titanium I may have to fall back to Objective-C, although I'd rather not.
Thanks
2 Answers
-
what about trying to use plain js-code inside a webview? i guess this should work exactly like in safari. drawing lots of views inside a view is indeed very slow, you can even watch them getting painted on the device
-
I have a similar problem. My 3d scene consists simply of some planes floating around to be clicked and thus zoom in. Not just the performance is horroble, but the Titanium 3d functionality is very poor. I had expected that at least the CSS3 transformations would be available. If at least the very essential property "preserve3d" would be available. This would make it possible to set up simple 3d scenes that can be looked at from a point of view. But as far as I see, the perspective can only be set for each individual element.
I now have rebuild the scene with HTML5 and CSS3 and it runs so smoothly! But certainly with the disadvantage, that the webkit engine has to be loaded. I'm thinking about making the whole app with webviews.