Coding for the Mobile Web

http://arandomurl.com/2011/03/16/coding-for-the-mobile-web.html

by daleharvey • 15 years ago

43 5 15 years ago

mrspeaker• 15 years ago

I hope mobile web apps really take off - although Apple provides a fantastic distribution mechanism, the restraints they put on developers are unreasonable. Web apps let you (or your company) dictate the release cycles and determine what is or isn't suitable for your customers.

The HTML5 apis (especially the offline cache manifest stuff - my favourite! http://www.mrspeaker.net/2011/03/17/generating-cache-manifes... ) can let us do some pretty "native-esque" stuff: though it seems like every iOS version something gets broken - multi-touch in 4.2, and the nitro bug in 4.3... Though I'm sure I'm ascribing to malice... ;)

phrotoma• 15 years ago

This is the only thing that makes sense, I've turned down a couple contracts now for people wanting me to develop and maintain code bases on three different platforms for the same app. Until someone figures out a way around the cross platform legal and technical issues this is the sanest way for indie developers to compete.

johnbender• 15 years ago

Note: I'm a jQuery Mobile team member

Most of the functionality that the author has highlighted (footers, page animations, intelligent click handling) is handled in a much more comprehensive/robust fashion by jQuery Mobile despite its alpha state.

I would encourage readers to look into the phonegap/jqm combination when building mobile applications with html and javascript if only because there are a large number of problem areas with this approach that jqm will handle for you.

[UPDATE]

Just thought I'd highlight that the click/tap support is extremely difficult to get right. Kin Blas, the developer who's working on this in jqm has taken a lot of pains to make sure that the click handling is fast and flexible in all cases.

daleharvey• 15 years ago

Sure, I checked out jquery mobile before starting with this and would suggest everyone else does the same, actually a bit silly to leave that out of the article.

I decided against using jquerymobile for 2 reasons,

1. the page loading / transitions are extremely buggy for me, clicking a link can cause 3/4 page flashes for me on the current online demo.

2. having previously been burned by jquery ui, I love jquery because its a tiny library I add that enforces nothing on me, jquery ui is large and its quite hard to take a little bit out of it that you like, a lot of that is due to its themeing library, jquery mobile felt more like jquery ui to me more than jquery plain.

extracting the click / tap support into a plugin I could use with plain jquery would be a massive win for me.

samcollins• 15 years ago

Your methods on fixing the click delay are interesting. What was your resulting click time?

I'm not an expert on this but you seem to be using a lot of javascript for your UI when most of it can be done with CSS and applying/removing classes. The JS is fine for desktop browsers but it can be really laggy on mobile (even 3GS). I think that's one of the things about jquery mobile—it uses css where possible. That said, it seemed a little unrefined for me too and I've always left it out.

I did much the same stuff (ui-wise) as you very recently, but used -webkit-animation to do most of the work which means you can also use -webkit-animation-fill-mode <-totally awesome: http://developer.apple.com/library/safari/#documentation/app...

Also, you should use the 3d versions of translate, scale, rotate like translate3d(x,y,z) because it utilises hardware acceleration (on iOS at least). Makes a massive difference. Put down the javascript stick. :-)

Coding for the Mobile Web

Related Stories