Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Anatomy of a Native Feeling HTML5 iOS App

justinvincent.com

Post reply on HN
Print view View original

21–30 of 61 posts

Re: Anatomy of a Native Feeling HTML5 iOS App

#21

Post by chewxy »

napoleond wrote: post #20
chewxy wrote: post #15

Earlier quoted context omitted.

Interesting. I found I had the exact same experience as you did for my latest projects. In fact you helped solved a problem I have with JQuery Mobile (i.e. it laaaaaaaaaaaaaaa....gs) Guess I'll be picking up XUIJS.

Zepto is also worth checking out, especially if you're looking to reuse bits built with jQuery from a larger web app (API is almost identical).

Yeah I've tried Zepto as a drop-in replacement for JQuery once ... a long time ago. The results were disastrous (everything broke!) but I guess I'll try it again

Re: Anatomy of a Native Feeling HTML5 iOS App

#22

Post by benjamincburns »

I'm probably missing the point (not sarcasm).

I'm about to start writing my first mobile app - a UI client to a ReSTful image rating API. I've been debating between native and HTML5 for the past few days, and reading this article makes me lean ever more toward native.

I see that the author's goal is possible. However, he's also illustrated that getting an HTML5 app to feel native on iOS requires a deep understanding of the underlying implementation of Safari/WebKit. I assume the benefit to this kind of app design is to keep people familiar with web design from having to learn native development?

The problem is that in the quest to not break your comfort zone, you're ultimately forcing yourself to (painfully) learn the depths of the how Safari/WebKit render HTML5 and where its performance 'gotchas' lie. It seems that the uninitiated would have more unimpeded success using the straightforward, well-documented path of native UI development.

Or maybe my assumption is off. HTML5 was originally appealing to me for the sake of portability; I didn't want to write the same app for umpteen different devices. While the idea of writing just one nice responsive interface is appealing - doing this in HTML5 in such a way that it provides a good UX across all devices (or at least the ones I care about) means that I need to learn all the pitfalls of how all the rendering engines out there work. And then there's the maintenance whac-a-mole game that comes when a fix on one platform creates a bug on another... It seems like for portability it'd be a safer bet to rely on separate code-bases for each platform. If I'm doing that - what benefit is HTML5 providing me specifically toward portability, and is this benefit outweighed by the fact that I need to be a WebKit/Chrome performance guru?

Either way, I'll pose the question again: Am I missing something (not sarcastic/rhetorical)?

Re: Anatomy of a Native Feeling HTML5 iOS App

#23

Post by benjamincburns »

benjamincburns wrote: post #22

I'm probably missing the point (not sarcasm). I'm about to start writing my first mobile app - a UI client to a ReSTful image rating API. I've been debating between native and HTML5 for the past few days, and reading this article makes me lean ever more toward native. I see that the author's goal is possible. However, he's also illustrated that getting an HTML5 app to feel native on iOS requires a deep understanding…

Also another question along this topic: How bad is "not native feeling" for UX? As a poor self-funded "I just need to launch this" wantrepreneur, do I care?

I happily used the HTML5 Facebook app on iOS without any notice of its performance "issues." Can someone give me an example of a non-native app where it's lack of nativeness is the cause of poor UX, and for bonus points a similar app with UX noticeably improved by the sheer fact that it is native?

Re: Anatomy of a Native Feeling HTML5 iOS App

#24

Post by 54mf »

beaucollins wrote: post #17
jv22222 wrote: post #7

Earlier quoted context omitted.

Scrolling feels 100% native using -webkit-overflow-scrolling: touch; I am currently working on the next (more complicated) app for UberMedia that has all of those components and works very nicely. It will be one month or so before it is ready for release.

-webkit-overflow-scrolling:touch disables the feature where tapping the phone's status bar scrolls content back to the top. That has been a showstopper for most of the things I have worked on.

You can fake it with some pretty simple Javascript.

Re: Anatomy of a Native Feeling HTML5 iOS App

#25

Post by ianhawes »

benjamincburns wrote: post #23
benjamincburns wrote: post #22

I'm probably missing the point (not sarcasm). I'm about to start writing my first mobile app - a UI client to a ReSTful image rating API. I've been debating between native and HTML5 for the past few days, and reading this article makes me lean ever more toward native. I see that the author's goal is possible. However, he's also illustrated that getting an HTML5 app to feel native on iOS requires a deep understanding…

Also another question along this topic: How bad is "not native feeling" for UX? As a poor self-funded "I just need to launch this" wantrepreneur, do I care? I happily used the HTML5 Facebook app on iOS without any notice of its performance "issues." Can someone give me an example of a non-native app where it's lack of nativeness is the cause of poor UX, and for bonus points a similar app with UX noticeably improved b…

Native Twitter iOS app vs the HTML5 Twitter app.

Native Twitter is great. Very snappy, great UX. If, by chance, you click a Twitter link in Safari on iOS, you'll be facepalming as you wait.

Re: Anatomy of a Native Feeling HTML5 iOS App

#27

Post by amadeus »

This app is so painfully a web app.

Here's why.

First thing I did, started dragging around when I was presented with some grey/brown screen (an intermediary between the load image and the web app actually being loaded?) so I got a nice little rubber bandy action on a grey screen. Web app.

Since there is no normal iOS UI pieces, I find myself being more critical of it because it's unfamiliar.

I tap the input for the dollar amount, I am presented with the default keyboard. Very crappy for entering dollar amounts. Web app.

Oh yeah, also the entire view slides up on focus. Web app.

When changing the number of guests, I get a weird white flash before everything animates in. Typical sign of a... Web app (a symptom of poor usage of translate3d, generally).

And then of course, there's the final piece, this app is a tech demo, not a serious application. It makes no calls to the server, has no serious scroll views, etc.

There are decent examples out there of what can be a good web app, this is not one of them.

Re: Anatomy of a Native Feeling HTML5 iOS App

#28

Post by matwood »

benjamincburns wrote: post #22

I'm probably missing the point (not sarcasm). I'm about to start writing my first mobile app - a UI client to a ReSTful image rating API. I've been debating between native and HTML5 for the past few days, and reading this article makes me lean ever more toward native. I see that the author's goal is possible. However, he's also illustrated that getting an HTML5 app to feel native on iOS requires a deep understanding…

We asked this question before writing our iOS app. Before I came on the team they had used PhoneGap to get part way there, but pulled the plug because of performance issues. Creating the app in native iOS worked and took about the same amount of time as what the original PhoneGap project had spent writing and trying to optimize the performance issues. Disclaimer, 2/3 team members had some iOS experience.

When we started to port our app to Android and went through the same analysis again. Once again, we have picked native.

Looking at the iOS app we naturally have some webviews for the nice formatting and easy loading of changeable content. If you look at the LinkedIn presentations they have ended up in a similar place. Basically have native apps on each platform with some common ground shared through web views.

Post reply on HN