Transcript
Page 1: Codequalität messen (enterJS 2014)

Codequalität messen EnterJS, 01. Juli 2014

Page 2: Codequalität messen (enterJS 2014)

Andy Grunwald

• Software Engineer bei @trivago

• Open Source

• @andygrunwald

• @PHPUGDus

• andygrunwald

Page 3: Codequalität messen (enterJS 2014)

Code | qualität | messen

Page 4: Codequalität messen (enterJS 2014)
Page 5: Codequalität messen (enterJS 2014)

–Helmut Balzert

„Unter Softwarequalität versteht man die Gesamtheit der Merkmale … eines Softwareprodukts, …, festgelegte oder

vorausgesetzte Erfordernisse zu erfüllen.“

Page 6: Codequalität messen (enterJS 2014)
Page 7: Codequalität messen (enterJS 2014)

(Software)-Metriken

Page 8: Codequalität messen (enterJS 2014)

Frontend

HTTP Requests

Navigation Timing

DOM Elemente

Browser Repaints

Backend

Request-Zeit

Cache-Miss / -Hits

Ressource-Zeit

Business-Logik

Source Code

Page 9: Codequalität messen (enterJS 2014)

Source Code

Functions count

Nested depth

Halstead

Maintainability index

LOC

Parameter count

Cyclomatic ComplexitynPath

Lint errors

CLOCLLOC

Your metric here

Page 10: Codequalität messen (enterJS 2014)

Source Code

Functions count

Nested depth

Halstead

Maintainability index

LOC

Parameter count

Cyclomatic ComplexitynPath

Lint errors

CLOCLLOC

Your metric here

Page 11: Codequalität messen (enterJS 2014)

_.isEmpty(e);

Page 12: Codequalität messen (enterJS 2014)

_.isEmpty(e);

• LOC: 19

Page 13: Codequalität messen (enterJS 2014)

_.isEmpty(e);

• LOC: 19

• CLOC: 2

Page 14: Codequalität messen (enterJS 2014)

_.isEmpty(e);

• LOC: 19

• CLOC: 2

• NCLOC: 17

Page 15: Codequalität messen (enterJS 2014)

_.isEmpty(e);

• LOC: 19

• CLOC: 2

• NCLOC: 17

• LLOC: 9

Page 16: Codequalität messen (enterJS 2014)

Source Code

Functions count

Nested depth

Halstead

Maintainability index

LOC

Parameter count

Cyclomatic ComplexitynPath

Lint errors

CLOCLLOC

Your metric here

Page 17: Codequalität messen (enterJS 2014)

Source Code

Functions count

Nested depth

Halstead

Maintainability index

LOC

Parameter count

Cyclomatic Complexity nPath

Lint errors

CLOCLLOC

Your metric here

Page 18: Codequalität messen (enterJS 2014)

Cyclomatic Complexity / McCabe

Anzahl von Entscheidungspunkteninnerhalb einer Funktion (if, switch, for,

while, …)

Page 19: Codequalität messen (enterJS 2014)

Cyclomatic Complexity: 4

Page 20: Codequalität messen (enterJS 2014)

nPath Complexity

Anzahl einzigartiger Ausführungspfade innerhalb einer Funktion

Page 21: Codequalität messen (enterJS 2014)

nPath Complexity: 4

Page 22: Codequalität messen (enterJS 2014)

Cyclomatic Complexity === nPath?

Page 23: Codequalität messen (enterJS 2014)

Cyclomatic Complexity: 4

Page 24: Codequalität messen (enterJS 2014)

nPath Complexity: 8

Page 25: Codequalität messen (enterJS 2014)
Page 26: Codequalität messen (enterJS 2014)

escomplex

complexity-report

plato

Esprima

yardstick

jsmeter

Page 27: Codequalität messen (enterJS 2014)

ScanJS

JSHint

jsprime

DoctorJs

JSWhiz

WALA

