O slideshow foi denunciado.
Seu SlideShare está sendo baixado. ×

Digicure seminar i Jylland | Session 1, web performance monitorering

Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Carregando em…3
×

Confira estes a seguir

1 de 157 Anúncio

Mais Conteúdo rRelacionado

Semelhante a Digicure seminar i Jylland | Session 1, web performance monitorering (20)

Mais recentes (17)

Anúncio

Digicure seminar i Jylland | Session 1, web performance monitorering

  1. 1. God performance er god kundeservice 7. maj 2014 Session 1 – ”Kom godt fra start” Tobias Borg Petersen, Performancekonsulent fra Digicure A/S www.digicure.dk
  2. 2. Hvem er jeg Tobias Borg Petersen 2 @_tobibp tbp@digicure.dk Webperformance.nu/blog Performancekonsulent i Digicure Front End udvikler (.NET) dk.linkedin.com/in/tobiasbp
  3. 3. www.digicure.dk 3 • Stiftet i 2003 • Kontor i Lyngby • 22 medarbejdere • Beskæftiger os med analyse og rådgivning • It-sikkerhed • Web performance • It-sikkerhedsuddannelser • CISSP • CEH – Ethical hacker • CVSE – Vmware Hacking / Advanced Security
  4. 4. Agenda Tobias Borg Petersen 4 • Morgenmad √ • Velkomst v/ Jesper Helbrandt, direktør Digicure A/S √ • Introduktion til hvorfor web performance er vigtigt • Opsætning af KPI’er og SLA’er inden for web performance • Hvor skal man fokusere sine optimeringer? Hvor er effekten størst? • Hvilke typer af værktøjer har man behov for? • God web performance på de mobile enheder. Hvordan?
  5. 5. 5 Fokus på web performance
  6. 6. 6 Hvorfor er performance vigtigt?
  7. 7. 7 Hvorfor er performance vigtigt? • Hurtigere, hurtigere og hurtigere • Internet forbindelser bliver hurtigere • Computere bliver hurtigere • Telefonerne bliver hurtigere • Browserne bliver hurtigere • Styresystemer bliver hurtigere • Næsten alt bliver hurtigere • Og brugerne bliver mere og mere utålmodige
  8. 8. 8 Websites bliver langsommere og langsommere…
  9. 9. 9 Danske webshops Danske kommuner Web performance Hvordan står det til i dag? Kilde: http://www.digicure.dk/performance.html
  10. 10. 10 Flash 1% CSS 5% HTML 3% JavaScript 20% Andet 4%Billeder 67% Flash 2% CSS 4% HTML 5% JavaScript 22% Andet 3% Billeder 64% Web performance Hvordan står det til i dag? Danske webshops Danske kommuner Kilde: http://www.digicure.dk/performance.html
  11. 11. 11Kilde: http://httparchive.org International 1.590 KB 400000 800000 1200000 1600000 2000000 Web performance Hvordan står det til i dag?
  12. 12. 12Kilde: http://httparchive.org Web performance Hvordan står det til i dag? Svartid Tilgængelighed Kilde: http://www.digicure.dk/performance.html
  13. 13. 13 Kommuner Mar 2013 Webshops Okt 2013 International (httparchive.org) Forespørgsler 62 req. 80 req. 94 req. Størrelse 991 KB 1.229 KB 1590 KB Potentiel Besparelse (størrelse) 38 % 19 % -- Web performance Hvordan står det til i dag?
  14. 14. 14
  15. 15. 15 20 % .. mindre trafik blot ved at øge svartiden med 500 ms. Web performance – Hvorfor? Lavere bruger engagement Kilde: http://velocityconf.com/velocity2009/public/schedule/detail/8523
  16. 16. 16Kilde: http://blog.kissmetrics.com/loading-time/ • 47 % af de adspurgte brugere forventer at et website er vist indenfor 2 sekunder • 40 % af de adspurgte brugere vil forlade et website der er mere end 3 sekunder om at blive vist • 52 % af de adspurgte brugere mener at hurtige sidevisninger er vigtigt for websites loyalitet Web performance – Hvorfor? Lavere bruger engagement
  17. 17. 17 • 3 ud af 4 online shoppere bliver stressede og irriterede ifm. handel på et langsomt website • 1 ud af 5 af dem der før har forladt en indkøbskurv, var pga. et langsomt website Kilde: http://blog.kissmetrics.com/loading-time/ Web performance – Hvorfor? Lavere bruger engagement
  18. 18. 18 GlassesDirect.co.uk Kilde: http://blog.tagman.com/2012/03/just-one-second-delay-in-page-load-can-cause-7- loss-in-customer-conversions/ Web performance – Hvorfor? Økonomiske gevinster
  19. 19. 19 • Svartider –50-70 % • Båndbredde forbrug –43 % • DB CPU –75 % • Samtidige brugere +300 % Kilde: http://www.nccgroup.com/media/19242/seatwave_our_optimisation_story.pdf Web performance – Hvorfor? Tekniske gevinster
  20. 20. 20 Nedetider kan koste dyrt Web performance – Hvorfor? Nedetider Kilde: http://venturebeat.com/2013/08/19/amazon-website-down/
  21. 21. 21 Søgeoptimering og lange svartider Web performance – Hvorfor? Search Engine Optimization (SEO)
  22. 22. 22 An SEO expert walks into a bar, bars, pub, tavern, public house, Irish pub, drinks, beer, alcohol… Web performance – Hvorfor? Search Engine Optimization (SEO)
  23. 23. 23 1.5 seconds == SLOW Kilde: http://www.qubitproducts.com/wp-content/uploads/2012/04/Site-Speed- Whitepaper1.pdf Web performance – Hvorfor? Search Engine Optimization (SEO)
  24. 24. 24 Web performance – Hvorfor? Search Engine Optimization (SEO) ‘Google Recommends Mobile Websites Load in One Second or Less’ Nu også på mobile websites Kilde: http://www.cmswire.com/cms/customer-experience/google-recommends-mobile-websites-load-in- one-second-or-less-022080.php
  25. 25. 25 De besøgendes forventninger
  26. 26. 26 John Kemeny & Thomas Kurtz ”We found, that any response time that averages more than 10 seconds, destroys the illusion of having one’s own computer” 1960’erne Kilde: http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee- slow-loading-sites.html?pagewanted=all&_r=0 De besøgendes forventninger
  27. 27. 27 Forrester Research 2006 = 4 sekunder 2006 og 2009 2009 = 2 sekunder Kilde: http://www.getelastic.com/performance/ De besøgendes forventninger Kilde: http://www.akamai.com/html/about/press/releases/2009/press_091409.html
  28. 28. 28Kilde: http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee- slow-loading-sites.html?pagewanted=all&_r=0 Forsinkelse Brugerens reaktion 0 – 100 ms. Instant/øjebklikkelig 100 – 300 ms. En mindre forsinkelse 300 – 1000 ms. Fortsat fokus på opgave 1 sek. + Mental fokus forsvinder 10 sek. + ”Jeg kommer tilbage senere..” – hvis det sker De besøgendes forventninger
  29. 29. 29 Højere krav til performance 2006 = <4 sekunder 2009 = <2 sekunder 2013 = <1 sekund 1960 = <10 sekunder De besøgendes forventninger
  30. 30. 30 Hvis dit website er længere end 1 sekund om at blive vist, taber du allerede besøgende nu De besøgendes forventninger
  31. 31. 31 Performance er en fundamental del af brugeroplevelsen på websitet! Brugeroplevelsen De besøgendes forventninger Højere krav til performance
  32. 32. 32 ”Facebook sucks!” • Intuitive navigering • Timelines elegance • Svartiden! De besøgendes forventninger Brugeroplevelsen Højere krav til performance
  33. 33. 33 Performance is about respect ”Respect your user’s time and they will be more likely to walk away with a positive experience.” Brat Frost Kilde: http://bradfrostweb.com/blog/post/performance-as-design/ De besøgendes forventninger
  34. 34. 34 Hvordan kommer man godt fra start
  35. 35. 35 Fælles interesse Hvordan kommer man godt fra start
  36. 36. 36 Driftsfolkene: - Reduceret belastning Hvordan kommer man godt fra start
  37. 37. 37 Marketing og salg: - Øget aktivitet på websitet • Lavere bounce rate • Øget antal sidevisninger • Længere besøgstid • Bedre søgerangering • Øget konverteringsrater • Større brugertilfredshed! Hvordan kommer man godt fra start
  38. 38. 38 Økonomi folkene: - Lavere drift omkostninger! Hvordan kommer man godt fra start • Reduceret båndbreddeforbrug • Reduceret behov for server kraft • Reduceret strømforbrug • Reduceret CO2 udledning
  39. 39. 39 Web performance optimering - Return of Investment (ROI) Hvordan kommer man godt fra start
  40. 40. 40 Du bruger massevis af penge på din tilstedeværelse på Internettet Hvordan kommer man godt fra start • Website design og udvikling • Driftsomkostninger • Marketing • eCommerce software Performance optimering øger ROI for alle punkter!
  41. 41. 41 Opsætning af KPI’er
  42. 42. 42 Noget der kan måles på KPI’er Hvordan kommer man godt fra start
  43. 43. 43 • Konverteringsrater • Køb af varer, tilmeldelse til nyhedsbreve • Sidevisninger • Antal sidevisninger per minut en bruger genererer • Besøgstid på website • Tiden brugerne tilbringer på websitet • Bounce rate • Hvor mange brugere hopper fra • Tilgængelighed • Nedetider hvor websitet ikke er tilgængeligt • Svartider • Hvor hurtigt får brugerne vist sidevisningerne • Apdex • En indikation på om der bliver leveret acceptable svartider Hvordan kommer man godt fra start
  44. 44. 44 Svartider • Time To First Byte, TTFB • Tiden det tager at forbinde til webserveren • Time To Render, TTR • Tiden det tager at vise det første visuelle af websitet • Document Complete • Tiden det tager onload() at bliver udført • Fully Loaded • Tiden det tager at hente alt indhold på siden • Requests • Antallet af forespørgsler som websitet består af • Pagesize • Mængden af data som er at finde på websitet Hvordan kommer man godt fra start
  45. 45. 45 Apdex • Værdi mellem 0,00 – 1,00 • 1,00 er det højst opnåelige Apdex = Eksempel: Tilfredsstillende forespørgsler = <1 sek. Document Complete Acceptable forespørgsler == 1-2 sek. Document Complete Uacceptable forespørgsler == >2 sek. Document Complete Hvordan kommer man godt fra start Tilfredsstillende forespørgsler + (Acceptable forespørgsler/2) Total antal forespørgsler
  46. 46. 46 Svartider og Apdex • Svartider og Apdex ved generelle sideindlæsninger • Tiden det tager at forbinde til webserveren • Svartider og Apdex for forretningskritiske funktioner • Login, køb af vare eller udfyldning af formular Testopsætning • Side-typer (forside, produktside, osv.) • Geografiske målelokationer • Browsertype • Måleværktøj • Benchmarking, DPI Hvordan kommer man godt fra start
  47. 47. 47 Ikke i blinde! Hvordan kommer man godt fra start Du kan ikke forbedre det du ikke måler på!
  48. 48. 48 Sådan laver du en SLA for performance niveauet
  49. 49. 49 Sådan laver du en SLA for performance niveauet – 1/4 • Klar og tydelig • X : ”Websitet skal være hurtigt” • X : Websites forside skal være hentet inden for 2 sekunder • ✔: Websites forside skal have en Time-To-First-Byte tid under 300 ms. og Document Complete på under 2 sekunder. Der skal måles fra Danmark. Målingerne skal foretages i tidsrummet 08:00 – 16:00 med en Internet Explorer Browser 9. Måleværktøjet er instant@larm. • Vær’ realistisk • Hvis websitet er 8 sekunder om at blive hentet, skal kravet ikke være 1 sekund. • Benchmark op imod konkurrenter • Digicure Performance Index (DPI), www.digicure.dk
  50. 50. 50 Sådan laver du en SLA for performance niveauet – 2/4 • Hvilke sider er en del af SLA’en? • Forside, produktside, checkout-flow, kontaktside, søgning • Udvælg performance metrikker • Time-To-First-Byte, TTFB • Oppetid • (Time-To-Render, TTR | Document Complete | Fully Loaded) • Udvælg lokationer hvorfra målingerne skal foretages • Lokalt og/eller globalt? • Hvad er dine brugernes forventninger? • Brugerundersøgelse • Case studies • Vælg browsertype • Mobil • Desktop
  51. 51. 51 Sådan laver du en SLA for performance niveauet – 3/4 Eksempel: Service Level Agreement (SLA) Webside: Forsiden af www.eksempel.dk Lokationer: Danmark, USA og Australien Browsertype: Desktop – Internet Explorer 9 Værktøj: instant@larm Gennemsnitlig Document Complete: 2,41 sek. (DPI over automobiler) Krav til TTFB: 0,3 sek. (Danmark), 0,7 sek. (USA), 0,9 sek. (Australien) Krav til Document Complete: 2 sek. (Danmark), 4 sek. (USA), 5 sek. (Australien) Krav til oppetid: 99,98 % (Danmark, USA og Australien)
  52. 52. 52 Sådan laver du en SLA for performance niveauet – 4/4 • SMART – Specific, Measureable, Attainable, Realistic and Time bound • Revurdér en SLA løbende • Monitorér dine konkurrenter • Foretag løbende brugerundersøgelser • Sørg for at monitorere performance niveauet – Også selvom det ser godt ud • Gør brugerne opmærksomme på at der arbejdes hen imod højt performance niveau • Performance SLA’er er vigtige under udvikling af websites/applikationer
  53. 53. 53 Når forretningen bliver global
  54. 54. 54 CDN, Content Delivery Network Når forretningen bliver global
  55. 55. 55 • Smart-route teknologi • Komponenter placeret geografisk tættere på brugeren • Typisk statiske Fordele: • Reducering af trafik • Større skalérbarhed Når forretningen bliver global
  56. 56. 56 Hvordan vælger jeg den rette CDN udbyder? Få styr på dit behov • Hvilke fil formater skal du have hosted? • Hvor kommer dine brugere fra? (geografiske lokationer) • Hvad er trafikken på nuværende tidspunkt? • Hvad forventer man af fremtidig trafik? Og ikke mindst.. • Lyt ikke til rygter! CDN er stadig en forholdsvis ny teknologi Når forretningen bliver global
  57. 57. 57 • Supporteres de nødvendige fil formater? • Hvor er datacentrene geografisk placeret? • Hvordan bliver man faktureret? • Er der en SLA for performance? • Oppetid • Netværk og server • Svartider • Fra flere geografiske lokationer • Kompensering • Ikke kun pr. minuts nedetid Når forretningen bliver global Spørgsmål til udbyderen
  58. 58. 58 HUSK! Monitorér CDN performance Når forretningen bliver global
  59. 59. 59 Performance optimering kræver en strategi
  60. 60. 60 $ Performance optimering kræver en strategi 1. Identificér en forretningskritisk funktion på websitet 2. Definér målemetoden og succeskriterierne 3. Mål det nuværende performance niveau 4. Optimér performance niveauet 5. Indkassér fortjenesten
  61. 61. 61 $ Performance optimering kræver en strategi Igen og igen og igen..
  62. 62. 62 Hvor skal jeg fokusere mine optimeringer?
  63. 63. 63 Dit websites svartider skal være hurtigere! Hvor skal jeg fokusere mine optimeringer?
  64. 64. 64 Båndbredde og svartider
  65. 65. 65 Vil den stigende hastighed på båndbreddelinjerne løse vores problemer? NEJ! Båndbredde og svartider
  66. 66. 66 Båndbredde og svartider
  67. 67. 67 Båndbredde og svartider Båndredde og latency • Båndbredde indikerer ‘tykkelsen’ • Latency indikerer transporttiden • Transporttiden fra A til B == Latency
  68. 68. Fra Danmark 68 Båndbredde og svartider
  69. 69. 69 Latency == transporttiden fra A til B Båndbredde
  70. 70. Fra Danmark 70 Båndbredde og svartider
  71. 71. 71 Båndbredde og svartider Fra Danmark Fra Australien
  72. 72. 72 Båndbredde og svartider Fra Danmark Fra Australien
  73. 73. 73 Båndbredde og svartider Kilde: http://www.igvita.com/2012/07/19/latency-the-new-web-performance-bottleneck/ • Lysets hastighed er en begrænsning • Læg kortere kabler • 450 millioner kroner per sparet ms. • Løsning: Flyt indholdet tættere på og reducér antallet af forespørgsler
  74. 74. 74 Båndbredde og svartider Streaming er begrænset af båndbredde Web browsing er begrænset af latency
  75. 75. 75 Hvor skal jeg fokusere mine optimeringer? What’s Steve Souders saying!
  76. 76. 76 “80-90% of the end-user response time is spent on the frontend. Start there.” – Steve Sourders, Google 20 % BE = Time To First byte (TTFB) • Database opslag • Web service kald • HTML generering 80% FE = Download af indholdet: • Billeder • CSS • Scripts • Flash Hvor skal jeg fokusere mine optimeringer?
  77. 77. 77 Back End: 13 % – Front End: 87 % Back End: 20 % – Front End: 80 % Back End: 11 % – Front End: 89 % Back End: 23 % – Front End: 77 %Back End: 13 % – Front End: 87 %Back End: 16 % – Front End: 84 % Back End: 15 % – Front End: 85 % Back End: 6 % – Front End: 94 %
  78. 78. • Reducering af antal HTTP forespørgsler Hvor skal jeg fokusere mine optimeringer?
  79. 79. 79 Hvor skal jeg fokusere mine optimeringer?
  80. 80. • Reducering af antal HTTP forespørgsler • Reducering af website indholdet Hvor skal jeg fokusere mine optimeringer?
  81. 81. 81 Optimér websitet – Køb ikke mere hardware 500 kb 90 req. 250 kb 45 req. Hvor skal jeg fokusere mine optimeringer?
  82. 82. 82 Gør som Seatwave Hvor skal jeg fokusere mine optimeringer?
  83. 83. 83 Hvad er årsagen til dårlig web performance?
  84. 84. 84 For mange forespørgsler Tungt indhold som ikke er komprimeret korrekt Server konfigurationer 3. part komponenter Hvad er årsagen til dårlig web performance?
  85. 85. 85 Indhold Ansvarsområder Applikation It-infratruktur Hvad er årsagen til dårlig web performance?
  86. 86. 86 Ansvarsområde: - Indhold • Web redaktører • Webmasters • E-commerce managers Hvad er årsagen til dårlig web performance?
  87. 87. 87 Ansvarsområde: - Applikation • Webbureauer • Udviklings-hus • In-house udvikling Hvad er årsagen til dårlig web performance?
  88. 88. 88 Ansvarsområde: - It-infrastruktur • Webhotel • Hosting partner • In-house hosting Hvad er årsagen til dårlig web performance?
  89. 89. 89 Hvilke typer testværktøjer har man behov for?
  90. 90. 90 Udvælg de rigtige værktøjer Monitorering Test Optimering Udvælg dine testværktøjer
  91. 91. 91 • Svartider • Tilgængelighed • IKKE kun ping • Brugernes oplevelse udefra • 3. part monitorering Monitorering Testværktøjer – Web performance
  92. 92. 92 Testværktøjer – Web performance Real User MonitoringSynthetic Monitoring • Data fra brugernes browsers • Stor mængde data • IKKE fra Safari, Opera, IE8, Blackberry og Android 2.3 • Man har ingen indflydelse på: • Netværk • Hardware • Andet software installeret hos brugerne • Ingen data når brugerne sover • Trend spotting • Fast testopsætning: • Software • Hardware • Netværk • Alarmer • Simulering af user-flow • Tilgængeligheds monitorering
  93. 93. 93 Testværktøjer – Web performance Real User Monitoring
  94. 94. 94 Testværktøjer – Web performance <script> _gaq.push(['_setAccount','UA-XXXX-X']); _gaq.push(['_setSiteSpeedSampleRate', 100]); // #protip _gaq.push(['_trackPageview']); </script> Google Analytics >> Content >> Site Speed ● Automatisk opsamling af data – standard er kun 1% af besøgene ● Maksimalt 10.000 sidevisninger/day Real User Monitoring
  95. 95. 95 Testværktøjer – Web performance Synthetic Monitoring
  96. 96. 96 Testværktøjer – Web performance Synthetic Monitoring
  97. 97. 97 Testværktøjer – Anbefaling Synthetic Monitoring + Real User Monitoring
  98. 98. 98 • Load test • Hvor meget kan websitet holde til • Stress test • Hvor meget kan websitet holde til under en stor belastning • Endurance test • Hvordan opfører websitet sig under en længere vedvarende belastning Performancetest Testværktøjer – Web performance
  99. 99. 99 Performance optimering • Lokalisér potentielle optimeringstiltag • Udbedre ’flaskehalse’ • Reducér svartider • Reducér båndbreddeforbrug • Reducér belastning på it-infrastruktur Testværktøjer – Web performance
  100. 100. 100 Performance værktøjer Testværktøjer – Web performance
  101. 101. 101 WebPageTest.org
  102. 102. 102 WebPageTest.org
  103. 103. 103 WebPageTest.org
  104. 104. 104 WebPageTest.org
  105. 105. 105 WebPageTest.org
  106. 106. 106 WebPageTest.org
  107. 107. 107 WebPageTest.org
  108. 108. 108 Waterfall charts typer
  109. 109. 109 Manglende caching
  110. 110. 110 Langsom Back-End
  111. 111. 111 Redirect
  112. 112. 112 Langsom Redirect
  113. 113. 113 Manglende filer
  114. 114. 114 Manglende Keep-Alive
  115. 115. 115 Langsom og blokerende fil
  116. 116. 116 Store filer
  117. 117. 117 For mange filer
  118. 118. 118 Langsom Time-To-Render
  119. 119. 119 Værktøjerne er på plads! Udvælg dine testværktøjer
  120. 120. 120 God web performance på de mobile enheder
  121. 121. 121 Performance på mobile enheder Fra desktop PC til..
  122. 122. 122 Mobil performance Performance på mobile enheder
  123. 123. 123Kilde: http://www.businessinsider.com/mobile-will-eclipse-desktop-by-2014-2012-6 Performance på mobile enheder
  124. 124. 124 Land Mobile-only brugere Egypten 70 % Indien 59 % Sydafrika 57 % Indonesien 44 % USA 25 % Kilde: onDevice Research Performance på mobile enheder
  125. 125. 125 ”Der er flere der har adgang til mobiltelefon, end adgang til rindende vand og tandbørster” Kilde: http://blogs.worldbank.org/africacan/more-cell-phones-than-toilets
  126. 126. 126 Performance på mobile enheder
  127. 127. 127 Er de mobile brugere mere tålmodige?
  128. 128. 128 ”85 % af de mobile bruger forventer at mobile sites loader lige så hurtigt eller hurtigere end desktop sites” Kilde: http://www.strangeloopnetworks.com/web-performance-infographics/
  129. 129. 129 Performance på mobile enheder
  130. 130. 130 Performance på mobile enheder
  131. 131. 131 ”75 % af de mobile brugere vil forlade et website, hvis det tager længere end 5 sekunder at få indholdet vist”
  132. 132. 132 Hvad skal man være opmærksom på når man skal levere god performance på det mobile netværk?
  133. 133. 13 3 Kilde: http://www.webperformancetoday.com/2013/08/06/8-mobile-performance- assumptions/ Belastning på radiomast Vejret Retning mod radiomast Afstand Performance på mobile enheder
  134. 134. 13 4 Fra Holland Fra Australien 4G Netværket - ’Under the hood’ Performance på mobile enheder
  135. 135. 13 5 Fra Holland Fra Australien 4G Netværket - Vil gøre livet nemmere LTE/4G 3G ’Idle’ tilstand < 100 ms < 2,5 sek. Performance på mobile enheder
  136. 136. 13 6 Fra Holland Fra Australien 4G Netværket - Vil gøre livet nemmere Samlet latency ‘Idle’ Edge 670-830 ms +2,5 sek. 3G 120-280 ms +2,5 sek. 4G 65-86 ms +100 ms Desktop 10-30 ms - Kilde: https://docs.google.com/presentation/d/1wAxB5DPN- rcelwbGO6lCOus_S1rP24LMqA8m1eXEDRo/present#slide=id.g11c1373c5_5_0 Performance på mobile enheder
  137. 137. 13 7 Båndbredde og svartider Fra Danmark Fra Australien
  138. 138. 13 8 Fra Holland Fra Australien OpenSignal.com Performance på mobile enheder
  139. 139. 13 9 4G Netværket - Vil gøre livet nemmere Kilde: https://docs.google.com/presentation/d/1wAxB5DPN- rcelwbGO6lCOus_S1rP24LMqA8m1eXEDRo/present#slide=id.g11c1373c5_5_0 Performance på mobile enheder TDC Telia Telenor 3 ‘Idle’ Edge 994 ms 1109 ms 1294 ms 930 ms +2,5 sek. 3G 437 ms 280 ms 399 ms 317 ms +2,5 sek. 4G 76 ms 223 ms 90 ms 162 ms +100 ms Samlet latency ‘Idle’ Edge 670-830 ms +2,5 sek. 3G 120-280 ms +2,5 sek. 4G 65-86 ms +100 ms Desktop 10-30 ms -
  140. 140. 14 0 4G Netværket - Vil gøre livet nemmere • 4G er ikke tilgængelig for os alle endnu • 3G netværket forsvinder ikke foreløbigt Hvad kan vi gøre ved det? • Websites størrelse • Antal forespørgsler (VIGTIG) Løsninger: • Reducér mængden af data • Reducér antallet af forespørgsler • Komprimering • Caching Performance på mobile enheder
  141. 141. 14 1 Opsummering 1/2 Hvad har vi gennemgået? • Introduktion til hvorfor web performance er vigtigt • Cases, SEO og svartider • Brugernes forventning • Hvordan kommer man godt fra start • Opsætning af KPI’er og SLA’er inden for web performance • Hvilke KPI’er har web performance indflydelse på • Hvilke SLA’er har man mulighed for at opsætte • Hvordan specificerer man en SLA • SLA’er for CDN udbydere • Performance optimering kræver en strategi • Performance optimering som en løbende proces
  142. 142. 14 2 Opsummering 2/2 Hvad har vi gennemgået? • Hvor skal man fokusere sine optimeringer? Hvor er effekten størst? • Båndbredde og svartider • Reducér forespørgsler og indhold • Hvilke typer af værktøjer har man behov for? • Monitorering, test og optimering • instant@larm og WebPageTest.org • God web performance på de mobile enheder. Hvordan? • Mobil brugernes stigende trafik og forventninger • 3G /4G netværket og latency
  143. 143. Google har altid ret “As a product manager you should know that speed is product feature number one.” - Larry Page (Google Founder)
  144. 144. Tobias Borg Petersen, mail: tbp@digicure.dk www: digicure.dk
  145. 145. 145
  146. 146. instant@larm
  147. 147. Performance monitorering • Synthetic monitoring • Uvildig 3. part • 24/7/365 overvågning • SaaS løsning – ingen installation • Alarmering pr. SMS og/eller e-mail Simulering af en reel brugeradfærd • Målt udefra – foran firewall, load balancers, LAN • Simulerer Internet Explorer 9 Typer af målinger • URL-måling • Inkl. mobile enheder • FTP-måling • SMTP-måling • PING-måling • CITRIX-måling • Transaktions-måling instant@larm
  148. 148. Step 1 – Gå til forside Step 2 – Indtaster ’E-mail’ Step 3 – Indtaster ’Password’ Step 4 – Klikker ’Sign-in’ Step 5 – Klikker ’Sign Out’ instant@larm
  149. 149. instant@larm
  150. 150. instant@larm
  151. 151. instant@larm
  152. 152. Det nye instant@larm
  153. 153. instant@larm
  154. 154. instant@larm
  155. 155. Nye måle metrikker • Time-to-render, TTR • Document Complete/Fully Loaded • Cashed vs. Non-Cashed • Speed Index Fejlfinding (Debug-mode) • Video optagelse • HAR-fil generator • Screenshots ved fejl Andet • Helt nyt design og teknisk platform • Automatisk oprettelse af målinger • Valg af browsertype • API • Mobil app Det nye instant@larm
  156. 156. signup.instantalarm.dk
  157. 157. Gratis demo i 2 måneder

