SlideShare une entreprise Scribd logo
1  sur  29
Smart Phone Development
Using Web Technologies
Apple Cupcakes


Apple have 250,000 apps. 6.5 billion downloads
Android have 30,000 apps
Upcoming: Windows 7 Phone
Толку многу јазици, толку
малку време
iPhone: Objective C
Android: Java
Nokia: C++
Windows 7: .NET
Palm Pre: HTML + CSS + JS
I already know how to do
HTML, CSS and JavaScript
PhoneGap
PhoneGap


Runs on iPhone, iPad, Android, Palm Pre, Nokia and
Blackberry
Loads embedded web browser (Usually Webkit)
Adds JS bridge
PhoneGap APIs

Accelerometer
Camera
Contacts
Geolocation
Advantages


Fast to develop
  70-80% done in a browser
  Use existing development tools
Disadvantages
Much slower than native
Harder to look native
Can’t access everything (yet)
No position:
fixed support

No debugger!
File system support is limited
Lifecycle

                                               e
       Start Up                            vic !
                                         De dy
                                             a
                                          Re


                  Load Web
                   Browser
             Load HTML         Load JS
                      Load CSS
Webkit or go home
HTML 5 + CSS 3
 SQLite
 Hardware accelerated animations
 Use your favourite framework
   jQuery
   ExtJS
Frameworks


jqTouch (jQuery based)
SenchaTouch (ExtJS + jqTouch + Raphaël)
iScroll 3.0
jqTouch

Combination of HTML, CSS and JavaScript libraries
Designed to emulate native look and feel
HTML + CSS kind of clunky
Worth it for the JS
SenchaTouch

Combination of HTML, CSS and JavaScript libraries
Uses ExtJS (better for app development)
Better performance than jqTouch
Weird license
iScroll

 Not a full framework
 Fixes the scroll problem
 Uncanny valley problem
 Author working on full framework (GhostTouch)
Go Speed Racer!
Image loading is slow
Rendering a gradient, makes an image (use canvas)
Accelerated CSS animations
  opacity
  translate3d (NOT translate)
Use native touch events
Pretending to go Native
 Input fields have
 additional types (email,
 phone, search)
 Turn on/off auto
 correction and auto
 capitalize
 Notification API
 provides alert, confirm
In the Wild

 Memory and CPU are an issue
 There is some arbitrary 10Mb image limit
 Only handles text files (base64 FTW)
 Working Asynchronously is hard
Titanium
Actually go native


 Compiles JavaScript down to symbols
 Symbols link to either Obj-C libraries or Java classes
 Effectively running natively
Wait!
Apple vs. Adobe


Flash CS5 was supposed to do something similar
Apple EULA changed to stop 3rd party compilers
It’s now OK!
Development not as we
know it

Even though it's JavaScript, it's still Desktop*
development
No HTML or CSS. Just JavaScript.
Advantages

Uses native UI widgets
Much faster than WebKit
No crazy square bracket notation
Pretty good abstractions
APIs


Much bigger API than PhoneGap
Mainly generic, some platform specific
Threaded UI means file & database functions return
synchronously
What it looks like
Disadvantages
Documentation is a little lacking. (Though forums are
pretty good)
Structuring code is less defined than on the web
Again, no debugger
Code - Build - Crash cycle much slower than Code -
Refresh cycle
Unit testing is hard
Conclusion


PhoneGap better for non-native UIs, fast prototyping,
simple apps, and web based apps
Titanium better for native UIs. Nice gateway drug for
those of use that don't understand C-pointers
Thanks

Contenu connexe

Tendances

jQuery Conference 2012 keynote
jQuery Conference 2012 keynotejQuery Conference 2012 keynote
jQuery Conference 2012 keynote
dmethvin
 

Tendances (20)

BP101: A Modernized Workflow w/ Domino/XPages
BP101: A Modernized Workflow w/ Domino/XPagesBP101: A Modernized Workflow w/ Domino/XPages
BP101: A Modernized Workflow w/ Domino/XPages
 
The Onion
The OnionThe Onion
The Onion
 
Sfk13
Sfk13Sfk13
Sfk13
 
jQuery Chicago 2014 - Next-generation JavaScript Testing
jQuery Chicago 2014 - Next-generation JavaScript TestingjQuery Chicago 2014 - Next-generation JavaScript Testing
jQuery Chicago 2014 - Next-generation JavaScript Testing
 
Selenium testing
Selenium testingSelenium testing
Selenium testing
 
Web dev syllabus
Web dev syllabusWeb dev syllabus
Web dev syllabus
 