Page 28: Codequalität messen (enterJS 2014)
Page 29: Codequalität messen (enterJS 2014)

+

Page 30: Codequalität messen (enterJS 2014)
Page 31: Codequalität messen (enterJS 2014)

Sprach-Features

Page 32: Codequalität messen (enterJS 2014)
Page 33: Codequalität messen (enterJS 2014)

JavaScript ist eine dynamische Sprache

Page 34: Codequalität messen (enterJS 2014)
Page 35: Codequalität messen (enterJS 2014)

Referenzwerte / Schwellenwerte + Kontext

Page 36: Codequalität messen (enterJS 2014)
Page 37: Codequalität messen (enterJS 2014)

Referenzwerte / Schwellenwerte

Niedrig Normal Hoch Sehr hoch

Cyclomatic

Complexity1-4 5-7 8-10 >= 11

nPath / / / >= 200

Page 38: Codequalität messen (enterJS 2014)

Java (45 Projekte)

Metrik Niedrig Normal Hoch Sehr hoch

CYCLO/LOC 0.16 0.20 0.24 0.36

LOC/Methode 7 10 13 19.5

NOM/Class 4 7 10 15

C++ (37 Projekte)

Metrik Niedrig Normal Hoch Sehr hoch

CYCLO/LOC 0.20 0.25 0.30 0.45

LOC/Methode 5 10 16 24

NOM/Class 4 9 15 22.5

Page 39: Codequalität messen (enterJS 2014)

Metriken

Page 40: Codequalität messen (enterJS 2014)

Source Code

Functions count

Nested depth

Halstead

Maintainability index

LOC

Parameter count

Cyclomatic ComplexitynPath

Lint errors

CLOCLLOC

Your metric here

Page 41: Codequalität messen (enterJS 2014)
Page 42: Codequalität messen (enterJS 2014)
Page 43: Codequalität messen (enterJS 2014)
Page 44: Codequalität messen (enterJS 2014)

Verwendete Bilder

• „Ruler“ by Scott Akerman: https://www.flickr.com/photos/sterlic/4299631538/

• „the JavaScript Code“ by Dmitry Baranovskiy: https://www.flickr.com/photos/dmitry-baranovskiy/2378867408

• „Ignition“ by Zach Dischner: https://www.flickr.com/photos/zachd1_618/3489625168

• „Tools IMG_0171“ by OZinOH: https://www.flickr.com/photos/75905404@N00/7126146307

Page 45: Codequalität messen (enterJS 2014)

Verwendete Bilder

• „Danger & Skull, Legoland“ by bixentro: https://www.flickr.com/photos/bixentro/338433029

• „Baby“ by The Noun Project: http://thenounproject.com/term/baby/47/

• „Man“ by The Noun Project: http://thenounproject.com/term/man/2/

• „Sasquatch“ by Mike Wirth: http://thenounproject.com/term/sasquatch/2680/

Page 46: Codequalität messen (enterJS 2014)

Verwendete Bilder

• „Waking Up In Abbeyford Woods“ by Miles Wolstenholme: https://www.flickr.com/photos/oaktorphotography/14444806464

• „Danke 102/365“ by Dennis Skley: https://www.flickr.com/photos/dskley/13796815083/

• „Questions“ by Oberazzi: https://www.flickr.com/photos/oberazzi/318947873/in/photostream/

Page 47: Codequalität messen (enterJS 2014)

Zitate und Tabellen

• Helmut Balzert: Lehrbuch der Softwaretechnik. Band 2: Softwaremanagement, Software-Qualitätssicherung, Unternehmensmodellierung, Spektrum Akademischer Verlag, Heidelberg 1998, ISBN 3-8274-0065-1, S. 257

• Michele Lanza, Radu Marinescu: Object-Oriented Metrics in Practice: Using Software Metrics to Characterize, Evaluate, and Improve the Design of Object-Oriented Systems, Springer 2006, ISBN 3540244298


Recommended