SlideShare ist ein Scribd-Unternehmen logo
1 von 17
Downloaden Sie, um offline zu lesen
HTML5 and Native
Pros, cons and small examples
Me
Present: iOS dev @Jimdo
Featured by Apple in 40+ countries on initial release
incl. Germany + USA
Mostly 5 star reviews!
170k+ downloads
In the Past

Lead Mobile Developer @Hostelworld
Cross-platform strategy: One small HTML5 codebase,
Titanium, PhoneGap, web, some native extensions
When we started these apps, mobile was 0.5% of revenue, today it is
about 15% (3/4 years later)
The Native Nerds
“HTML5 is just so broken, audio doesn’t work, animations
are laggy, same origin restrictions, storage restrictions.. ”

The HTML5 Nerds
”Programming for a closed OS/app ecosystem is so 90’s.”
“I want to be in control of my release process.”
"We are a web company, we should leverage those skills”
The Users
They don’t care or even realize whether
something is an app or a web app, they DO
care about getting the job done, and how
painful/painless that experience is. - Me
Are Users Stupid?

“Opponents of the usability movement claim that it
focuses on stupid users and that most users can easily
overcome complexity. In reality, even smart users prefer
pursuing their own goals to navigating idiosyncratic
designs.” - Jakob Nielsen
Native: Pros
● Not having to say no to our designer all the
time ;)
● Animations are always nice and smooth, no
crazy CSS voodoo found via StackOverflow.
● Apple’s documentation is amazingly
detailed and correct.
Native: Pros...
● Bleeding edge features readily available
(blurred backgrounds in iOS7)
● Threading, networking, audio, 3D graphics,
camera, address book, linking to other
apps... no restrictions
Native: Cons
● Long development time for features
● GUI creation tools (Storyboard, Interface
Builder) not up to scratch...
● Native apps crash more (source: Crittercism
market analysis)
● Opaque, sloooow approval process (for iOS)
Native: Cons...
● Being featured won’t necessarily make you
rich.
● You just won’t believe how much code is
needed to do certain things, like display a
list.
● Affiliate referrals are tricky to attribute for
iOS (adjust.io)
HTML5 Pros
● Prototyping is fast
● You can leverage your existing dev teams to
some extent, keep a generalist, not
specialist culture.
● If you have a HTML5 mobile app, you have a
mobile website for free!
● Porting between platforms can take days
instead of months/years.
HTML5 : Pros...
● Most apps are technically simple, don’t
require 3D, multiple audio streams.
● Mobile is > 90% webkit, so testing in
Chrome with those fancy web developer
tools works well.
● Remote debugging is also now possible,
inspect the DOM, add breakpoints.
HTML5 : The cons (Cracks knuckles)
● Getting stuff to feel native/smooth is hard,
requires mobile web specialist knowledge
(touchstart, touchmove, touchend), webkit
CSS transitions, backface culling switches.
● If there’s a browser bug/change (iOS7 broke
a lot), you’re boned.
● Little documentation around performance
HTML5 : The Bad
● You find yourself reinventing the wheel
(emulating native view controller
transitions, navigation controller stack
history, app localisation)
● The nail in the coffin will come from user
reviews: “What’s the point in having an app
if it does exactly the same as the website?”
There’s no right answer
Use HTML5 if:
● your app is simple, your interface is going to
be mostly custom.
Use a native app if:
● you can afford it
● you want to add value with native-enabled
features (image filters, offline storage etc)
But don’t take my word for it
Let’s try building a simple app using both
HTML5 and natively for iOS using XCode.
git remote add origin https://firlefans@bitbucket.
org/firlefans/berlin_demo_html5.git

Weitere ähnliche Inhalte

Mehr von Eurapp

Mehr von Eurapp (20)

"Opportunistic to Strategic" by Gemma Coles, Mubaloo
"Opportunistic to Strategic" by Gemma Coles, Mubaloo"Opportunistic to Strategic" by Gemma Coles, Mubaloo
"Opportunistic to Strategic" by Gemma Coles, Mubaloo
 
"Welcome to Sizing the EU App Economy" by John Breslin, NUI Galway
"Welcome to Sizing the EU App Economy" by John Breslin, NUI Galway"Welcome to Sizing the EU App Economy" by John Breslin, NUI Galway
"Welcome to Sizing the EU App Economy" by John Breslin, NUI Galway
 
