mobile web performance dwx13
TRANSCRIPT
![Page 1: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/1.jpg)
mobile web performance
@rolandguelle | Sevenval GmbH
![Page 2: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/2.jpg)
about:sevenval
•Web Expert since 1999Adaptive One Web Infrastructure Technology
Future Friendly web design expertiseHighly experienced: over 800 accomplished projects
•Offices in Cologne, Berlin, London and Vienna
•Our Clients: Fortune 500 and DAX companies
•Our Partner: PayPal, Interone, GSI Commerce, CoreMedia, Wincor Nixdorf, T-Systems, etc.
![Page 3: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/3.jpg)
Why?
![Page 4: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/4.jpg)
Who likes slow loading web sites better
than fast ones?
Why?
![Page 5: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/5.jpg)
Why?Who likes slow loading web sites better
than fast ones?
...you should leave now ;)
![Page 6: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/6.jpg)
The problem withThe Web on Mobile.
Sevenval Device Lab / Android & iOS with Adobe Edge Inspect
![Page 7: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/7.jpg)
The Web on Mobile.
•Mobile is mainstream
•Mobile will overtake is overtaking desktop
•But mobile is different!
![Page 8: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/8.jpg)
Mobile is Di!erent
•Powerful browsers
•CPU & GPU
•Memory
•Battery
•Connections
•Parallel downloads
•Cellular vs. wifi
•High latency
![Page 9: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/9.jpg)
The Developers‘ View
http://www.flickr.com/photos/nathij/3126806723
• Browser & OS & Version fragmentation• -webkit- fragmentation
• HTML5 fragmentation• Thousands of devices• Transcoding browsers (Opera Mini, Amazon
Silk, Nokia Express, ...)• Carrier transcoding• Upcoming Platforms (Firefox OS, Ubuntu,
Tizen, BB10...)• Legacy Platforms (Symbian, Bada,
BlackBerry, ...)• ...make it work!
![Page 10: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/10.jpg)
What is Performance?
http://www.flickr.com/photos/laserstars/908946494
•Latency for a single user
•Capacity of the whole system
•We are talking about latency here
![Page 11: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/11.jpg)
Why Performance matters?
http://www.flickr.com/photos/adamcrowe/2236109611
![Page 12: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/12.jpg)
We ♥ Fast Websites!
![Page 13: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/13.jpg)
What Users Want From Mobile?
...62% agreed that speed was the most important feature for them while browsing the mobile web, followed by ease of use (42%), more functionality (30%) and saving money and data (29%).
http://business.opera.com/press/releases/mobile/brazil-feels-the-need-for-speed
![Page 14: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/14.jpg)
http://www.webperformancetoday.com/2011/11/23/case-study-slow-page-load-mobile-business-metrics/
Users Hate Slow Websites
![Page 15: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/15.jpg)
May 29, 2008
„When the company (Google) trimmed the 120KB page size down by about 30 percent, the company started getting about 30 percent more map requests.“
http://news.cnet.com/8301-10784_3-9954972-7.html
![Page 16: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/16.jpg)
•Shopzilla speed up average page load time from 6 seconds to 1.2 seconds.
•Result: 12% increase in revenue.
http://velocityconf.com/velocity2009/public/schedule/detail/7709
Your Boss ♥ Fast Websites
![Page 17: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/17.jpg)
Real World Check
http://www.flickr.com/photos/mumpfpuffel/2349081281
![Page 18: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/18.jpg)
„The extent of consumer annoyance is hardly surprising when we consider the average Briton estimates that they waste 9 minutes every day,
or 2 days a year, waiting for slow websites to load.“
http://press.1and1.co.uk/xml/article?article_id=1123http://www.flickr.com/photos/donkeyhotey/5679642883/
![Page 19: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/19.jpg)
We waste9 minutes a day, 2 days a year, 0.56% our lives
for waiting on slow websites?!
![Page 20: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/20.jpg)
How fast is your site?
•5 seconds
•less than 5 seconds?
•more than 5 seconds?
![Page 21: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/21.jpg)
Germany Retail – Mobile – O2/iPhoneJuly 01, 2012 - August 01, 2012 / 0:00 - midnight
18.9 sec?!
Average
http://www.gomez.com/germany-retail-mobile
![Page 22: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/22.jpg)
27.7 sec????
Average
http://www.compuware.com/en_us/application-performance-management/resources/benchmarks/germanyretail-mobile-o2-iphoneDERETIRMBHPiPhone010.html
Germany Retail – Mobile – O2/iPhoneMay 01, 2013 - June 01, 2012 / 0:00 - midnight
![Page 23: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/23.jpg)
Sites are growing
http://mobile.httparchive.org/trends.php#numurlshttp://httparchive.org/trends.php#numurls
1466kB Mobile: 764kB
![Page 24: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/24.jpg)
https://twitter.com/scottjehl/status/332871134934626306
http://de.slideshare.net/bryanrieger/the-end-of-unlimited-bandwidth
![Page 25: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/25.jpg)
39kB HTML
150kB JavaScript
526kB Images
27kB CSShttp://mobile.httparchive.org/trends.php?s=All&minlabel=Jan+1+2013&maxlabel=Jun+15+2013#bytesHtml&reqHtml
![Page 26: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/26.jpg)
JavaScript FrameworksApple WWDC 2012 http://vaporjs.com
Don‘t use jQuery for everything...
![Page 27: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/27.jpg)
RWD will save us!
![Page 28: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/28.jpg)
„...I used http://mediaqueri.es/ as a repository (471 websites) ... resized to one of 4 different
screen resolutions each time ... less than 7% of websites were at least 2x smaller when loaded on the smallest screen compared to the biggest screen. Another 22% weighed between 50-90% of the large-screen page size when loaded on the smallest one, and the majority (72%) were roughly the same size on the smallest and biggest screens.
http://www.guypo.com/uncategorized/real-world-rwd-performance-take-2/
![Page 29: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/29.jpg)
D‘OH!
![Page 30: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/30.jpg)
You can’t fix what you can’t measure.
http://www.flickr.com/photos/tiffanyday/2929861461
![Page 31: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/31.jpg)
Client Measuring
•Client
•Real Device
•Simulator
•User-Agent String
•Test Instanz
•Connection
•Carrier Network
•Rewriting Proxies
•WiFi
•Bandwith
![Page 32: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/32.jpg)
Tools
•www.webpagetest.org
•Google PageSpeed Insights
•https://developers.google.com/speed/pagespeed/insights
•Yahoo! YSlow
•.. and thousands more out in the web – find ‘em, use ‘em!
http://slideshare.net/klick_ass/mobile-web-testing-debugging-best-practices
![Page 33: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/33.jpg)
WebPageTest.org
•all waterfall charts are made with WPT
•we use an private instance
•Test types: 1st view vs repeat view
•Script user navigation with flow views
![Page 34: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/34.jpg)
Understanding Waterfall Charts
•Server vs Client time
•Time to first byte
•# Connections
•# HTTP-Requests
•Dependencies (Critical Path)
•# Domains/Origins
•Document Complete
![Page 35: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/35.jpg)
Server vs. Client
Where to optimize?
![Page 36: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/36.jpg)
Server vs. Client
Server17%
Client83%•Server 10-30%
•Client 70-90%
![Page 37: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/37.jpg)
Bottlenecks
http://www.flickr.com/photos/kino/438237794/
![Page 38: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/38.jpg)
<outbreakname=“Making a Mobile
Connection“>
![Page 39: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/39.jpg)
http://www.stevesouders.com/blog/2011/09/21/making-a-mobile-connection/http://www.research.att.com/articles/featured_stories/2011_03/201102_Energy_efficient
Radio Connections
2 sec delay 1.5 sec delay
![Page 40: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/40.jpg)
Mobile Networks
Delay
Limited connections
OperatorNetwork
Limited bandwith
OperatorTranscoding?
Internet
http://www.stevesouders.com/blog/2011/09/21/making-a-mobile-connection/http://www.research.att.com/articles/featured_stories/2011_03/201102_Energy_efficient
![Page 41: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/41.jpg)
Network Latency
http://www.cisco.com/en/US/solutions/collateral/ns341/ns525/ns537/ns705/ns1175/Cloud_Index_White_Paper.htmlhttp://www.yuiblog.com/blog/2010/04/08/analyzing-bandwidth-and-latency/
DSL without Fastpath:40-50ms
~ 350ms
![Page 42: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/42.jpg)
</outbreak>
![Page 43: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/43.jpg)
•Consider load & render dependencies
•CSS loading/parsing blocks image loading
•inline JS/CSS blocks new external requests
•Image/ressource loading blocks document complete
Critical Path
![Page 44: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/44.jpg)
Time to First Byte
•DNS Lookup + TCP Connection + SSL Handshake + HTTP Request + Server Processing + transfer of first TCP packet
•Always critical path
![Page 45: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/45.jpg)
Connections•DNS lookup for every domain (and
CNAMEs)
•TCP handshake takes time
DNS
TCP handshake
![Page 46: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/46.jpg)
HTTP Requests•The biggest problem!
•More requests, more connections
•Total of 2-6 connections per domain
•Each Request: Upload on slow connections
•Size does matter: More content, longer downloads
•Mobile specific: Download on sloooow connections
![Page 47: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/47.jpg)
CSS loading/parsing blocks image loading
Critical Path
CSS Rendering
![Page 48: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/48.jpg)
Critical Path
Image/ressource loading blocks document complete
font blocksdocument complete
![Page 49: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/49.jpg)
Document Complete
•document complete blocks onload-events
•onload-events (may) block user interaction
•usually trigger for unobtrusive JavaScript
![Page 50: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/50.jpg)
Bottlenecks
•The mobile Web is slooooow
•Connections has delays, are slow and limited
•Sites are too big
•Too many requests / connections needed
•Critical Path consider load & render dependencies
•css blocks images
•image blocks document complete
•blocking JS
•rendering / painting
•DOM manipulation = rerendering
![Page 51: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/51.jpg)
Fix it!
http://www.flickr.com/photos/thomashawk/4927579251
Software
![Page 52: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/52.jpg)
Our Approach
http://www.netmagazine.com/tutorials/getting-started-ress
http://slideshare.net/4nd3rsen/ress-responsive-design-server-side-components-10084972
![Page 53: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/53.jpg)
Measures
![Page 54: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/54.jpg)
•Enable
•keep-alive
•compression (gzip) / excluding images
Must-Have
![Page 55: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/55.jpg)
E!ectw/o gzip w/ gzip 36%
w/o keep-alive
![Page 56: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/56.jpg)
•Image resizing
•Image quality
•Depend on network quality
•Server Side Content Filter (Server Side Media Queries)
•HTML, JavaScript & CSS
Reduce Transfer Size
![Page 57: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/57.jpg)
Browser Dependencies
•<script async HTML5 attribute/>
•Non blocking JS loader (RequireJS, LabJS, head.js, )
•Order of inline & extern scripts
http://www.netmagazine.com/features/essential-javascript-top-five-script-loaders
![Page 58: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/58.jpg)
Reduce Content
•JS minifying for inline & external code
•CSS minifying for inline & external code
•switch bitmap image formats (GIF -> JPG)
•JPEGs performs better than GIFs and PNGs
![Page 59: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/59.jpg)
Reduce HTTP Requests
• Inline images
• Inline scripts
• Inline styles
• „JS pipe“
![Page 60: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/60.jpg)
Inline Images Disabled
25 of 38 requests
![Page 61: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/61.jpg)
Inline Images Enabled
3 of 16 requests
![Page 62: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/62.jpg)
•must be <2k
•must appear only once
•works in src‘ed CSS, too! (Think sprites)
•for all other images:
•developer enables inlining
Autoinline Images
![Page 63: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/63.jpg)
Delayed Images
•unblocks document onload
•events trigger MUCH earlier
•with fold-logic
•„important“ images first
•invisible slider images last
•header first, footer last..
![Page 64: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/64.jpg)
Low Quality Previews
•Large images get l/q previews
•preview may be inlined
•Big image is loaded after onload
•Looks like progressive images
•Gives a complete look right from the start
![Page 65: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/65.jpg)
•external scripts can be cached and combined (good)
•least size of script for each page (good)
•many HTTP requests on first view (BAD)
External Scripts
![Page 66: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/66.jpg)
External Scripts
12 requests
![Page 67: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/67.jpg)
JS „Pipe“ & Application Cache
•All scripts are delivered in a single request per page
•Minimize HTTP roundtrips
•Core Scripts are stored in Application Cache
•Not affected by „reload“
•Scripts still public cacheable (CDN)
![Page 68: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/68.jpg)
only 1 request
JS „Pipe“ & Application Cache
![Page 69: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/69.jpg)
Caching
•Assets are requsted on every page request
•Make sure they are cacheable!
First View
![Page 70: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/70.jpg)
Caching
•cache assets forever (+ cache buster)
•/path/;lm=1332923272/layout.css
•no sub-requests on repeat/flow views
Repeat View
![Page 71: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/71.jpg)
<outbreakname=“HTTP Caching“>
![Page 72: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/72.jpg)
Caching?
http://mobile.httparchive.org/trends.php#maxageNullhttp://www.stevesouders.com/blog/2012/03/22/cache-them-if-you-can/
![Page 73: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/73.jpg)
Caching?
http://mobile.httparchive.org/trends.php#maxageNullhttp://www.stevesouders.com/blog/2012/03/22/cache-them-if-you-can/
•55% of resources don’t specify a max-age value
•46% of the resources without any max-age remained unchanged over a 2 week period
![Page 74: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/74.jpg)
D‘OH!
![Page 75: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/75.jpg)
</outbreak>
![Page 76: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/76.jpg)
SPDY
•SPDY for SSL enabled by default
•SPDY = „HTTP Super Pipelining“
•We don‘t advertise SPDY for HTTP (its slower)
•Reduces TCP connections, roundtrips, slow starts
http://research.microsoft.com/pubs/170059/A%20comparison%20of%20SPDY%20and%20HTTP%20performance.pdf
![Page 77: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/77.jpg)
Even More?
•Fast clicks on touch devices
•Avoid 302 redirects
•document.write
![Page 78: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/78.jpg)
Results
http://www.flickr.com/photos/rosasay/4675053765
![Page 79: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/79.jpg)
RWD* without FEO
Document Complete: 11.838sBytes In: 1,634 KBRequests: 122Fully Loaded: 12.357sBytes In: 1,634 KBRequests: 126
*added to an existing desktop site
![Page 80: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/80.jpg)
Scaled Images & Filtered Content
Document Complete: 2.732sBytes In: 285 KBRequests: 51Fully Loaded: 4.193sBytes In: 288 KBRequests: 53
![Page 81: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/81.jpg)
Document Complete: 1.088sBytes In: 69 KBRequests: 7Fully Loaded: 3.552sBytes In: 269 KBRequests: 14
ADVERTISING:This is the standard result bySevenval FIT Version 12.0.2.
Scaled Images, Filtered Content & FEO
![Page 82: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/82.jpg)
Overview
Document Complete 11.838s 2.732s 1.088s
Bytes In 1,634KB 285KB 69KB
Requests 122 51 7
Fully Loaded 12.357s 4.193s 3.552s
Bytes In 1,634KB 288KB 269KB
Requests 126 53 14
loadEvent 11.806s 2.696s 0.862s
RWD RESS RESS + FEOpoor
![Page 83: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/83.jpg)
http://www.flickr.com/photos/insouciance/3061759623/
YES, THIS IS COOL!
![Page 84: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/84.jpg)
Performance Killer
•unscaled images
•large inline scripts/styles
•large CSS background images
•Session = Cache-control: private
•3rd Party JavaScript (twitter, fb, Ads, tracking, ...)
•SLOW SERVERS!
![Page 85: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/85.jpg)
Takeaways
http://www.flickr.com/photos/specialkrb/3375397148
![Page 86: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/86.jpg)
Mindset
•Performance is like diets:
•Avoid Yo-yo effects!
•Live performance every day!
•Performance is mindset – not a feature
•Consider performance from day 0
•Performance is hard to apply „at the end“
![Page 87: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/87.jpg)
Performance Triangle
Security
Performance
Eye-Candy
2012 Sevenval, Credits to @ffilex
![Page 88: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/88.jpg)
Performance Triangle
Security
Performance
Eye-Candy
2012 Sevenval, Credits to @ffilex
![Page 89: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/89.jpg)
Performance Triangle
Security
Performance
Eye-Candy
= $ = $$$2012 Sevenval, Credits to @ffilex
![Page 90: Mobile web performance dwx13](https://reader034.vdocument.in/reader034/viewer/2022052619/5555a653d8b42a8e1f8b5468/html5/thumbnails/90.jpg)
Thank You!
@rolandguelle