SlideShare une entreprise Scribd logo
1  sur  33
High Performance Web
Application Lifecycle
Alois Reitbauer, Technology Strategist
Compuware
about:me




                            Alois Reitbauer
           Technology Strategist, Compuware
                           @AloisReitbauer
            alois.reitbauer@compuware.com
We all know
the “basics”
Trend in Web page size
Continuous
   Continuous Integration
   Continuous Monitoring
Automated Web
Performance Testing
Automated Test Environment
Ensure tracing is started with your tests

 <target name="test">
  <junit fork="true" haltonfailure="true">
   <test name="com.dynatrace.ajax.selenium.SimpleTest" />
    <env key="DT_AE_AGENTACTIVE" value="true" />
    <env key="DT_IE_AGENTNAME" value="SimpleTest" />
    <env key="DT_IE_SERVERPORT" value="9988" />
 </junit>
 </target>
Configure automatic test result upload

 -Dcom.dynatrace.diagnostics.ajax.beacon.autoupload= true
 -Dcom.dynatrace.diagnostics.ajax.beacon.uploadurl=
    http://localhost:8080/beaconstorage/endpoint/
 -Dcom.dynatrace.diagnostics.ajax.beacon.portalurl=
    http://localhost:8080/beaconstorage/dashboard.html
Analyze Performance across Builds
Scaling Continuous Integration
Does this really work?
http://www.speedoftheweb.org/report/accf780e-abe2-4aa1-82cc-3dbe5bf4eacb
The Good Parts
For free with functional tests
Provides immediate feedback
Detects most common problems


                         To keep in mind
          Timings not necessarily accurate
          “Real World” Deployment is best
                   Needs cultural support
Continuous Monitoring in
Production
A typical eCommerce Page
... now without external dependencies




                                # of       # of      Total     DNS      Connect
                              Domains   Resources    Bytes     [ms]      [ms]

   With Third Party Content     26        176       2856 Kb   1286,82   1176,09

   Without Third Party
                                 2         59       897 Kb     0,91      22,25
   Content
How to get this metrics for
our users?
onLoad Time Measurement

<html>
 <head>
 <script type="text/javascript">
  var start = new Date().getTime();
  function onLoad() {
     var now = new Date().getTime();
     var latency = now - start; alert("page loading time: " + latency);
   }
 </script>
 </head>
 <body onload="onLoad()">
 ……
Resource Time Measurement



……
<script type="text/javascript">
 downloadStart(“myimg”);
</script>
<img src=“./myimg.jpg” onload=“downloadEnd(„myimg‟)” />
…..
W3C
Performance
Working Group
Web performance specifications
• Navigation Timing
  Timing Information on Page Loading
• Resource Timing
  Performance information on individual resources.
• User Timing
  Custom user actions or specific timings e.g.: getting a search result
• Performance Timeline
  Unified API for accessing all this information
window.performance.timing.
Works in many browsers




   http://blog.dynatrace.com/samples/bookmark.html
window.performance.getEntriesByType(“resource”);
The Good Parts
Very detailed timing information
“No”effort to get data
Easy to find network-based problems


                          To keep in mind
          Not supported in older browsers
                   Safari is not supported
                     No JavaScript insight
Polyfilling for older browsers

                          Page Load Time
       Resource loading (except JS & CSS)
                      also works in Safari

        Insight into JavaScript executions
                  Browser Error Reporting
      Merge with “classical” analytics data
Cool stuff you can do with
this
CDN Performance Monitoring
Third Party Content Monitoring
Screen size impact on rendering
Putting it all together
33
     © 2011 Compuware Corporation — All Rights Reserved

Contenu connexe

Tendances

Aspnet Ajax Performance Improvement
Aspnet Ajax Performance ImprovementAspnet Ajax Performance Improvement
Aspnet Ajax Performance Improvement
Lance Zhang
 
W3C Web Performance - A detailed overview
W3C Web Performance - A detailed overviewW3C Web Performance - A detailed overview
W3C Web Performance - A detailed overview
Alois Reitbauer
 