Solutions to Every WordPress Problem Imaginable!
Solutions to Every WordPress Problem Imaginable!Solutions to Every WordPress Problem Imaginable!
Solutions to Every WordPress Problem Imaginable!
 
Ember Overview in 5 Minutes
Ember Overview in 5 MinutesEmber Overview in 5 Minutes
Ember Overview in 5 Minutes
 
High Performance Web - Full Stack Toronto
High Performance Web - Full Stack TorontoHigh Performance Web - Full Stack Toronto
High Performance Web - Full Stack Toronto
 
Setting up your development environment
Setting up your development environmentSetting up your development environment
Setting up your development environment
 
Doing More with LESS for CSS
Doing More with LESS for CSSDoing More with LESS for CSS
Doing More with LESS for CSS
 
How to customise Joomla
How to customise JoomlaHow to customise Joomla
How to customise Joomla
 
FITC - Here Be Dragons: Advanced JavaScript Debugging
FITC - Here Be Dragons: Advanced JavaScript DebuggingFITC - Here Be Dragons: Advanced JavaScript Debugging
FITC - Here Be Dragons: Advanced JavaScript Debugging
 
Building Desktop RIAs with JavaScript and PHP - ZendCon09
Building Desktop RIAs with JavaScript and PHP - ZendCon09Building Desktop RIAs with JavaScript and PHP - ZendCon09
Building Desktop RIAs with JavaScript and PHP - ZendCon09
 
jQuery Conference 2012 keynote
jQuery Conference 2012 keynotejQuery Conference 2012 keynote
jQuery Conference 2012 keynote
 
BBS Selenium & Docker
BBS Selenium & Docker BBS Selenium & Docker
BBS Selenium & Docker
 
Responsive Images and Performance
Responsive Images and PerformanceResponsive Images and Performance
Responsive Images and Performance
 
Maven Tutorial for Beginners | Edureka
Maven Tutorial for Beginners | EdurekaMaven Tutorial for Beginners | Edureka
Maven Tutorial for Beginners | Edureka
 
Joomla SEO basics 2016
Joomla SEO basics 2016Joomla SEO basics 2016
Joomla SEO basics 2016
 
Automated testing with Cypress
Automated testing with CypressAutomated testing with Cypress
Automated testing with Cypress
 

En vedette

Animation Restaurant2
Animation Restaurant2Animation Restaurant2
Animation Restaurant2
tunk
 
สร้าง Soap web services ง่ายๆ
สร้าง Soap web services ง่ายๆสร้าง Soap web services ง่ายๆ
สร้าง Soap web services ง่ายๆ
Utain Wongpreaw
 
Dream mx
Dream mxDream mx
Dream mx
phochai
 

En vedette (17)

Handset Design for Digital India Initiative
Handset Design for Digital India Initiative Handset Design for Digital India Initiative
Handset Design for Digital India Initiative
 
Brew up a Rich Web Application with Cappuccino
Brew up a Rich Web Application with CappuccinoBrew up a Rich Web Application with Cappuccino
Brew up a Rich Web Application with Cappuccino
 
Animation Restaurant2
Animation Restaurant2Animation Restaurant2
Animation Restaurant2
 
Web app
Web appWeb app
Web app
 
Java Web Programming [Servlet/JSP] Using GlassFish and NetBeans
Java Web Programming [Servlet/JSP] Using GlassFish and NetBeansJava Web Programming [Servlet/JSP] Using GlassFish and NetBeans
Java Web Programming [Servlet/JSP] Using GlassFish and NetBeans
 
การจัดกิจกรรมการเรียนรู้ใน Web Application : Edmodo
การจัดกิจกรรมการเรียนรู้ใน Web  Application : Edmodoการจัดกิจกรรมการเรียนรู้ใน Web  Application : Edmodo
การจัดกิจกรรมการเรียนรู้ใน Web Application : Edmodo
 
lesson1 JSP
lesson1 JSPlesson1 JSP
lesson1 JSP
 
Hybrid vs Native vs Web Apps
Hybrid vs Native vs Web AppsHybrid vs Native vs Web Apps
Hybrid vs Native vs Web Apps
 
Java Web programming Using NetBeans
Java Web programming Using NetBeansJava Web programming Using NetBeans
Java Web programming Using NetBeans
 
lesson4 JSP
lesson4 JSPlesson4 JSP
lesson4 JSP
 
สร้าง Soap web services ง่ายๆ
สร้าง Soap web services ง่ายๆสร้าง Soap web services ง่ายๆ
สร้าง Soap web services ง่ายๆ
 