Notas do Editor

  • Når man ser på alle dem som understøtter og er med til at skabe fundamentet for at vi overhovedet har adgang til informationer på nettet er der en ting der går igen

    HASTIGHED
  • Novonordisk.com Req: 104 Size: 2102
    NNIT.com Req: 41 Size: 483
    TimeLog.dk Req: 39 Size: 1097
    SBSDiscorvery.dk Req: 56 Size: 3717
    Schultz.dk Req: 52 Size: 626
    Moviatrafik.dk Req: 76 Size: 808
    TV2.dk Req: 222 Size: 2620
    Dong.dk Req: 64 Size: 1663
  • http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee-slow-loading-sites.html?pagewanted=all&_r=0

    invented the BASIC programming language
  • http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee-slow-loading-sites.html?pagewanted=all&_r=0

    invented the BASIC programming language
  • Responsive Web Design

    Internettet kan tilgås og interageres på op til flere forskellige enheder
    PC’er, mobiltelefoner, tablets

    Internettets evner til at blive tilgået på flere typer og hastigheder af netværk
    Båndbredde, latency, mobil netværk, osv.

    Web performance har stor betydning for brugeroplevelse
    Cases som KISSMetrics, GlassesDirect og Seatwave
  • Responsive Web Design

    Internettet kan tilgås og interageres på op til flere forskellige enheder
    PC’er, mobiltelefoner, tablets

    Internettets evner til at blive tilgået på flere typer og hastigheder af netværk
    Båndbredde, latency, mobil netværk, osv.

    Web performance har stor betydning for brugeroplevelse
    Cases som KISSMetrics, GlassesDirect og Seatwave
  • http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee-slow-loading-sites.html?pagewanted=all&_r=0

    invented the BASIC programming language
  • Længere besøgstid

    Bedre søgerangering

    Øget konverteringsrater

    Øget antal sidevisninger

    Lavere bounce rate

    Større brugertilfredshed!
  • Konverteringsrater
    Køb af varer, tilmeldelse til nyhedsbreve

    Sidevisninger
    Antal sidevisninger per minut en brugerne besøger

    Besøgstid på website
    Tiden brugerne tilbringer på websitet

    Bounce rate
    Hvor mange brugere hopper fra

    Tilgængelighed
    Nedetider hvor websitet ikke er tilgængeligt

    Svartider
    Hvor hurtigt får brugerne vist sidevisningerne
  • Konverteringsrater
    Køb af varer, tilmeldelse til nyhedsbreve

    Sidevisninger
    Antal sidevisninger per minut en brugerne besøger

    Besøgstid på website
    Tiden brugerne tilbringer på websitet

    Bounce rate
    Hvor mange brugere hopper fra

    Tilgængelighed
    Nedetider hvor websitet ikke er tilgængeligt

    Svartider
    Hvor hurtigt får brugerne vist sidevisningerne
  • Konverteringsrater
    Køb af varer, tilmeldelse til nyhedsbreve

    Sidevisninger
    Antal sidevisninger per minut en brugerne besøger

    Besøgstid på website
    Tiden brugerne tilbringer på websitet

    Bounce rate
    Hvor mange brugere hopper fra

    Tilgængelighed
    Nedetider hvor websitet ikke er tilgængeligt

    Svartider
    Hvor hurtigt får brugerne vist sidevisningerne
  • Konverteringsrater
    Køb af varer, tilmeldelse til nyhedsbreve

    Sidevisninger
    Antal sidevisninger per minut en brugerne besøger

    Besøgstid på website
    Tiden brugerne tilbringer på websitet

    Bounce rate
    Hvor mange brugere hopper fra

    Tilgængelighed
    Nedetider hvor websitet ikke er tilgængeligt

    Svartider
    Hvor hurtigt får brugerne vist sidevisningerne
  • Content
    Web redaktører, ecommerce managers
    Application
    Webbureauer, udviklingshuse, in-house development


    Infrastructure
    Hosting partner, webhotel, driftfolk
  • Content
    Web redaktører, ecommerce managers
    Application
    Webbureauer, udviklingshuse, in-house development


    Infrastructure
    Hosting partner, webhotel, driftfolk
  • Content
    Web redaktører, ecommerce managers
    Application
    Webbureauer, udviklingshuse, in-house development


    Infrastructure
    Hosting partner, webhotel, driftfolk
  • Content
    Web redaktører, ecommerce managers
    Application
    Webbureauer, udviklingshuse, in-house development


    Infrastructure
    Hosting partner, webhotel, driftfolk
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Svartider

    Tilgængelighed

    IKKE ping

    Brugernes oplevelse udefra

    3. part monitorering
  • Lokalisér potentielle optimeringstiltag

    Udbedre ’flaskehalse’

    Reducér svartider

    Reducér båndbreddeforbrug

    Reducér belastning på it-infrastruktur
  • http://www.webpagetest.org/
    http://fiddler2.com/
    http://developers.google.com/speed/pagespeed/insights/
    http://getfirebug.com/
    http://developer.yahoo.com/yslow/
    http://www.digicure.dk/webperformance-x-ray.html
  • Responsive Web Design

    Internettet kan tilgås og interageres på op til flere forskellige enheder
    PC’er, mobiltelefoner, tablets

    Internettets evner til at blive tilgået på flere typer og hastigheder af netværk
    Båndbredde, latency, mobil netværk, osv.

    Web performance har stor betydning for brugeroplevelse
    Cases som KISSMetrics, GlassesDirect og Seatwave
  • Responsive Web Design

    Internettet kan tilgås og interageres på op til flere forskellige enheder
    PC’er, mobiltelefoner, tablets

    Internettets evner til at blive tilgået på flere typer og hastigheder af netværk
    Båndbredde, latency, mobil netværk, osv.

    Web performance har stor betydning for brugeroplevelse
    Cases som KISSMetrics, GlassesDirect og Seatwave

×