Where to start refactoring?

Agenda1. Identify biggest files

2. Identify most complex files

3. Identify most changed files

4. Crossing our findings

$ git clone https://github.com/jquery/jquery.git

$ cd jquery

$ git checkout 3.1.0

Biggest files

$ find src -type f | xargs wc -l | sort | tail

$ 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

$ brew install cloc

$ find src -type f | xargs cloc —by-file | head -n 20

$ 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 …

Most complex files

$ npm install -g jscomplexity

$ cd src

$ jscomplexity

$ 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 …

Most changed files

$ git log --pretty=format: --name-only -- src |\ sort | uniq -c | sort -rg | head

$ 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

$ git log --pretty=format: --name-only \ --after="1 year ago" -- src | sort | uniq -c |\ sort -rg | head

$ 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

$ shopt -s globstar # if you are on bash (4+)

$ git effort --above 8 src/**/*.js -- --after="1 year ago"

$ 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

Crossing our findings

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

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

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

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

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

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

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

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

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

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

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

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

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

Thank you ;D@thiagoalessio

github.com/thiagoalessio