Tendances (15)

Aspnet Ajax Performance Improvement
Aspnet Ajax Performance ImprovementAspnet Ajax Performance Improvement
Aspnet Ajax Performance Improvement
 
Slideshare
SlideshareSlideshare
Slideshare
 
Event-Sourcing your React-Redux applications
Event-Sourcing your React-Redux applicationsEvent-Sourcing your React-Redux applications
Event-Sourcing your React-Redux applications
 
Event-Sourcing your React-Redux applications at HolyJS 2016
Event-Sourcing your React-Redux applications at HolyJS 2016Event-Sourcing your React-Redux applications at HolyJS 2016
Event-Sourcing your React-Redux applications at HolyJS 2016
 
Core Web Vitals Optimization for any website, especially WordPress
Core Web Vitals Optimization for any website, especially WordPressCore Web Vitals Optimization for any website, especially WordPress
Core Web Vitals Optimization for any website, especially WordPress
 
W3C Web Performance - A detailed overview
W3C Web Performance - A detailed overviewW3C Web Performance - A detailed overview
W3C Web Performance - A detailed overview
 
Sergejus Barinovas
Sergejus BarinovasSergejus Barinovas
Sergejus Barinovas
 
Sencha At Xero
Sencha At XeroSencha At Xero
Sencha At Xero
 
Magento Meetup New Delhi- Magento2 Speed Optimization
Magento Meetup New Delhi- Magento2 Speed OptimizationMagento Meetup New Delhi- Magento2 Speed Optimization
Magento Meetup New Delhi- Magento2 Speed Optimization
 
Firebase-ized your mobile app
Firebase-ized  your mobile appFirebase-ized  your mobile app
Firebase-ized your mobile app
 
TechDays 2015 The Azure Sightseeing Tour
TechDays 2015 The Azure Sightseeing TourTechDays 2015 The Azure Sightseeing Tour
TechDays 2015 The Azure Sightseeing Tour
 
Azure Mobile Services : Service Enablement at its best
Azure Mobile Services : Service Enablement at its bestAzure Mobile Services : Service Enablement at its best
Azure Mobile Services : Service Enablement at its best
 
JAMstack WTJ
JAMstack WTJJAMstack WTJ
JAMstack WTJ
 
salkdjfhdjkghdfkjh
salkdjfhdjkghdfkjhsalkdjfhdjkghdfkjh
salkdjfhdjkghdfkjh
 
Progressive Web Application - Advanced Topics
Progressive Web Application - Advanced TopicsProgressive Web Application - Advanced Topics
Progressive Web Application - Advanced Topics
 

Similaire à The High Performance Web Application Lifecycle

Measuring User Experience in the Browser
Measuring User Experience in the BrowserMeasuring User Experience in the Browser
Measuring User Experience in the Browser
Alois Reitbauer
 
Measuring User Experience
Measuring User ExperienceMeasuring User Experience
Measuring User Experience
Alois Reitbauer
 
