Arquitectura del Software - GitHub Pages
19
Escuela de Ingeniería Informática de Oviedo Arquitectura del Software Lab. 12 Monitorización y evaluación de rendimiento (profiling) 2019-20 Universidad de Oviedo Jose Emilio Labra Gayo Pablo González Irene Cid Hugo Lebredo
Transcript of Arquitectura del Software - GitHub Pages
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Arquitectura del SoftwareLab. 12
Monitorización y evaluación de rendimiento (profiling)
2019-20
Universidad de Oviedo
Jose Emilio Labra GayoPablo GonzálezIrene CidHugo Lebredo
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Monitorizar: Observar comportamiento de un softwareCuadros de mando
Habitualmente, después del despliegue
Profiling (caracterizar): Medir rendimiento de un software mientras se ejecuta
Identificar partes que contribuyen a un problema
Mostrar dónde centrar los esfuerzos para mejorar rendimiento
Suele hacerse antes del despliegue
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Monitorización & profiling
Monitorizar una aplicación mientras se ejecutaRegistrar uso de CPU, memoria, hilos, etc.
JavaScript:Chrome (Timeline), Firefox Developer Edition
(Performance tool), Microsoft(Ajax View)Herramientas de servidor:
VisualVM, JProfiler, YourKit, etc.VisualVM
https://visualvm.github.io/Ya está instalada con el JDK: jvisualvm
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Server/Java: VisualVM
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Browser: developer tools
• Monitorizar/chequear rendimiento
https://developers.google.com/web/tools/chrome-devtools/evaluate-performance
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Ejemplo con Google Chrome
Modo incognito
En la esquina superior derecha, click en los tres puntos y nueva ventanaincógnitoWindows, Linux, or Chrome OS: Ctrl + Shift + n.Mac: ⌘ + Shift + n.
Windows, Linux: Control+Shift+IMac: Command+Option+I
Chrome DevTools
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Ejemplo con Google Chromehttps://googlechrome.github.io/devtools-samples/jank/
Performance>CPU>2 x Slowdown
Performance>Recordclick Add 10 (20 veces)Optimize / Un-optimize
Stop
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Ejemplo con Google Chrome
Profile:
Frames per Second ➡️
CPU ➡️
Cuello de botella➡️
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Otras herramientas browser
RAIL model (Response, Animation, Idle, Load)https://developers.google.com/web/fundamentals/performance/rail
https://webpagetest.org/easy
Lighthouse (viene con Chrome)
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
React Developer Tools
React trabaja en dos fases: • Render• Commit
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
React Developer Tools
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
React DOM – Virtual DOM
Fuente : https://es.reactjs.org/docs/optimizing-performance.html
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Alternativas monitorización Web• Spring-boot proporciona “Actuator” para
características en producción
• Algunos systems:
▫ Prometheus, Graphite, Grafana, Datadog, Nagios, Sensu, …
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Ideas para la presentación
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Presentación de la arquitectura
Para este curso
Presentación: 15-20'
Preguntas: 5-15'
Los profesores seleccionan al profesor
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
¿Qué presentar?
Enfocarse en aspectos claves
- Presentar arquitectura y sistema
- Atributos de calidad/estrategias para resolverlos
- Demo
- Pruebas (pruebas de aceptación, carga,...)
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Presentando arquitecturas
https://www.youtube.com/watch?v=pJc0l2DASpo&t=299s
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Mejorar las presentacioneshttps://presentationpatterns.com/resources/
https://www.oreilly.com/library/view/presentation-patterns/9781491954980/
https://www.presentationzen.com/
Arquitectura del SoftwareE
sc
ue
la d
e I
ng
en
ier
ía I
nfo
rm
áti
ca
de
Ov
ied
oU
niv
er
sid
ad
de
Ov
ied
o
Bibliografía y enlaces
• Monitorización y profiling
▫ Get Started With Analyzing Runtime Performancehttps://developers.google.com/web/tools/chrome-devtools/evaluate-performance/
▫ How to Use the Timeline Tool• https://developers.google.com/web/tools/chrome-devtools/evaluate-performance
timeline-tool#profile-js
• Presentaciones▫ Presentation Zen Garr Reynolds
https://www.presentationzen.com/
▫ https://www.amazon.com/gp/product/0321811984
