CSS3 transition performance - browser, os and hardware recommendations? - performance

I am planning a browser based kiosk application that will utilize CSS3 transitions (mainly on opacity) on relatively high resolution (1920x1080px) images.
Doing some preliminary testing on CSS3 transitions I have seen huge differences on rendering performance between Safari and Chrome under OSX 10.7.2 - a bit surprising.
Could anyone give me some recommendations as to OS, browser and hardware suggestions in order to maximize performance?

You could use a stripped down Linux with Chromium Daily builds or Trunk, hardware depends on budget

Related

Mobile App UI Performance - RhoMobile Rhodes vs. PhoneGap

Has anyone made experiences with both Rhodes and PhoneGap?
I tried building the same "Hello World"-App with both Frameworks for Android, and tested them on a Samsung Galaxy S device running Android 2.3.3.
In both cases, i used HTML5 & jQuery Mobile (in the same version) to design the UI.
The app does nothing but offering a link on the "Home"-Page which uses a slide transition to a second page. The Rhodes app needs longer to startup, but has a very smooth animation when transitioning to the second page. The PhoneGap app flickers and jerks.
Did anyone of you experience a similar behavior? And could you resolve the issues in the PhoneGap version? Could the difference lie in different browser engines / WebViews used by Rhodes / PhoneGap?
I can't give you a good answer, as I'm fairly new to Rhodes and Phonegap myself. What I do know is that RhoMobile uses Motorola's own build of WebKit if you have RhoElements enabled or have added motorola_browser as a capability.
If your Rhodes app was using Motorola's Webkit, I suppose it's possible that the custom Webkit build has been optimized for rendering the content generated by Rhodes, with its EMML and all. This is just speculation, of course.
Phonegap, however, relies on the system's browser and what it offers in terms of performance. AFAIK, it's basically a UIWebView object on iOS.
A really neat bonus of using Motorola's Webkit is you'll have only one browser to work against, across all platforms. (At least in theory, I haven't yet tested how consistent the render engine actually is across platforms.)
To sum up, Rhodes/RhoMobile sounds awesome on paper. I'm just hoping it will live up to my expectetions. Your "Hello world" test could be just a fluke with Phonegap, or it could mean that Motorola's Webkit is indeed performing better. Guess I'll find out sooner or later.

CSS3 Support for Windows Phone 7 IE

I would like to know what sort of CSS3 transformation properties are Hardware Accelerated in the latest IE in Windows Phone 7 Mango update. This information seems nowhere to be found.
There isn't much around this, but I imagine it would only be the computationally intensive transformations if anything: out of the list of CSS3 features supported mentioned on the IE9 Mobile article here, maybe 2D Transforms?
In any case, why would information on which CSS3 transforms are Hardware Accelerated be useful? It seems kind of weird/counterintuitive to be designing your CSS based on whether it will be accelerated or not?

windows phone 7 device compatibility

I noticed windows phone 7 only has one hardware standard now.
I just wonder if the compatibilities of wp7 devices provided by different hardware vendors are better than the complex and headache android devices?
Welcome any comment
Microsoft's standards for the WP7 make it so that app compatibility is now solid (unlike past version of WinMo). If you have an app that runs on one phone, it will run on them all.
When the original specs came out it was intended that there would be 2 chassis specs. The first with a screen resolution of 480x800 and another, coming later, with a resolution of 320x480.
Since the Nokia deal it is very unlikely that devices with a 320x480 screen, and other features as previously described, will now be released. Other chassis specs are expected but we'd only be guessing at what these would be.
The current templates include hard coded margins, etc. which are appropriate for the 480x800 resolution. Until we know what, if any other resolutions the platform will support it's not known if just hard coded values will still be appropriate.
The most recent recommendations I've had from the WP7 development and design teams are to focus purely on the 800x480 resolution devices and worry about other resolutions as and when they're announced.
It has been suggested that if devices with smaller screens are released then the framework will include the ability to automatically scale the apps/pages for such resolutions. I imagine there will also be the ability to adjust the sceen design based on the resolution but this is currently just a guess. If other resolutions don't support the same ratios then this will be particularly important.
To do anything else, before details of what other resolutions may need to be supported is additional work for now and is based purely on guesswork. I'd recommend following the advice and just sticking to creating apps which are designed for 480x800. If and when the need to support other resolutions arises we can worry about how best to do so then.

WebGL on older Mac OS X versions (say 10.4)

Not really a programming related question but...
I'd like very much to experiment with WebGL on my spare time. My current 'spare time' machine is a MacBook running Mac OS X Tiger (10.4.xx) and I'm unable to find a new browser supporting this OS. Firefox dropped support, Chrome too, and Safari idem.
I read somewhere that this is due to a Quicktime bug that Apple won't fix.
Does anyone have more information on this issue ?
Does anyone have a clue or track to find a running implementation of WebGL on Mac OS X 10.4 ?
Cheers,
I know a fellow who is maintaining a Firefox 4 port to OS X 10.4.
Check out http://www.floodgap.com/software/tenfourfox/
Edit: Unfortunately I've just found out that this doesn't quite fulfil your main reason for wanting Firefox 4.
From the dev's site:
OpenGL support is presently disabled
in 10.4Fx. This is Apple's fault, as
Mozilla requires non-power-of-two
texture sizes, which require OpenGL 2.
Unfortunately, PPC Tiger does not
support OpenGL 2 at all, and only a
subset of cards support it in PPC
Leopard (the really irritating part is
that Intel Tiger does have OpenGL 2,
and OpenGL 2 came out in 2004!). It
may be enabled in the future for those
handful of configurations on Leopard,
but this won't benefit the majority of
users. Note that many graphics
features will work just fine; they
just won't be hardware-accelerated.
If you can get a build of Firefox which has WebGL to run, but don't have a GPU that supports OpenGL ES 2.0, you might want to try setting the "webgl.osmesalib" about:config option. Even simple programs will probably run at a flip-book frame rate however.

Testing a web app for macs - is IPad ok?

Many of my clients use Macs and I'm getting weekly emails about bugs in my web-app software that are Mac only issues.
I have a limited budget so I'm hesitating going out any buying a $1,200 Mac for testing.
Would an iPad work?
Or would that not be the same kind of browser rendering as a Mac Book?
can I recommend a $700 mac then?
The biggest benefit is, that with virtual machines, you can now create a testing environment for nearly every system you wish to be a client on
The iPad Safari is more based on the iPhone mobile safari rather than the desktop Safari. You may have better luck getting a Mac Mini, or searching eBay for a used Mac.
Uhm… why has nobody mentioned yet, that Apple distributes Safari for Windows? For free.
You are not very specific about the kinds of problems your uses report. I would be very interested in which of those are not testable with Safari on Windows!
There are better ways to mimic common mac browsers than buying common mac hardware. Look into browser emulation products like browsercam.
Since no one said it directly yet, iPad does not render exactly the same as Safari on 10.6, nor can interactions be tested because one is gesture and touch based and the other is keyboard and mouse. You're cheapest option is the $700 Mac Mini plugged in to your existing input devices.
Unfortunately, because apple forbids the virtualization of it's OS (PDF:Section 2.A), you can't find anyone who will take browser shots in any reasonable amount of time. Of course, screen shots will only really help you if it's a rendering bug. If it's interaction, $700 isn't all that much more than $500, plus, you get a Mac! ;)

Resources