SlideShare une entreprise Scribd logo
1  sur  43
Télécharger pour lire hors ligne
High Performance HTML5,[object Object],stevesouders.com/docs/html5-user-group-20110728.pptx,[object Object],Disclaimer: This content does not necessarily reflect the opinions of my employer.,[object Object],flickr.com/photos/djbiesack/85833076/,[object Object]
Cuzillion,[object Object],SpriteMe,[object Object],YSlow,[object Object],Hammerhead,[object Object],flickr.com/photos/bekahstargazing/318930460/,[object Object]
2004,[object Object]
 carsonified.com/blog/business/fred-wilsons-10-golden-principles-of-successful-web-apps/,[object Object],#1. Speed:        “First and foremost, we believe that speed is more than a feature. Speed is the most important feature.”,[object Object]
en.oreilly.com/velocity2009/public/schedule/detail/8523,[object Object]
en.oreilly.com/velocity2009/public/schedule/detail/8523,[object Object]
Yahoo!,[object Object],	0.4 sec slower,[object Object],	traffic  5-9%,[object Object],slideshare.net/stoyan/dont-make-me-wait-or-building-highperformance-web-applications,[object Object],slideshare.net/stoyan/yslow-20-presentation,[object Object]
blog.mozilla.com/metrics/category/website-optimization/,[object Object],…shaved 2.2 seconds off the average page load time and increased download conversions by 15.4%!,[object Object]
en.oreilly.com/velocity2009/public/schedule/detail/7709,[object Object],blog.mozilla.com/metrics/category/website-optimization/,[object Object],…shaved 2.2 seconds off the average page load time and increased download conversions by 15.4%!,[object Object]
en.oreilly.com/velocity2008/public/schedule/detail/3632,[object Object]
slideshare.net/EdmundsLabs/how-edmunds-got-in-the-fast-lane-80-reduction-in-page-load-time-in-3-simple-steps-6593377,[object Object]
Site speed in search rank,[object Object],Screen shot of blog post,[object Object],…we've decided to take site speed into account in our search rankings.,[object Object],googlewebmastercentral.blogspot.com/2010/04/using-site-speed-in-web-search-ranking.html,[object Object]
Web,[object Object],Performance,[object Object],Optimization,[object Object],WPO,[object Object],drives traffic,[object Object],improves UX,[object Object],increases revenue,[object Object],reduces costs,[object Object],flickr.com/photos/pedromourapinheiro/3123885534/,[object Object]
High Performance HTML5,[object Object],http://www.w3.org/TR/html5/,[object Object],flickr.com/photos/djbiesack/85833076/,[object Object]
Web Performance Working Group,[object Object],chartered June 2010,[object Object],Web Timing,[object Object],[object Object]
User Timing
Resource TimingPage Visibility,[object Object],Script-based animations,[object Object],Efficient script yielding,[object Object],http://www.w3.org/2010/webperf/,[object Object]
Navigation Timing,[object Object],var timing = performance.timing;,[object Object],varloadtime = ,[object Object],timing.loadEventEnd –,[object Object],timing.navigationStart;,[object Object],Chrome, IE9+,[object Object],http://blog.chromium.org/2010/07/do-you-know-how-slow-your-web-page-is.html,[object Object],flickr.com/photos/wwarby/3296379139/,[object Object]
Resource Timing,[object Object],[object Object]
security issuesUser Timing,[object Object],[object Object]
mark, measureflickr.com/photos/juditk/5024772809/,[object Object]
flickr.com/photos/96221617@N00/51603550/,[object Object],Page Visibility,[object Object],detect when page is visible,[object Object],[object Object]
video & audio
polling, DHTML
performance: prefetching, prerenderingChrome 13: ,[object Object],[object Object]
webkitvisibilitychangecode.google.com/chrome/whitepapers/pagevisibility.html,[object Object]
script async & defer,[object Object],parsing doesn’t wait for script:,[object Object],[object Object]
defer – executed when parsing finishedwhen is it downloaded?,[object Object],missing:,[object Object],[object Object]
defer download AND executionChrome, Firefox, Safari 5.1, IE10,[object Object],flickr.com/photos/gevertulley/4771808965/,[object Object]
app cache,[object Object],flickr.com/photos/india-nepal-iran/203982474/,[object Object]
yuiblog.com/blog/2007/01/04/performance-research-part-2/,[object Object]
blaze.io/mobile/understanding-mobile-cache-sizes/,[object Object]
app cache,[object Object],offline apps, longer cache,[object Object],<!doctype html>,[object Object],<html manifest=“myapp.appcache”>,[object Object],myapp.appcache:,[object Object],CACHE MANIFEST,[object Object],# Revision: 1.28,[object Object],CACHE:,[object Object],/images/logo.gif,[object Object],NETWORK:,[object Object],/login.html,[object Object],FALLBACK:,[object Object],/index.html /offline.html,[object Object],Content-Type: text/cache-manifest,[object Object],flickr.com/photos/india-nepal-iran/203982474/,[object Object]
app cache gotchas,[object Object],html docs w/ manifest are cached,[object Object],404 => nothing is cached,[object Object],size: 5MB+,[object Object],must rev manifest to update resources,[object Object],update is served on 2nd reload (?!?!),[object Object],flickr.com/photos/97657657@N00/1918688483/,[object Object]
app cache,[object Object],reload,[object Object],1,[object Object],2,[object Object],push app ,[object Object],logo.gif = ,[object Object],user loads app,[object Object],app cache is empty ,[object Object],fetch manifest,[object Object],fetch logo.gif,[object Object],app cache =,[object Object],user sees,[object Object],3,[object Object],4,[object Object],5,[object Object],push app ,[object Object],logo.gif =,[object Object],rev manifest ,[object Object],user loads app,[object Object],app cache = ,[object Object],user sees,[object Object],fetch manifest,[object Object],fetch logo.gif,[object Object],app cache =,[object Object],user loads app again,[object Object],app cache = ,[object Object],user sees,[object Object],fetch manifest (304),[object Object]
load twice workaround,[object Object],window.applicationCache.addEventListener('updateready', ,[object Object],function(e) {   if ( window.applicationCache.status== ,[object Object],window.applicationCache.UPDATEREADY) {,[object Object],    if ( confirm(“Load new content?”) ) {,[object Object],      ...,[object Object],http://www.webdirections.org/blog/get-offline/,[object Object],http://www.html5rocks.com/en/tutorials/appcache/beginner/,[object Object],flickr.com/photos/presley_m/5152304885/,[object Object]
localStorage,[object Object],window.localStorage: ,[object Object],setItem(),[object Object],getItem(),[object Object],removeItem(),[object Object],clear(),[object Object],also sessionStorage,[object Object],all popular browsers, 5MB max,[object Object],http://dev.w3.org/html5/webstorage/,[object Object],http://diveintohtml5.org/storage.html,[object Object],flickr.com/photos/bryanpearson/564703455/,[object Object]
localStorage as cache,[object Object],1st doc: write JS & CSS blocks to localStorage,[object Object],JUX.UXBaseControls.252CB7BF: (function(){...,[object Object],JUX.FrameworkCore.A39F6425: (function(){...,[object Object],set cookie with entries & version,[object Object],RMSM=JUX.UXBaseControls.252CB7BF~ JUX.FrameworkCore.A39F6425~,[object Object],later docs: read JS & CSS from localStorage,[object Object],script.text = localStorage.getItem(JUX.UXBaseControls.252CB7BF),[object Object],http://stevesouders.com/blog/2011/03/28/storager-case-study-bing-google/,[object Object],flickr.com/photos/nelsoncruz/431244400/,[object Object]
flickr.com/photos/typoatelier/4261455105/,[object Object],@font-face,[object Object],* IE9 does not display a blank page, but does “flash” the element.,[object Object],stevesouders.com/blog/2010/06/01/frontend-spof/,[object Object],Worth delaying most important design elements? Or entire page?,[object Object]
there’s more,[object Object],CSS instead of images: border radius, linear & radial gradients, drop shadow,[object Object],SVG, inline SVG, and canvas,[object Object],video tag,[object Object],WebSockets,[object Object],web workers,[object Object],builtin controls: progress, datetime,[object Object],flickr.com/photos/dualphoto/2609096047/,[object Object]
and more,[object Object],history –http://www.kylescholz.com/blog/2010/04/html5_history_is_the_future.html,[object Object],<a ping,[object Object],requestAnimationFrame – not timers,[object Object],native JSON parse/stringify,[object Object],http://bit.ly/browserscope-modernizr,[object Object],http://www.html5rocks.com/,[object Object],flickr.com/photos/kaptainkobold/5741327207/,[object Object]
Thanks to…,[object Object],Max Firtman,[object Object],Tony Gentilcore,[object Object],Paul Irish,[object Object],Brad Neuberg,[object Object],Kyle Scholz,[object Object],Lindsey Simon,[object Object],Annie Sullivan,[object Object],flickr.com/photos/robertvega/3944132320/,[object Object]
flickr.com/photos/pistocasero/5199312952/,[object Object]

Contenu connexe

Tendances

How fast are we going now?
How fast are we going now?How fast are we going now?
How fast are we going now?Steve Souders
 
Web Directions South - Even Faster Web Sites
Web Directions South - Even Faster Web SitesWeb Directions South - Even Faster Web Sites
Web Directions South - Even Faster Web SitesSteve Souders
 
JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)Steve Souders
 
Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...MilanAryal
 
State of the resource timing api
State of the resource timing apiState of the resource timing api
State of the resource timing apiAaron Peters
 
Web Performance Optimierung - DWX13
Web Performance Optimierung - DWX13Web Performance Optimierung - DWX13
Web Performance Optimierung - DWX13Walter Ebert
 
Website performance optimisation
Website performance optimisationWebsite performance optimisation
Website performance optimisationWebstock
 
[jqconatx] Adaptive Images for Responsive Web Design
[jqconatx] Adaptive Images for Responsive Web Design[jqconatx] Adaptive Images for Responsive Web Design
[jqconatx] Adaptive Images for Responsive Web DesignChristopher Schmitt
 
Mobile Web Speed Bumps
Mobile Web Speed BumpsMobile Web Speed Bumps
Mobile Web Speed BumpsNicholas Zakas
 
Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)Nicholas Zakas
 
High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)Nicholas Zakas
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Fwdays
 
[wvbcn] Adaptive Images in Responsive Web Design
[wvbcn] Adaptive Images in Responsive Web Design[wvbcn] Adaptive Images in Responsive Web Design
[wvbcn] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
Web20expo 20080425
Web20expo 20080425Web20expo 20080425
Web20expo 20080425Media Gorod
 
HTML5: Markup Evolved
HTML5: Markup EvolvedHTML5: Markup Evolved
HTML5: Markup EvolvedBilly Hylton
 
Real World Web Standards
Real World Web StandardsReal World Web Standards
Real World Web Standardsgleddy
 
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
The Case for HTTP/2  - Internetdagarna 2015 - StockholmThe Case for HTTP/2  - Internetdagarna 2015 - Stockholm
The Case for HTTP/2 - Internetdagarna 2015 - StockholmAndy Davies
 

Tendances (20)

How fast are we going now?
How fast are we going now?How fast are we going now?
How fast are we going now?
 
do u webview?
do u webview?do u webview?
do u webview?
 
Web Directions South - Even Faster Web Sites
Web Directions South - Even Faster Web SitesWeb Directions South - Even Faster Web Sites
Web Directions South - Even Faster Web Sites
 
JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)
 
Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...
 
State of the resource timing api
State of the resource timing apiState of the resource timing api
State of the resource timing api
 
Web Performance Optimierung - DWX13
Web Performance Optimierung - DWX13Web Performance Optimierung - DWX13
Web Performance Optimierung - DWX13
 
Website performance optimisation
Website performance optimisationWebsite performance optimisation
Website performance optimisation
 
[jqconatx] Adaptive Images for Responsive Web Design
[jqconatx] Adaptive Images for Responsive Web Design[jqconatx] Adaptive Images for Responsive Web Design
[jqconatx] Adaptive Images for Responsive Web Design
 
Mobile Web Speed Bumps
Mobile Web Speed BumpsMobile Web Speed Bumps
Mobile Web Speed Bumps
 
Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)
 
High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)
 
Frontend SPOF
Frontend SPOFFrontend SPOF
Frontend SPOF
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
 
Taking your Web App for a walk
Taking your Web App for a walkTaking your Web App for a walk
Taking your Web App for a walk
 
[wvbcn] Adaptive Images in Responsive Web Design
[wvbcn] Adaptive Images in Responsive Web Design[wvbcn] Adaptive Images in Responsive Web Design
[wvbcn] Adaptive Images in Responsive Web Design
 
Web20expo 20080425
Web20expo 20080425Web20expo 20080425
Web20expo 20080425
 
HTML5: Markup Evolved
HTML5: Markup EvolvedHTML5: Markup Evolved
HTML5: Markup Evolved
 
Real World Web Standards
Real World Web StandardsReal World Web Standards
Real World Web Standards
 
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
The Case for HTTP/2  - Internetdagarna 2015 - StockholmThe Case for HTTP/2  - Internetdagarna 2015 - Stockholm
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
 

En vedette

Agile performance engineering with cloud 2016
Agile performance engineering with cloud   2016Agile performance engineering with cloud   2016
Agile performance engineering with cloud 2016Ken Chan
 
A Short History of Performance Engineering
A Short History of Performance EngineeringA Short History of Performance Engineering
A Short History of Performance EngineeringAlexander Podelko
 
Business Aspects of High Performance Websites
Business Aspects of High Performance WebsitesBusiness Aspects of High Performance Websites
Business Aspects of High Performance Websitesmalteubl
 
Top 8 Trends in Performance Engineering
Top 8 Trends in Performance EngineeringTop 8 Trends in Performance Engineering
Top 8 Trends in Performance EngineeringConvetit
 
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)Tammy Everts
 
How to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your NicheHow to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your NicheLeslie Samuel
 

En vedette (6)

Agile performance engineering with cloud 2016
Agile performance engineering with cloud   2016Agile performance engineering with cloud   2016
Agile performance engineering with cloud 2016
 
A Short History of Performance Engineering
A Short History of Performance EngineeringA Short History of Performance Engineering
A Short History of Performance Engineering
 
Business Aspects of High Performance Websites
Business Aspects of High Performance WebsitesBusiness Aspects of High Performance Websites
Business Aspects of High Performance Websites
 
Top 8 Trends in Performance Engineering
Top 8 Trends in Performance EngineeringTop 8 Trends in Performance Engineering
Top 8 Trends in Performance Engineering
 
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
 
How to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your NicheHow to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your Niche
 

Similaire à High Performance HTML5 (SF HTML5 UG)

Mehr Performance für WordPress - WPFra
Mehr Performance für WordPress - WPFraMehr Performance für WordPress - WPFra
Mehr Performance für WordPress - WPFraWalter Ebert
 
Souders WPO Web 2.0 Expo
Souders WPO Web 2.0 ExpoSouders WPO Web 2.0 Expo
Souders WPO Web 2.0 ExpoSteve Souders
 
Csdn Drdobbs Tenni Theurer Yahoo
Csdn Drdobbs Tenni Theurer YahooCsdn Drdobbs Tenni Theurer Yahoo
Csdn Drdobbs Tenni Theurer Yahooguestb1b95b
 
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersSearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersDistilled
 
Testing Like a Pro - Chef Infrastructure Testing
Testing Like a Pro - Chef Infrastructure TestingTesting Like a Pro - Chef Infrastructure Testing
Testing Like a Pro - Chef Infrastructure TestingTim Smith
 
Devfest Siberia Fast and Beautiful Images and Video
Devfest Siberia Fast and Beautiful Images and VideoDevfest Siberia Fast and Beautiful Images and Video
Devfest Siberia Fast and Beautiful Images and VideoDoug Sillars
 
High Performance Snippets
High Performance SnippetsHigh Performance Snippets
High Performance SnippetsSteve Souders
 
Fast and Beautiful Images and Video
Fast and Beautiful Images and VideoFast and Beautiful Images and Video
Fast and Beautiful Images and VideoDoug Sillars
 
Devoxx be fast and beautiful images
Devoxx be fast and beautiful imagesDevoxx be fast and beautiful images
Devoxx be fast and beautiful imagesDoug Sillars
 
Now you see me... Adaptive Web Design and Development
Now you see me... Adaptive Web Design and DevelopmentNow you see me... Adaptive Web Design and Development
Now you see me... Adaptive Web Design and DevelopmentJonas Päckos
 
JavaScript Perfomance
JavaScript PerfomanceJavaScript Perfomance
JavaScript PerfomanceAnatol Alizar
 
Tactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOpsTactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOpsJeff Gallimore
 
Tactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOpsTactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOpsExcella
 
Mobile era fastandbeautiful
Mobile era fastandbeautifulMobile era fastandbeautiful
Mobile era fastandbeautifulDoug Sillars
 
Back to the [Completable] Future
Back to the [Completable] FutureBack to the [Completable] Future
Back to the [Completable] FutureSofiia Khomyn
 
Imagesandvideo voxxeddays
Imagesandvideo voxxeddaysImagesandvideo voxxeddays
Imagesandvideo voxxeddaysDoug Sillars
 
Perf ug fastandbeautiful
Perf ug fastandbeautifulPerf ug fastandbeautiful
Perf ug fastandbeautifulDoug Sillars
 
Hamburg web perf meetup
Hamburg web perf meetupHamburg web perf meetup
Hamburg web perf meetupDoug Sillars
 

Similaire à High Performance HTML5 (SF HTML5 UG) (20)

Mehr Performance für WordPress - WPFra
Mehr Performance für WordPress - WPFraMehr Performance für WordPress - WPFra
Mehr Performance für WordPress - WPFra
 
Souders WPO Web 2.0 Expo
Souders WPO Web 2.0 ExpoSouders WPO Web 2.0 Expo
Souders WPO Web 2.0 Expo
 
Csdn Drdobbs Tenni Theurer Yahoo
Csdn Drdobbs Tenni Theurer YahooCsdn Drdobbs Tenni Theurer Yahoo
Csdn Drdobbs Tenni Theurer Yahoo
 
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersSearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
 
Testing Like a Pro - Chef Infrastructure Testing
Testing Like a Pro - Chef Infrastructure TestingTesting Like a Pro - Chef Infrastructure Testing
Testing Like a Pro - Chef Infrastructure Testing
 
Devfest Siberia Fast and Beautiful Images and Video
Devfest Siberia Fast and Beautiful Images and VideoDevfest Siberia Fast and Beautiful Images and Video
Devfest Siberia Fast and Beautiful Images and Video
 
High Performance Snippets
High Performance SnippetsHigh Performance Snippets
High Performance Snippets
 
Fast and Beautiful Images and Video
Fast and Beautiful Images and VideoFast and Beautiful Images and Video
Fast and Beautiful Images and Video
 
Devoxx be fast and beautiful images
Devoxx be fast and beautiful imagesDevoxx be fast and beautiful images
Devoxx be fast and beautiful images
 
Now you see me... Adaptive Web Design and Development
Now you see me... Adaptive Web Design and DevelopmentNow you see me... Adaptive Web Design and Development
Now you see me... Adaptive Web Design and Development
 
JavaScript Perfomance
JavaScript PerfomanceJavaScript Perfomance
JavaScript Perfomance
 
Tactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOpsTactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOps
 
Tactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOpsTactics to Kickstart Your Journey Toward DevOps
Tactics to Kickstart Your Journey Toward DevOps
 
4-identifying-problems.pdf
4-identifying-problems.pdf4-identifying-problems.pdf
4-identifying-problems.pdf
 
Velocity Report 2009
Velocity Report 2009Velocity Report 2009
Velocity Report 2009
 
Mobile era fastandbeautiful
Mobile era fastandbeautifulMobile era fastandbeautiful
Mobile era fastandbeautiful
 
Back to the [Completable] Future
Back to the [Completable] FutureBack to the [Completable] Future
Back to the [Completable] Future
 
Imagesandvideo voxxeddays
Imagesandvideo voxxeddaysImagesandvideo voxxeddays
Imagesandvideo voxxeddays
 
Perf ug fastandbeautiful
Perf ug fastandbeautifulPerf ug fastandbeautiful
Perf ug fastandbeautiful
 
Hamburg web perf meetup
Hamburg web perf meetupHamburg web perf meetup
Hamburg web perf meetup
 

Plus de Steve Souders

Make JavaScript Faster
Make JavaScript FasterMake JavaScript Faster
Make JavaScript FasterSteve Souders
 
The Perception of Speed
The Perception of SpeedThe Perception of Speed
The Perception of SpeedSteve Souders
 
High Performance Web Components
High Performance Web ComponentsHigh Performance Web Components
High Performance Web ComponentsSteve Souders
 
Your Script Just Killed My Site
Your Script Just Killed My SiteYour Script Just Killed My Site
Your Script Just Killed My SiteSteve Souders
 
Even Faster Web Sites at jQuery Conference '09
Even Faster Web Sites at jQuery Conference '09Even Faster Web Sites at jQuery Conference '09
Even Faster Web Sites at jQuery Conference '09Steve Souders
 
Browserscope Launch at TAE
Browserscope Launch at TAEBrowserscope Launch at TAE
Browserscope Launch at TAESteve Souders
 
Even Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax ExperienceEven Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax ExperienceSteve Souders
 
SXSW: Even Faster Web Sites
SXSW: Even Faster Web SitesSXSW: Even Faster Web Sites
SXSW: Even Faster Web SitesSteve Souders
 

Plus de Steve Souders (12)

Make JavaScript Faster
Make JavaScript FasterMake JavaScript Faster
Make JavaScript Faster
 
Metrics of Joy
Metrics of JoyMetrics of Joy
Metrics of Joy
 
The Perception of Speed
The Perception of SpeedThe Perception of Speed
The Perception of Speed
 
High Performance Web Components
High Performance Web ComponentsHigh Performance Web Components
High Performance Web Components
 
Cache is King
Cache is KingCache is King
Cache is King
 
Your Script Just Killed My Site
Your Script Just Killed My SiteYour Script Just Killed My Site
Your Script Just Killed My Site
 
JSConf US 2010
JSConf US 2010JSConf US 2010
JSConf US 2010
 
CouchDB Google
CouchDB GoogleCouchDB Google
CouchDB Google
 
Even Faster Web Sites at jQuery Conference '09
Even Faster Web Sites at jQuery Conference '09Even Faster Web Sites at jQuery Conference '09
Even Faster Web Sites at jQuery Conference '09
 
Browserscope Launch at TAE
Browserscope Launch at TAEBrowserscope Launch at TAE
Browserscope Launch at TAE
 
Even Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax ExperienceEven Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax Experience
 
SXSW: Even Faster Web Sites
SXSW: Even Faster Web SitesSXSW: Even Faster Web Sites
SXSW: Even Faster Web Sites
 

Dernier

activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfJamie (Taka) Wang
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7DianaGray10
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureEric D. Schabell
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Commit University
 
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDELiveplex
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Adtran
 
Bird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemBird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemAsko Soukka
 
Linked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond OntologiesLinked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond OntologiesDavid Newbury
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsIgniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsSafe Software
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPathCommunity
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Websitedgelyza
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXTarek Kalaji
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfDaniel Santiago Silva Capera
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IES VE
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintMahmoud Rabie
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxMatsuo Lab
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?IES VE
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.YounusS2
 

Dernier (20)

activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability Adventure
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
 
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
 
Bird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemBird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystem
 
Linked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond OntologiesLinked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond Ontologies
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsIgniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
 
20150722 - AGV
20150722 - AGV20150722 - AGV
20150722 - AGV
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBX
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
 

High Performance HTML5 (SF HTML5 UG)

  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 49.
  • 53.
  • 55.
  • 56.

Notes de l'éditeur

  1. Fred Wilson is Managing Partner of two venture capital firms, Flatiron Partners (Yoyodyne, Geocities) and Union Square Ventures (Twitter, delicious,Etsy, Feedburner).SpeedInstant utilitySoftware is mediaLess is moreMake it programmableMake it personalRESTfulDiscoverabilityCleanPlayful
  2. “if we’re able to achieve a similar performance boost across ourothertoplanding pages, we’ll drive in excess of 60 million yearly Firefox downloads.”
  3. This was a ~5 second speed up.
  4. Time measurements from real users.