1. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Ανάπτυξη διαδικτυακής εφαρμογής για τη
στατική ανάλυση αποθετηρίων κώδικα
Κωνσταντίνος Σιδέρης
Αριστοτέλειο Πανεπιστήμιο Θεσσαλονίκης
Πολυτεχνική Σχολή
Τμήμα Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
Εργαστήριο Επεξεργασίας Πληροφορίας και Υπολογισμών
Ιούλιος 2016

2. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Στατική Ανάλυση Κώδικα (1/3)
Είναι η ανάλυση κώδικα που γίνεται χωρίς την εκτέλεση του
προγράμματος, συνήθως με την βοήθεια αυτόματων
εργαλείων που εξετάζουν τον πηγαίο κώδικα.
def foo ( a , b ) :
while b ! = 0:
i f a > b :
a = a − b
else :
b = b − a
return a

3. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Στατική Ανάλυση Κώδικα (2/3)

4. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Στατική Ανάλυση Κώδικα (3/3)
• Μέτρηση της πολυπλοκότητας.
• Αποφυγή λαθών και σφαλμάτων.
• Συντακτικά
• Σημασιολογικά
• Λανθασμένες πρακτικές
• Βελτίωση και διατήρησης της ποιότητας του λογισμικού.

5. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
JavaScript & npm (1/3)
• Η γλώσσα του διαδικτύου.
• Δυναμική με αδύναμο type system και πολλές
ιδιαιτερότητες.
[ ] + [ ] = ' '
• Μεγάλη απήχηση και χρήση εκτός browser (Node.js).
• Διαθέτει το μεγαλύτερο αποθετήριο πακέτων λογισμικού
(250.000).

6. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
JavaScript & npm (2/3)

7. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
JavaScript & npm (3/3)
{
"name " : "npm" ,
" version " : " 3 . 9 . 6 " ,
" description " : "a package manager for JavaScript " ,
" keywords " : [
" i n s t a l l " ,
"modules " ,
" package manager " ,
" package . json "
] ,
"homepage " : " https :// docs . npmjs . com/" ,
" author " : " Isaac Z . Schlueter <i@izs .me> ( http :// blog . i z s .me) " ,
" repository " : {
" type " : " g i t " ,
" url " : " https :// github .com/npm/npm"
} ,
" dependencies " : {
" abbrev " : " ~ 1 . 0 . 7 " ,
" ansicolors " : " ~ 0 . 3 . 2 " ,
" columnify " : " ~ 1 . 5 . 4 " ,
. . .
} ,
" devDependencies " : {
"deep−equal " : " ~ 1 . 0 . 1 " ,
"marked " : " ~ 0 . 3 . 5 " ,
"npm−registry−couchapp " : " ~ 2 . 6 . 1 2 " ,
. . .
} ,
" license " : " A r t i s t i c −2.0"
}

8. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Στόχοι
• Χρήση τεχνικών στατικής ανάλυσης στα πακέτα του npm.
• Παρουσίαση των αποτελεσμάτων μέσα από μια
διαδικτυακή εφαρμογή.
• Αναζήτηση
• Σύγκριση
• Οπτικοποίηση
• Εξαγωγή συμπερασμάτων για τη κοινότητα του npm.

9. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αρχιτεκτονική (1/2)
• Web server
• Βάσεις δεδομένων
• Κώδικας
• Στατική ανάλυση
• Αναπαράσταση γράφου εξαρτήσεων
• Υπηρεσίες στατική ανάλυσης

10. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αρχιτεκτονική (2/2)

11. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Υπηρεσίες Στατικής Ανάλυσης (1/4)

12. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Υπηρεσίες Στατικής Ανάλυσης (2/4)
escomplex
Παράγει μετρικές πολυπλοκότητας.
• Cyclomatic complexity: Μετρά όλες τις πιθανές ξεχωριστές
διαδρομές που μπορούν να ακολουθηθούν κατά την
εκτέλεση του προγράμματος.
• Halstead Volume: Μετρά τον όγκος της πληροφορίας που
περιέχεται στο κώδικα. Πιο συγκεκριμένα ερευνά πόσες
μεταβλητές χρησιμοποιούνται και πόσο συχνά.
• Maintainability: Διατυπώνει μια εκτίμηση για το επίπεδο
συντηρησιμότητας τού προγράμματος.
• Change cost: Το ποσοστό των modules που επηρεάζονται
κατα μέσο όρο όταν αλλάζει ένα module.

13. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Υπηρεσίες Στατικής Ανάλυσης (3/4)
eslint
Ανιχνεύει συντακτικά και σημασιολογικά λάθη, καθώς και
λανθασμένες πρακτικές.
• Χρήση του τελεστή === αντί του τελεστή ==.
[ ] == false
[ ] == ! [ ]
3 == "03"
• Εμφάνιση προειδοποίησης για την ύπαρξη μη
εκτελέσιμου κώδικα.
function fn ( ) {
x = 1 ;
return x ;
x = 3 ;
}

14. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Υπηρεσίες Στατικής Ανάλυσης (4/4)
jsinspect
Ανιχνεύει κομμάτια κώδικα που παρουσιάζουν την ίδια ή
παρόμοια δομή και λειτουργία.
def findAManager :
for each employee in employees :
i f employee . isManager :
return employee
return n i l
def findASupervisor :
for each employee in employees :
i f employee . isSupervisor :
return employee
return n i l

15. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αποτελέσματα (1/6)
• Λιγότερο από το 15% των πακέτων χρησιμοποιείται από
άλλα και μόλις 2% των πακέτων έχει in degree μεγαλύτερο
του 100.
• Κυριαρχεί η τάση για δημιουργία μικρών πακέτων.
• Συνήθως τα πακέτα περιέχουν λιγότερο από 5
συναρτήσεις. Το 53% των πακέτων αποτελούνται από
λιγότερες από 100 γραμμές κώδικα.
• Σχεδόν το 40% των πακέτων δεν έχει ανανεωθεί τον
τελευταίο χρόνο.
• Τα πακέτα τα οποία χρησιμοποιούνται περιορίζονται στα
1.000 με 2.500.
• Τα περισσότερα πακέτα αποτελούν βοηθητικά εργαλεία
σχετικά με τη συγγραφή λογισμικού.

16. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αποτελέσματα (2/6)

17. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αποτελέσματα (3/6)

18. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αποτελέσματα (4/6)

19. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αποτελέσματα (5/6)
Type Percentage
Development dependency 60.79%
Dependency 39.21%
Keyword Value
test 237
gruntplugin 192
css 178
gulpplugin 152
string 151
browser 147
cli 141
file 140
stream 138
testing 129

20. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Αποτελέσματα (6/6)

21. .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Demo