understand and overcome mobile web performance challenges

www.yottaa.com | www.marlinmobile.com

Understand and Overcome!Mobile Web Performance

www.yottaa.com | www.marlinmobile.com 2#mobileweb @yottaa @marlinmobile

Your Presenters

Ari WeilVP of Products, Yottaa@aweil

Adrian MendozaCo-founder, Marlin Mobile@marlinUX

www.yottaa.com | www.marlinmobile.com 3

Agenda

#mobileweb @yottaa @marlinmobile

Mobile: much ado about...what exactly?Smaller is only the beginningOptimization best practicesOvercome and winQ&A


20% of electronics purchases using mobile35% of mobile visitors prefer www to m.site80% of mobile revenue from full site browsing


Why is everyone so focused on mobile?


Mobile traffic - it’s just the tip of the iceberg


0.7 Billion


Plus, it’s a part of virtually every transaction


So you see, this “small” problem can be BIG

51% say websites hard to navigate & use

46% say product images are too small

41% are concerned about security26% feel that checkout is frustrating


And when you get it wrong, you lose…BIG

64%OF SMARTPHONE USERS EXPECT PAGES TO LOAD IN

UNDER 4s

$1BnAPPAREL &ACCESSORIESPURCHASES

in Q113

71%Of all retail transactions

SMARTPHONEUSERS SHOPVIA MOBILE

48%

Expect mobile to be fasterthan desktop

85%Will go to a competitorto transact

42%Will neverreturn toyour site

29%


Don’t be that business

that if they arrive on a business site that isn't working well on mobile, they take it as an indication of the

48% of users saybusiness simply does not care.


Smaller is only the beginning.


Know the mobile ecosystem

This is your mobile experience now…

…its complicated


And what goes into loading a web page

Images

Javascript

Via HTTPArchive, May ‘13-’14


Now consider the average eCommerce page


Trust Icons

High-Res Images

Long-scrolling pages

Social Media

Dynamic Content

In Addition:• A/B Tests• Analytic tracking• Beacons• Chat• Personalization• Pixels• RWD w/out RESS

Visitors expect fast, flawless

experiences on any device

Marketing needs social media and other tags to engage visitors

IT needs control to ensure speed, scalability and security


Cannot impact 3rd party dynamic content like social

media or ads

CONTENT DELIVERY NETWORKS


Reality: ever-growing content and complexityPA

GE LO

AD T

IME IT EFFORT & TIM

E

SITE LAUNCH ONGOING MAINTENANCE AND USER ENGAGEMENT EFFORTS

UPDATE CONTENT & IMAGES

ADD SOCIAL MEDIA WIDGETS

ADD REAL TIME PERSONALIZATION

A/B TEST PAGE CONTENT

Hiding components cannot keep pace with ongoing User & Marketing needs

Cannot control page load behavior, content

priority

FRONTEND OPTIMIZATION

Manual effort for every content change

DO IT YOURSELF


Optimization best practices.


Implement Responsive Web Design


Advantages Disadvantages

Most consistent user experience possible Requires additional code re-working

No duplicate content maintains rankings Difficult to differentiate mobile content

Max link value. No risk of split link value Could affect usability/CRO

No redirects = low latency & fewer errors New code may affect rankings


Responsive Web Design Dirty Little Secret


ALL websites are exactly the same in page size and requests!


Little r – presentation mostly– Fluid, flexible layout– Media queries– Responsive imagesBig R– Dynamic serving

BOTH are better than


The difference between little r and big R


Fact: Reducing Page Weight/Requests Works

increased performance by

68%by reducing

HTTP requestssmall page-

1.5s

big page – 4.7s


Desktop: 78 requests, 5.1sec load time

Mobile: 38 requests, 20.8sec load time


Reduce requests

Still loading…

So what went wrong?


Fact: Mobile behaves differently

Example:parallelizing requests HURTS mobile experience

22#mobileweb @yottaa @marlinmobile www.yottaa.com | www.marlinmobile.com

Myth #1: A CDN solves everything

Example:Cloud storage being used for image assets


Myth #2: Design for First Paint is enough

Time to First Paint:5 seconds

Your users radio stays on for an additional 12 seconds burning their battery.


Myth #3: Delay-loading 3rd party assets wins

Example:analytics tag keeps the page from completely loading

Time to First Paint:5 seconds


Overcome and win.


Optimizations that work (but…TNSTAAFL)

Treats Middle mile geographic latencyGood for Individual assets, streaming mediaChallenges

Visitor contextRelated assetsVersioningCD

NTreats Content weight, round tripsGood for Efficient asset delivery, renderingChallenges

Visitor contextDevice capabilitiesOngoing care & feedingFE

O


Yottaa: holistic site optimization service

See business results before you buywww.yottaa.com/prove-it

40% FASTERInstantON AppSequencing

MORE CONTROLContextIntelligence

DEEP INSIGHT


Marlin Mobile: Monitor your mobile web

Get insights from REAL mobile devicesSee your REAL customer view on mobileSign up for a free account – marlinmobile.com/free

Get insight and data on your ENTIRE mobile ecosystem.

THANK YOU

#mobileweb @yottaa @marlinmobile www.yottaa.com | www.marlinmobile.com 29

understand and overcome mobile web performance challenges

Presentations & Public Speaking