Top Banner
School of Computer Science, University of Oviedo Software Architecture Lab. 12 Monitoring & profiling How-to do a presentation 2019-20 Jose Emilio Labra Gayo Pablo González Irene Cid Hugo Lebredo
19

Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Jan 03, 2021

Download

Documents

dariahiddleston
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do Software Architecture

Lab. 12

Monitoring & profiling

How-to do a presentation

2019-20

Jose Emilio Labra GayoPablo GonzálezIrene CidHugo Lebredo

Page 2: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Monitoring: Observe the behaviour at runtime while software is running

Dashboards

Usually, after deployment

Profiling: Measure performance of a software while it is running

Identify parts of a system that contribute to a performance problem

Show where to concentrate the efforts

Usually before deployment

Page 3: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Monitoring & profiling

Monitors an application while it is running

Records performance (CPU & memory usage)

JavaScript:

Chrome (Timeline), Firefox Developer Edition (Performance tool),

Microsoft(Ajax View)

Server-side: JVisualVM, JProfiler, YourKit, JConsole

Monitoring: Graphite, Datadog

VisualVMhttps://visualvm.github.io/

jvisualvm

Page 4: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Java/server JVisualVM

Page 5: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Browser: developer tools

Monitor/check performance

https://developers.google.com/web/tools/chrome-devtools/evaluate-performance

Page 6: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Example with Google Chrome

Incognito mode

At the top right, click the three dots and then New Incognito Window.

Windows, Linux, or Chrome OS: Press Ctrl + Shift + n.Mac: Press ⌘ + Shift + n.

Windows, Linux: Control+Shift+IMac: Command+Option+I

DevTools

Page 7: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Example with Google Chromehttps://googlechrome.github.io/devtools-samples/jank/

Performance>CPU>2 x Slowdown

Performance>Recordclick Add 10 (20 times)try Optimize / Un-optimize

Stop

Page 8: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Example with Google Chrome

Profile result:

Frames per Second ➡️

CPU ➡️

Bottleneck➡️

Page 9: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Other tools for browser

RAIL model:

Response, Animation, Idle, Loadhttps://developers.google.com/web/fundamentals/performance/rail

https://webpagetest.org/easy

Lighthouse (with Chrome)

Page 10: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

React Developer Tools

React works in two stages: • Render• Commit

Page 11: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

React Developer Tools

Page 12: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

React DOM – Virtual DOM

Source: https://es.reactjs.org/docs/optimizing-performance.html

Page 13: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Web monitoring alternativesSpring-boot provides “Actuator” for

features in production

Some systems:

Prometheus, Graphite, Grafana, Datadog,

Nagios, Sensu, …

Page 14: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do Ideas for the presentation

Page 15: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Presenting architecture

For this course

- Talk about 15-20'

- Questions: 5-15'

- Teachers select the presenter

Page 16: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

What to present?

Focus on key aspects

- Present architecture & system

- Quality attributes/strategies

- Demo

- Tests (acceptance tests, load tests,...)

Page 17: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Presenting architectures

https://www.youtube.com/watch?v=pJc0l2DASpo&t=299s

Page 18: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Improving presentations

https://presentationpatterns.com/resources/https://www.oreilly.com/library/view/presentation-patterns/9781491954980/

https://www.presentationzen.com/

Page 19: Presentación de PowerPoint · 2020. 6. 6. · Hugo Lebredo. Software Architecture l r ce, y o Monitoring: Observe the behaviour at runtime while software is running Dashboards Usually,

Software ArchitectureS

ch

oo

lo

f C

om

pu

ter

Sc

ien

ce

, U

niv

er

sit

yo

f O

vie

do

Links

Monitoring & Profiling

Get Started With Analyzing Runtime Performancehttps://developers.google.com/web/tools/chrome-devtools/evaluate-performance/

How to Use the Timeline Toolhttps://developers.google.com/web/tools/chrome-devtools/evaluate-performance timeline-

tool#profile-js

PresentationPresentation Zen Garr Reynolds

https://www.presentationzen.com/

https://www.amazon.com/gp/product/0321811984