Where to start refactoring?
โข
2 likesโข427 views
My talk at Berlin Beautiful Code Meetup (11.Jul.2016) Video: https://youtu.be/HyE-LbP1Ob0
More Related Content
What's hot
Where to start refactoring?
- 2. Agenda 1. Identify biggest files 2. Identify most complex files 3. Identify most changed files 4. Crossing our findings
- 4. $ git clone https://github.com/jquery/jquery.git $ cd jquery $ git checkout 3.1.0
- 6. $ find src -type f | xargs wc -l | sort | tail
- 7. $ find src -type f | xargs wc -l | sort | tail 234 src/callbacks.js 237 src/selector-native.js 389 src/deferred.js 424 src/css.js 481 src/core.js 486 src/manipulation.js 688 src/effects.js 726 src/event.js 855 src/ajax.js 9026 total
- 9. $ brew install cloc $ find src -type f | xargs cloc โby-file | head -n 20
- 10. $ find src -type f | xargs cloc โby-file | head -n 20 โฆ omitted output โฆ File blank comment code ----------------------------------------------------------------------------------------- src/effects.js 101 56 531 src/ajax.js 168 179 508 src/event.js 125 94 507 src/manipulation.js 93 44 349 src/core.js 104 78 299 src/css.js 81 65 278 src/deferred.js 66 86 237 src/selector-native.js 38 47 152 src/offset.js 42 38 152 โฆ omitted output โฆ
- 16. $ npmย installย -gย jscomplexity $ cd src $ jscomplexity
- 17. $ jscomplexity โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโฌโโโโโโโโโโโโโโโโโโโโโ โ File โ Complexity โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ โ ./selector-native.js โ 44 โ โ ./event/trigger.js โ 38 โ โฆ omitted output โฆ
- 19. $ git log --pretty=format: --name-only -- src |โจ sort | uniq -c | sort -rg | head
- 20. $ git log --pretty=format: --name-only -- src | sort | uniq -c |โจ sort -rg | head 4115 601 src/core.js 560 src/event.js 379 src/ajax.js 346 src/manipulation.js 343 src/jquery/jquery.js 239 src/attributes.js 236 src/css.js 222 src/sizzle 201 src/effects.js
- 21. $ git log --pretty=format: --name-only โจ --after="1 year ago" -- src | sort | uniq -c |โจ sort -rg | head
- 22. $ git log --pretty=format: --name-only --after="1 year ago" -- src | sort |โจ uniq -c | sort -rg | head 137 22 src/event.js 17 src/core.js 14 src/ajax.js 13 src/manipulation.js 11 src/deferred.js 11 src/css.js 10 src/css/showHide.js 9 src/offset.js 9 src/effects.js
- 24. $ shopt -s globstar # if you are on bash (4+) $ git effort --above 8 src/**/*.js -- --after="1 year ago"
- 25. $ git effort --above 8 src/**/*.js -- --after="1 year agoโ path commits active days src/event.js................................. 22 21 src/core.js.................................. 17 16 src/ajax.js.................................. 14 14 src/manipulation.js.......................... 13 11 src/deferred.js.............................. 11 11 src/css.js................................... 11 11 src/css/showHide.js.......................... 10 10 src/offset.js................................ 9 8 src/effects.js............................... 9 8
- 27. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 28. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 29. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 30. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 31. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 32. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 33. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 34. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 35. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 36. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 37. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 38. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed
- 39. File code --------------------------- src/effects.js 531 src/ajax.js 508 src/event.js 507 src/manipulation.js 349 src/core.js 299 src/css.js 278 โ File โ Cmp โ โโโโโโโโโโโโโโโโโโโโโผโโโโโโค โ ./ajax.js โ 123 โ โ ./event.js โ 120 โ โ ./effects.js โ 108 โ โ ./manipulation.js โ 77 โ โ ./css.js โ 73 โ โ ./core.js โ 54 โ path commits src/event.js............ 22 src/core.js............. 17 src/ajax.js............. 14 src/manipulation.js..... 13 src/deferred.js......... 11 src/css.js.............. 11 src/css/showHide.js..... 10 src/offset.js........... 9 src/effects.js.......... 9 Biggest Most complex Most changed