reactjs / react-tabs
Unit Size

The distribution of size of units (measured in lines of code).

Intro
  • Unit size measurements show the distribution of size of units of code (methods, functions...).
  • Units are classified in four categories based on their size (lines of code): 1-20 (small units), 20-50 (medium size units), 51-100 (long units), 101+ (very long units).
  • You should aim at keeping units small (< 20 lines). Long units may become "bloaters", code that have increased to such gargantuan proportions that they are hard to work with.
Learn more...
Unit Size Overall
  • There are 36 units with 516 lines of code in units (35.0% of code).
    • 0 very long units (0 lines of code)
    • 1 long units (54 lines of code)
    • 6 medium size units (200 lines of code)
    • 12 small units (190 lines of code)
    • 17 very small units (72 lines of code)
0% | 10% | 38% | 36% | 13%
Legend:
101+
51-100
21-50
11-20
1-10
Unit Size per Extension
101+
51-100
21-50
11-20
1-10
js0% | 10% | 38% | 36% | 13%
Unit Size per Logical Component
primary logical decomposition
101+
51-100
21-50
11-20
1-10
src/components0% | 23% | 21% | 38% | 16%
src/helpers0% | 0% | 64% | 22% | 12%
old_examples/conditional0% | 0% | 78% | 0% | 21%
old_examples/focus0% | 0% | 85% | 0% | 14%
old_examples/dyno0% | 0% | 0% | 100% | 0%
old_examples/basic0% | 0% | 0% | 95% | 5%
old_examples/tab_enabled0% | 0% | 0% | 95% | 5%
Alternative Visuals
Longest Units
Top 36 longest units
Unit# linesMcCabe index# params
54 13 0
50 16 1
45 12 3
30 7 0
27 6 5
25 6 5
23 1 0
19 1 1
19 1 1
19 5 2
19 6 2
16 1 0
16 4 1
15 5 1
15 8 2
14 5 1
13 1 1
13 6 1
12 5 1
9 3 0
9 3 0
8 1 1
7 2 1
5 2 2
4 1 1
4 1 0
3 2 1
3 2 1
3 2 1
3 1 1
3 2 1
3 1 0
3 1 0
3 3 1
1 2 1
1 2 1