"Crowdsourced Solutions to Major Bottlenecks" by John Breslin, NUI Galway
"Crowdsourced Solutions to Major Bottlenecks" by John Breslin, NUI Galway"Crowdsourced Solutions to Major Bottlenecks" by John Breslin, NUI Galway
"Crowdsourced Solutions to Major Bottlenecks" by John Breslin, NUI Galway
 
"European App Centre" by Cianán Clancy
"European App Centre" by Cianán Clancy"European App Centre" by Cianán Clancy
"European App Centre" by Cianán Clancy
 
"Rebooting the EU App Economy" by John Breslin
"Rebooting the EU App Economy" by John Breslin"Rebooting the EU App Economy" by John Breslin
"Rebooting the EU App Economy" by John Breslin
 
"App Innovation / Development / Training Hubs" by Joseph Davis
"App Innovation / Development / Training Hubs" by Joseph Davis"App Innovation / Development / Training Hubs" by Joseph Davis
"App Innovation / Development / Training Hubs" by Joseph Davis
 
"Online Multisided Team Connection Platform" by Luca De Angelis
"Online Multisided Team Connection Platform" by Luca De Angelis"Online Multisided Team Connection Platform" by Luca De Angelis
"Online Multisided Team Connection Platform" by Luca De Angelis
 
"Conference Hub / Resource Repository and Promotion Channels" by Donald McCann
"Conference Hub / Resource Repository and Promotion Channels" by Donald McCann"Conference Hub / Resource Repository and Promotion Channels" by Donald McCann
"Conference Hub / Resource Repository and Promotion Channels" by Donald McCann
 
"App Entrepreneurs in Residence" by David Arias
"App Entrepreneurs in Residence" by David Arias"App Entrepreneurs in Residence" by David Arias
"App Entrepreneurs in Residence" by David Arias
 
"ECO-SYSTEM" by Antoine Saint-Marcoux
"ECO-SYSTEM" by Antoine Saint-Marcoux"ECO-SYSTEM" by Antoine Saint-Marcoux
"ECO-SYSTEM" by Antoine Saint-Marcoux
 
"App Innovation and Incubation Centres" by Savania Chinamaringa
"App Innovation and Incubation Centres" by Savania Chinamaringa"App Innovation and Incubation Centres" by Savania Chinamaringa
"App Innovation and Incubation Centres" by Savania Chinamaringa
 
"Crowdpreneurship" by Ali Chousein
"Crowdpreneurship" by Ali Chousein"Crowdpreneurship" by Ali Chousein
"Crowdpreneurship" by Ali Chousein
 
"How Can Web Devs Reach the Mobile Market?" by Dimitris Michalakos, Web Techn...
"How Can Web Devs Reach the Mobile Market?" by Dimitris Michalakos, Web Techn..."How Can Web Devs Reach the Mobile Market?" by Dimitris Michalakos, Web Techn...
"How Can Web Devs Reach the Mobile Market?" by Dimitris Michalakos, Web Techn...
 
"Venture Capital Fund and Academy" Funding Challenge Solution by Gabriel Reitz
"Venture Capital Fund and Academy" Funding Challenge Solution by Gabriel Reitz"Venture Capital Fund and Academy" Funding Challenge Solution by Gabriel Reitz
"Venture Capital Fund and Academy" Funding Challenge Solution by Gabriel Reitz
 
"Monetizing Apps: Lessons from Photo App Developers" by Hans Hartman, Preside...
"Monetizing Apps: Lessons from Photo App Developers" by Hans Hartman, Preside..."Monetizing Apps: Lessons from Photo App Developers" by Hans Hartman, Preside...
"Monetizing Apps: Lessons from Photo App Developers" by Hans Hartman, Preside...
 
"Startup Europe and Funding Opportunities in Horizon 2020" by Bogdan Ceobanu,...
"Startup Europe and Funding Opportunities in Horizon 2020" by Bogdan Ceobanu,..."Startup Europe and Funding Opportunities in Horizon 2020" by Bogdan Ceobanu,...
"Startup Europe and Funding Opportunities in Horizon 2020" by Bogdan Ceobanu,...
 
"Preliminary Findings from the ICT Developers Survey" by David Card, Vice Pre...
"Preliminary Findings from the ICT Developers Survey" by David Card, Vice Pre..."Preliminary Findings from the ICT Developers Survey" by David Card, Vice Pre...
"Preliminary Findings from the ICT Developers Survey" by David Card, Vice Pre...
 
