Website performance strategi

1,153 views

Published on

Novicell konference København december 2013

Hvad er et hurtigt website, og hvordan måler du det? Hvis dit website er langsomt, vil brugerne hurtigt finde hen til konkurrenten. I denne session vil Emil Rasmussen fra Novicell opstille et framework til, hvor du kan arbejde strategisk med dit websites hastighed. Du får at vide, hvad du skal måle, og hvordan du kommer i gang.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,153
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Først 3 ord om mig.Projektleder i dag. Nærmer mig 11 år i Novicell.Cand.mag. i Informationsvidenskab. Nørd. Web nørd, computer nørd og performance nørd. Og det har været så heldig at blive betalt for de sidste 12-13 år.Jeg skal også lige vide lidt om jer, inden jeg går videre?Hvor mange kende Site Speed rapporterne i Google Analytics? Og hvor mange har så kigget på dem inden for de sidste 2 uger?(Husk selv at tage hånden i vejret!)Er der nogen der bruger andre værktøjer til at overvåge performance på de websites de er ansvarlige for? Ok, så ved jeg lidt om, hvor I er henne af.http://www.yamama.ru/wallpapers/wallpapers/speed_hdtv_1080p-1920x1080.jpg
  • Dette er basalt den website performance strategi, som jeg arbejde med vores kunder om at implementere.Og dermed også sagt, at jeg ikke komme til at snakke om hvordan man teknisk kommer til at gøre sit site hurtigere. Eller hvordan man skal forholde sig, når man planlægger eller udvikler et site. Jeg holder mig til hvordan man kan måle, efter vil fokusere på hvordan komme i gang med et eksisterende site. Og gøre det systematisk.Sæt mål – motivation og et forslag til en målsætningMåling – hvad skal du måle og med hvilke værktøjerKommer jeg ikke så meget ind på, men jeg ved at der til Site Clinic sessionen herefter føglendeogså vil blive kigget på performance, og givet et par hint. Ellers er man selvfølgelig meget velkommen til at spørge mig bagefter.At blive ved – et par ideeer til at gøre performance til en del af hverdagenI spørger bare løs undervejs, men ellers bliver der nok også tid til at par spørgsmål efter jeg har været alle slides igennem.
  • Glade brugere!Menneskeligfåmån – korttidshukommelseogønsketom at væreikontrol.StressNeurosience – frustration levelsVi bliversommennekser mega stressedeaf at vente. Den menneskeligehjerneskalhelst have nogle inputs, ellerbliver vi nervøse.Why the stress? Basically, it’s because our short-term memory sucks. Usability guru Jakob Nielsen states that human responses to poor load times is, in a large part, due to our poor short-term memory. Information stored in our short-term memory decays quickly, which is why we don’t perform as well when we have to wait, even for just a few seconds. And after 10 seconds? You can pretty much forget about it. Literally.http://www.webperformancetoday.com/2012/03/21/neuroscience-page-speed-web-performance/Human limitations, especially in the areas of memory and attention (as further discussed in our seminar on The Human Mind and Usability). We simply don't perform as well if we have to wait and suffer the inevitable decay of information stored in short-term memory.Human aspirations. We like to feel in control of our destiny rather than subjugated to a computer's whims. Also, when companies make us wait instead of providing responsive service, they seem either arrogant or incompetent.”http://www.nngroup.com/articles/website-response-times/http://www.happywebbies.com/store/detail/jakob-nielsen/
  • Såer Google også glade. Google brugereinddirektehastighedpådit website, I deres ranking algoritme. Og glade brugereog en glad google bot erGoogle has been consistently clear that site speed is only one of 200+ ranking factors, and that more traditional factors such as content and relevance (and links) remain more important factors. are in the top 20%. Today that means faster than 1.5 second page load time, but tomorrow you might need to have faster than a one second load time. As Maile said, users react to any difference in speed in a subjective way. Chances are that this is all relative too. If the entire web speeds up by half a second, user perception of what is fast will also speed up.Does that mean that Google punishes all sites over that 20% line and rewards all sites below it? No, it doesn’t. If I were to take a moment and speculate on this, I could imagine something like:A small boost for sites in the top 20%No effect on sites between 20% and 60%A small negative penalty for sites between 60% and 80%A larger negative penalty for sites below 80%http://searchengineland.com/googles-push-to-speed-up-your-web-site-42177
  • Pengepåbundlinjen.1 sekundiforsinkelsekanreducereconversions med 7 %Page views med 11 %Customer satisfaction by 16 %http://blog-assets.newrelic.com/wp-content/uploads/New-Relic-Ecommerce-Infographic_FINAL.jpg
  • http://programming.oreilly.com/2009/07/velocity-making-your-site-fast.html
  • For every 1 second of improvement they experienced up to a 2% increase in conversionsFor every 100 ms of improvement, they grew incremental revenue by up to 1%http://www.webperformancetoday.com/2012/02/28/4-awesome-slides-showing-how-page-speed-correlates-to-business-metrics-at-walmart-com/
  • 400 mslyderjoikkeafmeget, og 0,6 % afdet bare ingenting. Men for Google erdetrigtig mange penge.Men hvad der er mere interresant, såglemmer vi ikke, at detvarlangtsomt. 4 ugeresenerevar der stadigfærrebesøgende.Speed as perceived by the end user is driven by multiple factors, including how fast results are returned and how long it takes a browser to display the content. Our experiments injected server-side delay to model one of these factors: extending the processing time before and during the time that the results are transmitted to the browser. In other words, we purposefully slowed the delivery of search results to our users to see how they might respond.All other things being equal, more usage, as measured by number of searches, reflects more satisfied users. Our experiments demonstrate that slowing down the search results page by 100 to 400 milliseconds has a measurable impact on the number of searches per user of -0.2% to -0.6% (averaged over four or six weeks depending on the experiment). That's 0.2% to 0.6% fewer searches for changes under half a second! Furthermore, users do fewer and fewer searches the longer they are exposed to the experiment. Users exposed to a 200 ms delay since the beginning of the experiment did 0.22% fewer searches during the first three weeks, but 0.36% fewer searches during the second three weeks. Similarly, users exposed to a 400 ms delay since the beginning of the experiment did 0.44% fewer searches during the first three weeks, but 0.76% fewer searches during the second three weeks. Even if the page returns to the faster state, users who saw the longer delay take time to return to their previous usage level. Users exposed to the 400 ms delay for six weeks did 0.21% fewer searches on average during the five week period after we stopped injecting the delay.http://googleresearch.blogspot.dk/2009/06/speed-matters.html
  • Nu har vi væretigennemhvorfor du skalmåle, hvad du skalmåle, oghvordan du skalmåle. Men detførstepunktistrategienvarjo at stillemål.Når nu du skalhjemogigang med din egne web performance strategi, såerdetførste, at findeudaf, hvadmålsætningenskalvære?Hvader en realistiskogambitøsmålsætning?
  • Dererogsåforskelpå et website med relativtstatiskindhold. F.eks. kan et nyhedsmedie cache meget mere end et e-handels sites.0.1 second is about the limit for having the user feel that the system is reacting instantaneously, meaning that no special feedback is necessary except to display the result.1.0 second is about the limit for the user's flow of thought to stay uninterrupted, even though the user will notice the delay. Normally, no special feedback is necessary during delays of more than 0.1 but less than 1.0 second, but the user does lose the feeling of operating directly on the data.10 seconds is about the limit for keeping the user's attention focused on the dialogue. For longer delays, users will want to perform other tasks while waiting for the computer to finish, so they should be given feedback indicating when the computer expects to be done. Feedback during the delay is especially important if the response time is likely to be highly variable, since users will then not know what to expect.http://www.nngroup.com/articles/response-times-3-important-limits/http://www.nngroup.com/articles/response-times-3-important-limits/
  • http://www.strangeloopnetworks.com/assets/images/infographic1.jpgAfter 3 seconds, 57 % of users say they will abondond a sitehttp://www.akamai.com/html/about/press/releases/2010/press_061410.htmlMen man kanjoaltid se påhvadandre de gør.
  • The average web page has grown 151% in just threeyearsIf your site loads in 5 seconds it is faster thanapproximately 25% of the webIf your site loads in 2.9 seconds it is faster thanapproximately 50% of the webIf your site loads in 1.7 seconds it is faster thanapproximately 75% of the webIf your site loads in 0.8 seconds it is faster thanapproximately 94% of the webhttp://moz.com/blog/site-speed-are-you-fast-does-it-matter
  • The average web page has grown 151% in just threeyearsIf your site loads in 5 seconds it is faster thanapproximately 25% of the webIf your site loads in 2.9 seconds it is faster thanapproximately 50% of the webIf your site loads in 1.7 seconds it is faster thanapproximately 75% of the webIf your site loads in 0.8 seconds it is faster thanapproximately 94% of the webhttp://moz.com/blog/site-speed-are-you-fast-does-it-matter
  • The average web page has grown 151% in just threeyearsIf your site loads in 5 seconds it is faster thanapproximately 25% of the webIf your site loads in 2.9 seconds it is faster thanapproximately 50% of the webIf your site loads in 1.7 seconds it is faster thanapproximately 75% of the webIf your site loads in 0.8 seconds it is faster thanapproximately 94% of the webhttp://moz.com/blog/site-speed-are-you-fast-does-it-matter
  • The average web page has grown 151% in just threeyearsIf your site loads in 5 seconds it is faster thanapproximately 25% of the webIf your site loads in 2.9 seconds it is faster thanapproximately 50% of the webIf your site loads in 1.7 seconds it is faster thanapproximately 75% of the webIf your site loads in 0.8 seconds it is faster thanapproximately 94% of the webhttp://moz.com/blog/site-speed-are-you-fast-does-it-matterEn anden undersøgelse af europæiske e-handels websites, fandt at top 400 retail websites: median load time for first-time visitorswas 7.04 seconds.
  • 85 % af mobile brugereforventer at websites ermindsteligesåhurtigepåmobilensompådesktoppenhttp://www.strangeloopnetworks.com/web-performance-infographics/
  • 85 % af mobile brugereforventer at websites ermindsteligesåhurtigepåmobilensompådesktoppenhttp://www.strangeloopnetworks.com/web-performance-infographics/
  • * Gennemsnitsindlæsningstidibrowseren * GennemsnitsserversvartidDen gennemsnitligeindlæsningstider den vigtigstemåling, da den dækkerhvorlangtid der gårfra en brugerklikkerpå et link, til at de oplever at sidenerklartil at kunnelæsesognavigeresvidere med.Den gennemsnitligeserversvartidenbeskriver den tid der gårfra, at brugerenklikkerpå et link, til at serverenhargenereretsidenogbegyndt at sende den tilklienten. Når vi skenlermellemdisse to tal, såskyldesdet, at der ermegetstorforskelpå de udviklingstiltag der skaltages for at optimereserversvartidenogindlæsningenstidenibrowseren.Hensigten med at måle, er at kunne vide, hvor man skal lave forbedringer.
  • Jeg vil dog lige indskyde et ekstra element, som man skal være opmærksom på - nemlig netværket. Og sætte det hele sammen til et budget - Betragt det hele som et budget.Netværket er en parameter, som jeg ikke har været inde omkring endnu. Det bliver nemlig meget hurtigt teknisk, da det der den parameter, som man har mindst kontrol over. Netværkets veje er uransaglige. Rejsen fra server til browser er påvirket af mange faktorer:De to vigtigske faktorer erGeografiBåndbreddeDet er klart at der er langt fra en servere i Danmark til en bruger I Australien.Ligesom der er stor forskel på at være på en 100 mb fiberforbindelse og så med en halvdårlig 3g forbindelse på vej over fyn I et IC3 tog.Bemærk at jeg her snakkeromgennemsnitstal.Ognår man harnørdetlidt med analytics ogandrestatistikværktøjer. Såved man…
  • at der findes, løgn, forbandetløgnogsåstatik. Såderforsupplereskal du ogsåmålepå:
  • http://www.fantom-xp.com/wallpapers/15/Turkey_Land_Turtle.jpghttp://www.gwblawfirm.com/myimages/trophy.jpgDe 10 langsomste siderDe 10 mestbesøgte siderEller hvad du nu kanindtificeresomvigtigefunktioner. Landing pages erf.eks. vigtige, således at brugerneafbryderoggårtilbagetilsøgeresultatsidenPå et e-handels site erdetf.eks. vigtigtbrugernefårumidelbar feedback, når de kommernogetikurven. Eller endnuvigtigere, at man hurtigtkanklikke sig igennemudvalget. Som de forsøgjegfortalteomtidligere, såkan man sige, at johurtigeredetgår, joflere sider serbrugerne.Apdex score
  • * Gennemsnitsindlæsningstidibrowseren * GennemsnitsserversvartidDen gennemsnitligeindlæsningstider den vigtigstemåling, da den dækkerhvorlangtid der gårfra en brugerklikkerpå et link, til at de oplever at sidenerklartil at kunnelæsesognavigeresvidere med.Den gennemsnitligeserversvartidenbeskriver den tid der gårfra, at brugerenklikkerpå et link, til at serverenhargenereretsidenogbegyndt at sende den tilklienten. Når vi skenlermellemdisse to tal, såskyldesdet, at der ermegetstorforskelpå de udviklingstiltag der skaltages for at optimereserversvartidenogindlæsningenstidenibrowseren.Hensigten med at måle, er at kunne vide, hvor man skal lave forbedringer.Bemærk at jeg her snakkeromgennemsnitstal.Ognår man harnørdetlidt med analytics ogandrestatistikværktøjer. Såved man…
  • https://docs.newrelic.com/docs/site/apdex-measuring-user-satisfactionhttp://www.virtualizationpractice.com/blog/wp-content/uploads/2009/10/Apdex.pngExample: During a 2 minute period a server handles 200 requests. Threshold T = 0.5 seconds (500ms). This value is arbitrary and is selected by the user.170 of the requests were handled within 500ms so they are classified as satisfied.20 of the requests were handled between 500ms and 2 seconds (2000 ms) so they are tolerating. The remaining 10 were not handled properly or took longer than 2 seconds so they are classified as frustrated.(170 + (20/2))/200 = 0.9. Apdex = 0.9http://www.bigskyepettreats.com/product_images/attribute_rule_images/992_zoom.jpghttp://www.bigskyepettreats.com/product_images/attribute_rule_images/990_zoom.jpghttp://www.bigskyepettreats.com/product_images/attribute_rule_images/989_zoom.jpg
  • Beggeværktøjerer Real User Monitoring.http://www.clivefearon.com/wp-content/uploads/2013/08/a_hand_with_stop_watch__219667.jp
  • http://www.astekblog.com/wp-content/uploads/2013/08/Google-Analytics.pngSuper simpelt at gåtil. Chancen for at du hardetalleredeerganskestor. Detkommerindbyggeti Google Analytics. Deter et rigtigfintværktøj. Deter let at alle de talsomjeg, harpræsenteretsomdem der skalmålespå.Gennemsnitligindlæsningstid.Gennemsnitlig server svartid.10 langsomste sider10 mestbesøgte siderOgdeter let at sætteautomatiskeemailrapporter op, så man heletidenfårtallenedirekte I sin inbox. Sådetskal I bare gåhjemogbruge.Men nårdetsåersagt, såerdetrækkebegræsningersom man skalværeopmærksompå.Default sample rate er 1 % (https://support.google.com/analytics/answer/1205784?hl=en) – dettekan dog let ændres, men en enkeltændringtil Google Analytics koden. Dog kan man ramme en grænsepå.Max antal samples er 10.000 per dagiOSbliverikkemålt – gøripraksis GA Site Speed ikkerapportereomflertalletaf dine mobilbrugershastighedNogenforsinkelse (måskeopdateretsåoftesom 30 minutter, men helt op til 24 timer for valide) – kanikkeopdagehastighedsproblemer her og nu (http://stackoverflow.com/questions/5243305/how-often-does-google-analytics-update-the-traffic-data)
  • Men har I mindre end 10.000 page views per dag, såskru blot godt op for site speed sample rate, ogsåbrug Google Analytics. Men drag ikkenogleforhastedekonklusioner – detmaler med den bredepensel.Når man brugertal for Google Analytics, såtjekaltidhvorstor en page view sample, som den konkretemålingbasere sig på.
  • Ogdetteledermigvideretil New Relic, somerdetandetværktøjjegvilintrodukserejertili dag. Deter et såkaldt Application Performance Management værktøj, sombl.a. imødekommer de ulempersomjegjegnetopbeskreviomkring Google Analytics. Men også en del mere for sådannogle performance nørder for mig.New Relic er et fantastiskprodukt, ogjegkunnesagtens have brugthelesessionenpå at gennemgå features i New Relic.Basalt kan New Relic detsammesom Google Analytics Site Speed, men detadskiller sig på to punkter:100 % sample rateReal time.
  • Percentiles: Comparing ranked dataIn New Relic, percentile line graphs allow you to compare and analyze response time data for your app servers and browsers as percentage rankings, including:99% (useful to help find outliers)95% (useful to set a standard)Median (where half of the transactions' times are higher than this value, and half are lower)Average (for all transactions in the selected time period)https://docs.newrelic.com/docs/applications-dashboards/percentiles-comparing-ranked-data
  • bbb
  • 1) Sæt et mål for den gennemsnitlige side indlæsningstid. For gns. serversvartid. Supplere evt. med 95 % procentilen.Gør det på tværs af dit website - men udvælg nogle fokusområder. F.eks. vigtige/meget besøgte sider/funktioner.2) Opsæt målinger – tjek din Google Analytics opsætning eller brug et trejdeparts RUM værktøj: New Relic, Pingdom eller AppDynamics.
  • HeltTal skal betyde nogetServiceLevelAgreementhttp://www.diegocaprioli.com/wp-content/uploads/2013/02/super_hero.jpghttp://4.bp.blogspot.com/-NEUSHMrxcrE/UeuhduqjEZI/AAAAAAAABkY/wHt0TKT6KCY/s1600/Success_kid-other.jpg
  • http://www.geckoboard.com/wp-content/themes/geckoboard/images/image10.jpg
  • 1) Sæt et mål for den gennemsnitlige side indlæsningstid. For gns. serversvartid. Supplere evt. med 95 % procentilen.Gør det på tværs af dit website - men udvælg nogle fokusområder. F.eks. vigtige/meget besøgte sider/funktioner.2) Opsæt målinger – tjek din Google Analytics opsætning eller brug et trejdeparts RUM værktøj: New Relic, Pingdom eller AppDynamics.3) Aftal med dit udviklingsteam hvilke tiltag der skal laves – skal server-koden optimeres, så siderne bliver spyttet hurtigere ud. Skal der downloades færre billeder, eller skal javascript-koden optimires/omstruktureres? Skal der caches bedre? Budget.4) Blev ved med at måle. Snak om det hele tiden. Tag det måske med på jeres gecko-board?
  • Website performance strategi

    1. 1. Konference København december 2013 Website Performance Strategi med Emil Rasmussen 1
    2. 2. ① Sæt mål ② Mål ③ Optimér ④ Og bliv ved… 2
    3. 3. 3
    4. 4. 4
    5. 5. Show me the Money 5
    6. 6. 6
    7. 7. 5 sek. forbedring (~7 til ~2 sek.) 25 % flere sidevisninger 7-12 % omsætningsstigning http://programming.oreilly.com/2009/07/velocity-making-your-site-fast.html 7
    8. 8. 8
    9. 9. 1 sek. forbedring, 2 % stigning i konverteringsrate 100 ms forbedring, 1 % omsætningsstigning http://www.webperformancetoday.com/2012/02/28/4-awesome-slides-showing-how-page-speed-correlates-to-business-metrics-at-walmart-com/ 9
    10. 10. “ Our own years of testing have conclusively shown that when speed of a feature or product improves, usage, quite simply, goes up. ” http://googleblog.blogspot.dk/2009/12/this-week-in-search-121809.html 10
    11. 11. Hvad er hurtigt så? 11
    12. 12. 12
    13. 13. 57% af brugerne siger, at de forlader et website efter 3 sekunders ventetid http://www.akamai.com/html/about/press/releases/2010/press_061410.html 13
    14. 14. 5 sekunder 14
    15. 15. 2,9 sekunder 15
    16. 16. 1,7 sekunder 16
    17. 17. 0,8 sekunder http://moz.com/blog/site-speed-are-you-fast-does-it-matter 17
    18. 18. 18
    19. 19. 19
    20. 20.  Sæt mål ② Mål ③ Optimér ④ Og bliv ved… 20
    21. 21. Browseren Serveren 21
    22. 22. ~1800 Browseren ms ~100 Netværket ~100 Serveren ms ms 22
    23. 23. Løgn Forbandet løgn Statistik 23
    24. 24. 24
    25. 25. Apdex 0.00-1.00 25
    26. 26. 0-1 sek. 1-4 sek. Tilfredsstillende Acceptable 4+ sek. Frustrerende 26
    27. 27. 27
    28. 28. 28
    29. 29. var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-1234567-8']); _gaq.push(['_setSiteSpeedSampleRate', 100]); _gaq.push(['_trackPageview']); 29
    30. 30. 30
    31. 31. 31
    32. 32. 32
    33. 33. 33
    34. 34.  Sæt mål  Mål ③ Optimér ④ Og bliv ved… 34
    35. 35. 35
    36. 36. 36
    37. 37.  Sæt mål  Mål  Optimér  Og bliv ved… 37
    38. 38. Mange tak for opmærksomheden Spørgsmål og kommentarer er meget velkomne Emil Rasmussen novicell.dk/era era@novicell.dk @emilr 38
    39. 39. Billedreferencer  Slide 3: http://www.happywebbies.com/store/detail/jakob-nielsen/  Slide 4: http://www.claybavor.com/?p=62  Slide 13: http://www.strangeloopnetworks.com/assets/images/infographic1.jpg  Slide 18-19: http://www.docstoc.com/docs/72523352/App-Idea-Sheet---iPhone--Vertical---1x1  Slide 24: http://www.fantom-xp.com/wallpapers/15/Turkey_Land_Turtle.jpg & http://www.gwblawfirm.com/myimages/trophy.jpg  Slide 26: http://www.bigskyepettreats.com/products/K.-Gear.-Horse-Buckets.html  Slide 27: http://www.clivefearon.com/wpcontent/uploads/2013/08/a_hand_with_stop_watch__219667.jp  Side 28: http://www.astekblog.com/wp-content/uploads/2013/08/GoogleAnalytics.png  Slide 35:http://www.diegocaprioli.com/wpcontent/uploads/2013/02/super_hero.jpg  Slide 36: http://www.geckoboard.com/wpcontent/themes/geckoboard/images/image10.jpg 39

    ×