State of the Mobile WebBen Teese, Shine Technologies
What this talk is about
Why mobile web apps? Best practices Hybrid apps
2007 2014
Evergreen browsers
Distribution
Cross-platform
Best Practices
It’s all about performance
Tip #1: Latency
Network Latency
Mitigations
Combine your assets 1 call per user interaction Give the user feedback Do it early
Tip #2: Latency (again)
Touch Latency
With delay Without delay
Mitigation
github.com/ftlabs/fastclick!
ngTouch!
Do it early
Tip #3: Not all animations are
created equal
The Humble Accordion
iPhone 5s Samsung S4
Avoid JQuery animations Test on real devices Leverage hardware-acceleration
Mitigations
Tip #4: Don't put too much
stuff in the DOM
Review your UX Test on real devices Just don’t do it
Mitigations
Hybrids
android.webkit.WebView
UIWebView
So what is a hybrid?
Titanium
Get me into the app store
Access native phone features
Write once, run anywhere
I want to use my existing web skillz
Let’s wrap this up
Mobile web apps can work Factor in performance Consider hybrid apps
Thank you
@benteese