"Marketing in a Million App Market" by Aaron Watkins, President and Founder, ...
"Marketing in a Million App Market" by Aaron Watkins, President and Founder, ..."Marketing in a Million App Market" by Aaron Watkins, President and Founder, ...
"Marketing in a Million App Market" by Aaron Watkins, President and Founder, ...
 
David Card, Vice President Research, GigaOM
David Card, Vice President Research, GigaOMDavid Card, Vice President Research, GigaOM
David Card, Vice President Research, GigaOM
 
Tanguy De Lestré, Association Manager, Agoria App Alliance Belgium
Tanguy De Lestré, Association Manager, Agoria App Alliance BelgiumTanguy De Lestré, Association Manager, Agoria App Alliance Belgium
Tanguy De Lestré, Association Manager, Agoria App Alliance Belgium
 

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source Milvus
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 

"HTML5 and Native: Pros, Cons, and Small Examples" by Mark Frawley, Mobile Developer, Jimdo

  • 1. HTML5 and Native Pros, cons and small examples
  • 2. Me Present: iOS dev @Jimdo Featured by Apple in 40+ countries on initial release incl. Germany + USA Mostly 5 star reviews! 170k+ downloads
  • 3. In the Past Lead Mobile Developer @Hostelworld Cross-platform strategy: One small HTML5 codebase, Titanium, PhoneGap, web, some native extensions When we started these apps, mobile was 0.5% of revenue, today it is about 15% (3/4 years later)
  • 4. The Native Nerds “HTML5 is just so broken, audio doesn’t work, animations are laggy, same origin restrictions, storage restrictions.. ” The HTML5 Nerds ”Programming for a closed OS/app ecosystem is so 90’s.” “I want to be in control of my release process.” "We are a web company, we should leverage those skills”
  • 5. The Users They don’t care or even realize whether something is an app or a web app, they DO care about getting the job done, and how painful/painless that experience is. - Me
  • 6. Are Users Stupid? “Opponents of the usability movement claim that it focuses on stupid users and that most users can easily overcome complexity. In reality, even smart users prefer pursuing their own goals to navigating idiosyncratic designs.” - Jakob Nielsen
  • 7.
  • 8. Native: Pros ● Not having to say no to our designer all the time ;) ● Animations are always nice and smooth, no crazy CSS voodoo found via StackOverflow. ● Apple’s documentation is amazingly detailed and correct.
  • 9. Native: Pros... ● Bleeding edge features readily available (blurred backgrounds in iOS7) ● Threading, networking, audio, 3D graphics, camera, address book, linking to other apps... no restrictions
  • 10. Native: Cons ● Long development time for features ● GUI creation tools (Storyboard, Interface Builder) not up to scratch... ● Native apps crash more (source: Crittercism market analysis) ● Opaque, sloooow approval process (for iOS)
  • 11. Native: Cons... ● Being featured won’t necessarily make you rich. ● You just won’t believe how much code is needed to do certain things, like display a list. ● Affiliate referrals are tricky to attribute for iOS (adjust.io)
  • 12. HTML5 Pros ● Prototyping is fast ● You can leverage your existing dev teams to some extent, keep a generalist, not specialist culture. ● If you have a HTML5 mobile app, you have a mobile website for free! ● Porting between platforms can take days instead of months/years.
  • 13. HTML5 : Pros... ● Most apps are technically simple, don’t require 3D, multiple audio streams. ● Mobile is > 90% webkit, so testing in Chrome with those fancy web developer tools works well. ● Remote debugging is also now possible, inspect the DOM, add breakpoints.
  • 14. HTML5 : The cons (Cracks knuckles) ● Getting stuff to feel native/smooth is hard, requires mobile web specialist knowledge (touchstart, touchmove, touchend), webkit CSS transitions, backface culling switches. ● If there’s a browser bug/change (iOS7 broke a lot), you’re boned. ● Little documentation around performance
  • 15. HTML5 : The Bad ● You find yourself reinventing the wheel (emulating native view controller transitions, navigation controller stack history, app localisation) ● The nail in the coffin will come from user reviews: “What’s the point in having an app if it does exactly the same as the website?”
  • 16. There’s no right answer Use HTML5 if: ● your app is simple, your interface is going to be mostly custom. Use a native app if: ● you can afford it ● you want to add value with native-enabled features (image filters, offline storage etc)
  • 17. But don’t take my word for it Let’s try building a simple app using both HTML5 and natively for iOS using XCode. git remote add origin https://firlefans@bitbucket. org/firlefans/berlin_demo_html5.git