การพัฒนาเอกสารออนไลน์ขั้นสูง Lect 04
การพัฒนาเอกสารออนไลน์ขั้นสูง Lect 04การพัฒนาเอกสารออนไลน์ขั้นสูง Lect 04
การพัฒนาเอกสารออนไลน์ขั้นสูง Lect 04
 
Dream mx
Dream mxDream mx
Dream mx
 
Smart Phone
Smart PhoneSmart Phone
Smart Phone
 
New product development strategy of samsung
New product development strategy of samsungNew product development strategy of samsung
New product development strategy of samsung
 
Web Based Application Development with Open Source
Web Based Application Development with Open SourceWeb Based Application Development with Open Source
Web Based Application Development with Open Source
 
Google Ppt
Google PptGoogle Ppt
Google Ppt
 

Similaire à Smart phone development

Playframework + Twitter Bootstrap
Playframework + Twitter BootstrapPlayframework + Twitter Bootstrap
Playframework + Twitter Bootstrap
Kevingo Tsai
 
HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1
James Pearce
 
HTML5 Presentation
HTML5 PresentationHTML5 Presentation
HTML5 Presentation
vs4vijay
 

Similaire à Smart phone development (20)

Zepto and the rise of the JavaScript Micro-Frameworks
Zepto and the rise of the JavaScript Micro-FrameworksZepto and the rise of the JavaScript Micro-Frameworks
Zepto and the rise of the JavaScript Micro-Frameworks
 
HTML5 Technical Executive Summary
HTML5 Technical Executive SummaryHTML5 Technical Executive Summary
HTML5 Technical Executive Summary
 
Front-End Engineering 101
Front-End Engineering 101Front-End Engineering 101
Front-End Engineering 101
 
Echo HTML5
Echo HTML5Echo HTML5
Echo HTML5
 
HTML5 - The Python Angle (PyCon Ireland 2010)
HTML5 - The Python Angle (PyCon Ireland 2010)HTML5 - The Python Angle (PyCon Ireland 2010)
HTML5 - The Python Angle (PyCon Ireland 2010)
 
Getting started with Emscripten – Transpiling C / C++ to JavaScript / HTML5
Getting started with Emscripten – Transpiling C / C++ to JavaScript / HTML5Getting started with Emscripten – Transpiling C / C++ to JavaScript / HTML5
Getting started with Emscripten – Transpiling C / C++ to JavaScript / HTML5
 
Workshop HTML5+PhoneGap by Ivano Malavolta
Workshop HTML5+PhoneGap by Ivano Malavolta Workshop HTML5+PhoneGap by Ivano Malavolta
Workshop HTML5+PhoneGap by Ivano Malavolta
 
GWT = easy AJAX
GWT = easy AJAXGWT = easy AJAX
GWT = easy AJAX
 
HTML5: the new frontier of the web
HTML5: the new frontier of the webHTML5: the new frontier of the web
HTML5: the new frontier of the web
 
Web II - 01 - Introduction to server-side development
Web II - 01 - Introduction to server-side developmentWeb II - 01 - Introduction to server-side development
Web II - 01 - Introduction to server-side development
 
From Flash to Canvas - a penchant for black holes
From Flash to Canvas - a penchant for black holesFrom Flash to Canvas - a penchant for black holes
From Flash to Canvas - a penchant for black holes
 
HTML5 Comprehensive Guide
HTML5 Comprehensive GuideHTML5 Comprehensive Guide
HTML5 Comprehensive Guide
 
An introduction to Titanium
An introduction to TitaniumAn introduction to Titanium
An introduction to Titanium
 
December 4 SDForum Java Sig Presentation
December 4 SDForum Java Sig PresentationDecember 4 SDForum Java Sig Presentation
December 4 SDForum Java Sig Presentation
 
Vaadin intro at GWT.create conference
Vaadin intro at GWT.create conferenceVaadin intro at GWT.create conference
Vaadin intro at GWT.create conference
 
HTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersHTML5 Intoduction for Web Developers
HTML5 Intoduction for Web Developers
 
Playframework + Twitter Bootstrap
Playframework + Twitter BootstrapPlayframework + Twitter Bootstrap
Playframework + Twitter Bootstrap
 
DevTeach Ottawa - Silverlight5 and HTML5
DevTeach Ottawa - Silverlight5 and HTML5DevTeach Ottawa - Silverlight5 and HTML5
DevTeach Ottawa - Silverlight5 and HTML5
 
HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1
 
HTML5 Presentation
HTML5 PresentationHTML5 Presentation
HTML5 Presentation
 

Dernier

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 

Dernier (20)

presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
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...
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
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
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
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...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
 
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
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
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
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 

Smart phone development

Notes de l'éditeur