The process can work well, and it can save you considerable time while still having a nice, polished app on multiple platforms. There are a few pitfalls with the approach, though. One of the main troubles is developing for iOS first.
You see, iOS has a great in-app brower. It has support for all of the latest HTML5 components, it fully supports CSS3, and it has great Javascript performance. The problem is, no other platform is near that level yet. This can create some issues when you are porting your HTML,CSS, and Javascript to other platforms, like Android.
When following the pattern above, you should really develop for the lower platform first and then port to iOS. This way, you will have less development time lost to solving compabability issues. Some of these issues could be: Javascript DOM differences, CSS3 syntactical differences, and Javascript performance differences. Also, keep in mind that the usage of third party libraries, that may work great on iOS, may not work on other platforms. It may not even have an equivalent verison available.
One thing to watch out for would be:
-webkit-linear-gradient… versus -webkit-gradient…
I’m sure that there are several other major differences between what is supported between Android and iOS. Once I find more, I’ll let you know.
Reference: Android WebView CSS Support from our JCG partner Isaac Taylor at the Programming Mobile blog.
