As mobile device usage has skyrocketed in recent years, mobile applications have emerged as the key engagement channel for businesses to connect with their most valuable customers. Mobile app usage represents more than 85% of total mobile device time, and users now spend more time with apps than they do with television. This makes it imperative to think from a mobile-first perspective and ensure consistent user experience.

1. © AKAMAI - EDGE 2017
Improving Mobile Performance – simple tips and tricks
Senior Lead
Service Architect
Bhagirath Gaonkar
Technical Project
Manager ll
Saili Shaha

2. © AKAMAI - EDGE 2017
Improving Mobile Performance – simple tips and tricks
Saili Shaha and Bhagirath Gaonkar

3. © AKAMAI - EDGE 2017
Name
Lorem ipsum dolor
sit amet,
consectetuer
adipiscing elit.
Aenean.
Name
Lorem ipsum dolor
sit amet,
consectetuer
adipiscing elit.
Aenean.
Name
Lorem ipsum dolor
sit amet,
consectetuer
adipiscing elit.
Aenean.
Name
Lorem ipsum dolor
sit amet,
consectetuer
adipiscing elit.
Aenean.
Meet the Presenters
Bhagirath
Gaonkar
Senior Lead
Service Architect
Saili
Shaha
Technical Project
Manager ll

4. © AKAMAI - EDGE 2017
Agenda
The importance of Mobile Performance to Business1
Network Protocols2
Mobile App Performance3
Image Optimizations4
Miscellaneous Improvements5

5. © AKAMAI - EDGE 2017
of visits to mobile sites are abandoned after 3 seconds according to research
from Google's DoubleClick.53%
drop in page views for a 4 second delay that Optimizely added via an artificial
latency to the Telegraph11%
increase in conversions for every 1 second of improvement in load time.
Every 100ms improvement also resulted in up to a 1% increase in revenue.2%
drop in revenue for a 1 second delay in Bing results. Two second delay results
in 4.3% drop.2.8%
drop in revenue for a 100ms delay in load time at Amazon1%
Performance Impacts Business Metrics
https://wpostats.com

6. © AKAMAI - EDGE 2017
Recent Data Validates What We Already Know

7. © AKAMAI - EDGE 2017
Mobile Web Desktops Mobile Apps
Conversions
1.5X
Mobile users spend more money
2X

8. © AKAMAI - EDGE 2017
Mobile users have a lower tolerance for delays

9. © AKAMAI - EDGE 2017
Development &
Deployment Complexity
It’s Never Been Harder to Deliver Great Mobile
Experiences
Unreliable Internet & Data
Center Infrastructure
User Fragmentation across
Devices, Sites, & Apps
Unpredictable
Cellular Connectivity
End-to-End Challenges
Easier to Develop
and Deliver Great
Experiences
Harder to Develop
and Deliver Great
Experiences
Internet

10. © AKAMAI - EDGE 2017
Network Protocols

11. © AKAMAI - EDGE 2017
Why IPv6?
Gartner Says 8.4 Billion Connected "Things" Will Be in Use in 2017
http://www.warwicknet.com/blog/introduction-ipv6

12. © AKAMAI - EDGE 2017
IPv6 Benefits for Mobile Websites and Applications

13. © AKAMAI - EDGE 2017
Mobile App Performance

14. © AKAMAI - EDGE 2017
49%
of users expect a
mobile app to respond
in 2 seconds or less
HP Enterprise, “What’s your FunDex?”
80%
will use a problematic
app three times or less
TechBeacon, “2015 Mobile App Usage
and Abandonment Survey”, 2015
Mobile App Users are Extremely Sensitive to Performance
40%
uninstall apps based
on a prior unsatisfactory
experience
Marketing Profs, “Mapping a Mobile App
User’s Journey From Discovery to Purchase”
Infographic, 2016

15. © AKAMAI - EDGE 2017
Edge
Servers
Extend Akamai all the way to the device (SDK) Akamaized Route (TODAY)
Extend Akamai to the device

16. © AKAMAI - EDGE 2017
Network Awareness
Adapt resources and app behavior based on network quality
SureRoute for Cellular
Identify the fastest path through the mobile network to the Akamai Edge
Contextual Pre-Positioning
Instantaneous app views and seamless browsing, even offline
Mobile User Analytics
App insight into changing network & device conditions
Mobile Application Performance SDK
Universal Cache
Enables caching of resources within the mobile app

17. © AKAMAI - EDGE 2017
Network Awareness
Send hints to Akamai to optimize images and content
Augment server side responses based on client side congestion
SDK Automatically hints Akamai Server about
Network Quality

18. © AKAMAI - EDGE 2017
{ do lean-app()};
{ do everything()};
If n/w quality == LOW
If n/w quality == HIGH
Tailor the app
experience
Tailor experience to network conditions

19. © AKAMAI - EDGE 2017
Tailor the app
experience
Tailor the cached
content
If n/w quality == LOW
If n/w quality == HIGH
9 KB
99 KB
AIC
Tailor experience to network conditions

20. © AKAMAI - EDGE 2017
If n/w quality == LOW
If n/w quality == HIGH Origin
Tailor the app
experience
Tailor the cached
content
Tailor the origin
content
Return 5
searches
Return 48
searches
Tailor experience to network conditions

21. © AKAMAI - EDGE 2017
ISP region 1
ISP region 2
Selects the closest and the “fastest” server for your
request
Test results have shown ~20% improvement
over cellular
SureRoute for Cellular