[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design
Christopher Schmitt
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
Christopher Schmitt
 

Similaire à The High Performance Web Application Lifecycle (20)

Web performance tuning
Web performance tuning Web performance tuning
Web performance tuning
 
Measuring User Experience in the Browser
Measuring User Experience in the BrowserMeasuring User Experience in the Browser
Measuring User Experience in the Browser
 
Droidcon Paris 2015
Droidcon Paris 2015Droidcon Paris 2015
Droidcon Paris 2015
 
Measuring User Experience
Measuring User ExperienceMeasuring User Experience
Measuring User Experience
 
Presentation Tier optimizations
Presentation Tier optimizationsPresentation Tier optimizations
Presentation Tier optimizations
 
Vered Flis: Because performance matters! Architecture Next 20
Vered Flis: Because performance matters! Architecture Next 20Vered Flis: Because performance matters! Architecture Next 20
Vered Flis: Because performance matters! Architecture Next 20
 
E Commerce Analytics Demandware
E Commerce Analytics DemandwareE Commerce Analytics Demandware
E Commerce Analytics Demandware
 
[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design
 
PrairieDevCon 2014 - Web Doesn't Mean Slow
PrairieDevCon 2014 -  Web Doesn't Mean SlowPrairieDevCon 2014 -  Web Doesn't Mean Slow
PrairieDevCon 2014 - Web Doesn't Mean Slow
 
Client side production monitoring using - SyncApp Tool
Client side production monitoring using - SyncApp ToolClient side production monitoring using - SyncApp Tool
Client side production monitoring using - SyncApp Tool
 
Building high performing web pages
Building high performing web pagesBuilding high performing web pages
Building high performing web pages
 
James Turner (Caplin) - Enterprise HTML5 Patterns
James Turner (Caplin) - Enterprise HTML5 PatternsJames Turner (Caplin) - Enterprise HTML5 Patterns
James Turner (Caplin) - Enterprise HTML5 Patterns
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
 
Salesforce Performance hacks - Client Side
Salesforce Performance hacks - Client SideSalesforce Performance hacks - Client Side
Salesforce Performance hacks - Client Side
 
"Progressive Web Apps" by Riza Fahmi (Hacktiv8)
"Progressive Web Apps" by Riza Fahmi	(Hacktiv8)"Progressive Web Apps" by Riza Fahmi	(Hacktiv8)
"Progressive Web Apps" by Riza Fahmi (Hacktiv8)
 
Progressive Web Apps. What, why and how
Progressive Web Apps. What, why and howProgressive Web Apps. What, why and how
Progressive Web Apps. What, why and how
 
AWS re:Invent 2016: Amazon CloudFront Flash Talks: Best Practices on Configur...
AWS re:Invent 2016: Amazon CloudFront Flash Talks: Best Practices on Configur...AWS re:Invent 2016: Amazon CloudFront Flash Talks: Best Practices on Configur...
AWS re:Invent 2016: Amazon CloudFront Flash Talks: Best Practices on Configur...
 
Optimizing your WordPress website
Optimizing your WordPress websiteOptimizing your WordPress website
Optimizing your WordPress website
 
BrightonSEO 2019 - Edge SEO - Using CDNs To Perform SEO On The Edge
BrightonSEO 2019 - Edge SEO - Using CDNs To Perform SEO On The EdgeBrightonSEO 2019 - Edge SEO - Using CDNs To Perform SEO On The Edge
BrightonSEO 2019 - Edge SEO - Using CDNs To Perform SEO On The Edge
 
[@IndeedEng] Engineering Velocity: Building Great Software Through Fast Itera...
[@IndeedEng] Engineering Velocity: Building Great Software Through Fast Itera...[@IndeedEng] Engineering Velocity: Building Great Software Through Fast Itera...
[@IndeedEng] Engineering Velocity: Building Great Software Through Fast Itera...
 

Plus de Alois Reitbauer

The Dark Art of Production Alerting
The Dark Art of Production AlertingThe Dark Art of Production Alerting
The Dark Art of Production Alerting
Alois Reitbauer
 
The Dark of Building an Production Incident Syste
The Dark of Building an Production Incident SysteThe Dark of Building an Production Incident Syste
The Dark of Building an Production Incident Syste
Alois Reitbauer
 
Monitoring and Managing Java Applications
Monitoring and Managing Java ApplicationsMonitoring and Managing Java Applications
Monitoring and Managing Java Applications
Alois Reitbauer
 
Web Performance Optimzation
Web Performance OptimzationWeb Performance Optimzation
Web Performance Optimzation
Alois Reitbauer
 
What it means to deliver exceptional performance
What it means to deliver exceptional performanceWhat it means to deliver exceptional performance
What it means to deliver exceptional performance
Alois Reitbauer
 
Why you have less than a second to deliver exceptional performance
Why you have less than a second to deliver exceptional performanceWhy you have less than a second to deliver exceptional performance
Why you have less than a second to deliver exceptional performance
Alois Reitbauer
 
Measuring Performance in the Browser
Measuring Performance in the BrowserMeasuring Performance in the Browser
Measuring Performance in the Browser
Alois Reitbauer
 
The secret art of agile performance testing
The secret art of agile performance testingThe secret art of agile performance testing
The secret art of agile performance testing
Alois Reitbauer
 

Plus de Alois Reitbauer (20)

Monitoring large scale Docker production environments
Monitoring large scale Docker production environmentsMonitoring large scale Docker production environments
Monitoring large scale Docker production environments
 
Can a monitoring tool pass the turing test
Can a monitoring tool pass the turing testCan a monitoring tool pass the turing test
Can a monitoring tool pass the turing test
 
Monitoring Docker Application in Production
Monitoring Docker Application in ProductionMonitoring Docker Application in Production
Monitoring Docker Application in Production
 
The definition of normal - An introduction and guide to anomaly detection.
The definition of normal - An introduction and guide to anomaly detection. The definition of normal - An introduction and guide to anomaly detection.
The definition of normal - An introduction and guide to anomaly detection.
 
Monitoring without alerts
Monitoring without alertsMonitoring without alerts
Monitoring without alerts
 
Ruxit - How we launched a global monitoring platform on AWS in 80 days.
Ruxit - How we launched a global monitoring platform on AWS in 80 days. Ruxit - How we launched a global monitoring platform on AWS in 80 days.
Ruxit - How we launched a global monitoring platform on AWS in 80 days.
 
Microservice, Micro Deployments and DevOps
Microservice, Micro Deployments and DevOpsMicroservice, Micro Deployments and DevOps
Microservice, Micro Deployments and DevOps
 
The Dark Art of Production Alerting
The Dark Art of Production AlertingThe Dark Art of Production Alerting
The Dark Art of Production Alerting
 
The Dark of Building an Production Incident Syste
The Dark of Building an Production Incident SysteThe Dark of Building an Production Incident Syste
The Dark of Building an Production Incident Syste
 
Monitoring and Managing Java Applications
Monitoring and Managing Java ApplicationsMonitoring and Managing Java Applications
Monitoring and Managing Java Applications
 
What it means to be fast in your industry
What it means to be fast in your industryWhat it means to be fast in your industry
What it means to be fast in your industry
 
Web Performance Optimzation
Web Performance OptimzationWeb Performance Optimzation
Web Performance Optimzation
 
What it means to deliver exceptional performance
What it means to deliver exceptional performanceWhat it means to deliver exceptional performance
What it means to deliver exceptional performance
 
Why you have less than a second to deliver exceptional performance
Why you have less than a second to deliver exceptional performanceWhy you have less than a second to deliver exceptional performance
Why you have less than a second to deliver exceptional performance
 
Measuring Performance in the Browser
Measuring Performance in the BrowserMeasuring Performance in the Browser
Measuring Performance in the Browser
 
Performance Forensics - Understanding Application Performance
Performance Forensics - Understanding Application PerformancePerformance Forensics - Understanding Application Performance
Performance Forensics - Understanding Application Performance
 
Architecture Performance
Architecture PerformanceArchitecture Performance
Architecture Performance
 
dynaTrace Ajax Edition @ Yahoo
dynaTrace Ajax Edition @ YahoodynaTrace Ajax Edition @ Yahoo
dynaTrace Ajax Edition @ Yahoo
 
The secret art of agile performance testing
The secret art of agile performance testingThe secret art of agile performance testing
The secret art of agile performance testing
 
Architecture in Ajax Applications
Architecture in Ajax ApplicationsArchitecture in Ajax Applications
Architecture in Ajax Applications
 

Dernier

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 

Dernier (20)

MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 

The High Performance Web Application Lifecycle

Notes de l'éditeur

  1. url parameter zumabschalten der einzelnenseitenelemente