Federico Lox Lucignano, War of the worlds web or native both
1. War of the worlds: Web or Native? Both!
How Wikia is working on re-
launching their mobile apps
using a well calibrated mix of
web and native app
development on both iOS and
Android
2. Federico "Lox" Lucignano
Senior Lead Engineer
Dzień dobry IxDA :) Mobile & API Team - Wikia, Inc.
federico@wikia-inc.com
3. Wikia, Inc. San Francisco, CA
Wikia Sp.z.o.o., Poznań
Who we are: Wikia www.wikia.com
4. www.wikia.com/Mobile
apps@wikia-inc.com
Who we are: Mobile & API team wikiaapps@gmail.com
5. www.wikia.com/Mobile
apps@wikia-inc.com
Who we are: Mobile & API team (for real) wikiaapps@gmail.com
20. The three four great orders
Web apps Hybrid - web Hybrid - mixed Native apps
Device API's Device API's
Mobile Browser
+ + Device API's
+
Native shell Native shell +
Web + + Native code
Web Web <=> Native
21. This graphics tries to
cateogorize some popular apps
What does XYZ's app use? in one of the 4 categories
22. 5 is the answer
Hybrid app development @ Wikia
23. Native web
The sweet spot of mobile
Breaking out the limits development
Native web
24. Introducing Ponto
The fifth party github.com/wikiaapps/Ponto
- Free (as in "free beer")
- Open (as in "open source")
- Secure (as in "sandbox")
- 100% native, 100% web
25. Taking advantage of
Webkit's cross-platform
What's under the hood? features
Webkit's JavascriptBridge
message
callback
HTML5
Webview Native code Device API's
+
CSS3
+
JavaScript message
callback
26. What is the impact
Yeah... sure... on the user experience?
27. Don't do it just for
Things to watch out for the LULz
● Webviews are slow on older
devices and OS versions,
keep your JS/HTML/CSS
light
● Animations aren't always
smooth
● Switching to a Webview in
the app flow is not glitchless
by default
● JS failure in the Webview needs
special care
28. Let's take a look at a real
And now for something totally different world example
Talk is cheap,
SHOW ME
THE DEMO!
30. How native apps
Payback time: put some app in your influence mobile web
development
mobile site
31. How keeping designers, mobile
Divide & conquer? Unite and web developers and native app
developers together results in
inspire! a great UX
● Animations and transitions
● Gestures
● Media as a first class citizen
● Contextes
● UI elements and paradigms
● Typography
● Simplicity and readability
● Performance