22. © AKAMAI - EDGE 2017
Contextual Pre-Positioning
Define what content to push and to whom and when
Select Network Type
(wifi or cellular or both)
Set Download limits
(MB/device/day)
Set Time Windows
(hr:min)
Content Hold Time
(hr:min)

23. © AKAMAI - EDGE 2017
Better visibility into real user performance

24. © AKAMAI - EDGE 2017
50%see pages in 2 seconds
over cellular!

25. © AKAMAI - EDGE 2017
Image Optimizations

26. © AKAMAI - EDGE 2017
Image Optimizations for Mobile - Why Worry?

27. © AKAMAI - EDGE 2017
Image Optimizations for Mobile – Image Manager
Screen Size:
315 x 420
900 x 1200
1.2MB
450 x 600
185KB
Automatic Resize for Mobile (viewport)
Format
Size vs.
JPEG
Browser Support
JPEG N/A All
WebP -35%
JPEG XR -30%
JPEG 2000 -30%
Convert to Optimal Format for Software/Browser/File
Example Policy: Watermark with Breakpoints
Resize:
 Thumbnail: Mobile, Tablet, Desktop
 Main: Mobile, Tablet, Desktop
 Zoom Image: Mobile, Tablet, Desktop
Quality:
Perceptual Medium-High
Watermark:
Lower left corner, watermarkimage.jpg
Policy Driven Artistic & Technical Transformations
<img src=“http://example.com/img/model-black-car-
headlight.jpg?policy=zoom”>
Original Automatic Perceptual Quality
Automatic Perceptual Quality Algorithm
Q = 85
61KB
Q = 75
48KB

28. © AKAMAI - EDGE 2017
What is the impact of using Image Manager
Improvement
in page load
time overall

29. © AKAMAI - EDGE 2017
Image Manager Demo

30. © AKAMAI - EDGE 2017
Miscellaneous Improvements

31. © AKAMAI - EDGE 2017
Miscellaneous Tips
Time out detection and
fail-over
Enable HTTP/2
Optimum cache-
fragmentation for higher
cache-hit ratio
Smart balancing in
cloud using
Cloudlets

32. © AKAMAI - EDGE 2017
When you master mobile, customers are
more likely to:
Browse more pages
Spend more time on Apps
Engage more often
Spend more money
on products
Share positive experiences
with family, friends, and on
social media

33. © AKAMAI - EDGE 2017

34. © AKAMAI - EDGE 2017
Appendix

35. © AKAMAI - EDGE 2017

36. © AKAMAI - EDGE 2017
Image Optimizations for Mobile - Adaptive Image Compression

37. © AKAMAI - EDGE 2017
By 2020, 4 out of 5 people worldwide will own a smartphone.
That’s a total of roughly 6.1 billion mobile users. Many of these users will never
have used a desktop computer or landline. [source]
Mobile shoppers are more engaged than desktop shoppers.
57% of tablet users conduct product searches at least once a week, compared to
37% of desktop users. [source]
Mobile users shop more.
35% of tablet and smartphone users make at least one online purchase per week
via mobile, compared to just 15% of desktop users. [source]
M-Commerce is on the rise
In the US, currently only about 15% of online transactions take place via mobile
devices. In Japan, South Korea, and the UK, that number is approaching — or in
the case of Japan, exceeding — 50%. [source]
Mobile users spend more
The Importance of Mobile Performance
https://www.soasta.com/blog/23-stats-mobile-web-performance-monitoring/

38. © AKAMAI - EDGE 2017
Mobile Application Performance SDK
Excellent
Good
Poor
● Display highest quality images and videos
● Reduce image compression levels to reduce server side processing time
● Enable instant content within apps via segment based pre-positioning
● Optimize dynamic content and TTFB with Multipath/ SureRoute for Cellular
● Increase image compression to reduce transport latency
● Dynamically decrease image resolution
● Reduce API calls and replace with static content requests
● Maximize image compression
● Minify query responses to reduce the payload
● Default to intelligently pre-positioned content for offline availability
● Monitor and report on actual app performance
We provide network quality awareness and situational performance optimizations for mobile
app developers so they can provide the highest quality experience to their end users

39. © AKAMAI - EDGE 2017
Mobile Content

40. © AKAMAI - EDGE 2017
Image Optimizations for Mobile – Image Manager
Leverage Image Manager to deliver an optimal
image to each device automatically
• Browser specific formats can be
automatically leveraged for WebView
initiated requests
• Deliver optimal image size (viewport)
• Chroma Subsampling reduces memory
footprint on device
• Perceptual Quality results in faster images

41. © AKAMAI - EDGE 2017
User Engagement For Mobile Web vs Apps

42. © AKAMAI - EDGE 2017
22
5.7
Products viewed per user
Percentage added to basket
24%
13%
Percentage of transactions
54%
44%
Apps Mobile Web
How do we help solve it ?
Preload rich and personalized content to
the right users ahead of time
● Identify the fastest and optimal
cellular region for dynamic
transactions
● Make real time optimization
decision based on network quality
Measure events within the app that are
critical for conversion and help unearth
poor performance areas within your app
RETAIL
Apps on an average have more conversions than mobile web
Source: wall street journal, April 2016, shoppers flock to apps shaking up retail
What does this mean for an app ?
More rich content requested per second
through a congested network
Failure of dynamic transactions leads to
cart abandonment and reduces
conversion rates
Lack of visibility into app performance
issues will lead to lower user retention
rates.