In this talk Alexey will once again compare Web and Mobile, but this time with a little twist. Alexey will be talking about the problems he encountered in Mobile, which does not arise in the Web, and what solutions were found. Talk will have a number of plot twist and will include the following topics: - Why Web and Mobile are so different? - Common pitfalls in Mobile projects - Comparison of Mobile solutions - How can we improve Mobile

1. Mobile Fresh
Alexey Buzdin
January 2014

2. Speaker
Android and Java enthusiast at
@AlexeyBuzdin!
LArchaon
alex.buzdin@gmail.com

3. Table of Content
•
Mobile vs Web++
•
What makes Web simple and attractive
•
What are the pitfalls developing mobile apps
•
Android vs iOS
•
Interesting Android facts
@AlexeyBuzdin!
LArchaon
alex.buzdin@gmail.com

4. DISCLAIMER
All characters, events, thoughts
and ideas used in this presentation
— even those based on real life —
are entirely fictional and purely
subjective to speaker opinion.
:)

5. Round 1
0:0
Growth

7. 1995 to Present Day

11. Web had >20 years to
evolve

12. Mobile as we know it today
June 29, 2007 - 7 years ago
July 9, 2008 - 6 years ago

13. 2008 to Present Day

16. Number of mobile phones to
exceed world population by 2014
iOS and Android - 1 million+ apps
http://www.digitaltrends.com/mobile/mobile-phone-world-population-2014/

18. Mobile
1:0
[G
ro
ws
f
as
ter
]

19. Round 2
1:0
Learning Curve

20. Mobile vs Web

21. Technologies

22. <span id="button"> Button </span>
!
var button = document.getElementById("button");
button.addEventListener("onclick",function() {
window.alert( “Hello World." );
});

23. !
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button"
android:text="Button"
android:onClick=“click"/>
!
public void click(View button) {
Toast.makeText(context, "Hello World", 0).show();
}

24. <Button x:Name="Button"
Content="Button" Click=“Button_Click"/>
!
private void Button_Click(object sender, RoutedEventArgs e) {
MessageBox.Show(“Hello World", "Caption",
MessageBoxButton.OK);
}

26. @property (weak, nonatomic) IBOutlet UIButton *button;
!
- (IBAction)buttonClick:(id)sender {
UIAlertView *alert = [[UIAlertView alloc]
initWithTitle:@"Caption"
message:@"Hello World"
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
!
[alert show];
}

27. I smell trouble
•
@property (weak, nonatomic) IBOutlet UIButton *button
!
•
Every time Xcode opens a XIB / Storyboard, it will also
change a minute detail in the XML format. Are you using
version control system?
!
•
Merges on XIBs and Storyboards can go horribly wrong,
because their XML formats were not meant to be
merged.

28. And at least
Web has some ‘Standards'

29. 3 platforms vs 1
Cross Platform?

30. Cross platformers
•
Must be a native app-store app
•
Must use native-looking UI controls.
•
Must perform, even last-gen phones
•
Must support at least iPhone & Android & WP
•
Must have extensive documentation and community
•
Must upgrade to new OS releases in time

31. Available Options
• Embedded
• Build
• VM
WebView
to native code

32. mGWT
Codename One
Apportable
RoboVM
Xamarin

33. Corona
!
RhoMobile
!
DolphinPHP
!
Adobe Air

34. PhoneGap
Sencha Touch
Titanium

35. Not Mentioned*
*Game Engines

36. Embedded WebView
As of Android 4.4 - WebView is now built on Chromium

37. Embedded WebView
iOS UIWebView lacks Nitro Javascript engine.
This makes executing Javascript much slower compared to Safari.

38. Native UI?

39. Native UI

42. Releases

43. Cross platformers
•
•
•
•
•
•
d]
e
rm
nfi
Must be a native app-store app
Co
[
e]
bl
si
lau
Must use native-looking UI controls.
[P
e]
ibl
us
la
Must perform, even last-gen phones
[P
d]
e
rm
nfi
Must support at least iPhone & Android & WP Co
[
e]
bl
Must have extensive documentation and community i
us
la
[P
e]
bl
Must upgrade to new OS releases in time
si
lau
[P

44. Web
1:1
[E
as
ier
to
Le
a
rn
]

45. Round 3
1:1
Ease of Development

46. Web frameworks
and countless others JS and CSS frameworks in the wild

47. Android libraries?
•
HoloEverywhere - backport Holo theme & widgets from
Android 4.* to 2.1+
•
Robolectric - run test inside the JVM on your workstation in
seconds.
•
RoboGuice - framework that brings the simplicity and ease of
Dependency Injection to Android
•
AndroidAnnotations - framework that speeds up Android
development using annotations.
•
ActionBarSherlock - backport ActionBar from Android 4.* to
2.1+

48. Android - January 2013

49. Android - January 2014

50. Android libraries?
That’s basically it folks

51. Dev Environment

52. Dev Environment
jsbin.com
jsfiddle.net
hongkiat.com/blog/cloud-ide-developers

53. Pitfalls
•
Adaptive design
•
Backport functionality
•
Optimisation for markets
•
Memory management
•
Besting speed

54. Adaptive?

55. Mobile

56. Should be adaptive by
default

57. Should be adaptive by
default
Also problems with images

58. Pitfalls
•
Adaptive design
•
Backport functionality
•
Optimisation for markets
•
Memory management
•
Besting speed

59. Backport and optimisation
•
No ActionBar in Android < 3.0
•
No Fragments in Android < 3.0
•
Kindle, OUYA, etc markets require additional configs
•
iOS7 features does not work on <iOS7 (3G, 3GS)
•
Supporting iPhones and iPads require additional work

60. Support libraries

61. No proper packet management!
github.com/mosabua/maven-android-sdk-deployer

62. Pitfalls
•
Adaptive design
•
Backport functionality
•
Optimisation for markets
•
Memory management
•
Besting speed

63. Memory management
Passing image from one screen to another …
Screen 1
Screen 2
Image
Image
Memory leak!

64. Memory management
Changing orientation and not handling ongoing request …
Memory leak!

65. Pitfalls
•
Adaptive design
•
Backport functionality
•
Optimisation for markets
•
Memory management
•
Besting speed

66. Bottleneck candidates:
Images and HTTP

67. Web
[E
1:2
as
ier
to
De
ve
lop
]

68. Round 4
1:2
Ease of Testing

69. Mobile vs Web

70. Testing Web
2-3
html5test.com
caniuse.com

73. Test online
developer.samsung.com/remotetestlab
AppThwack
appthwack.com
testdroid.com
perfectomobile.com

74. Web
1:3
[E
as
ier
to
Te
s
t]

75. thus …

76. Mobile is still Fresh
1:3

77. Save Mobile,
get involved
:)