reactjs / react-transition-group
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 67 units with 834 lines of code in units (36.1% of code).
    • 0 very long units (0 lines of code)
    • 2 long units (107 lines of code)
    • 9 medium size units (221 lines of code)
    • 23 small units (350 lines of code)
    • 33 very small units (156 lines of code)
0% | 12% | 26% | 41% | 18%
Legend:
101+
51-100
21-50
11-20
1-10
Unit Size per Extension
101+
51-100
21-50
11-20
1-10
js0% | 12% | 26% | 41% | 18%
Unit Size per Logical Component
primary logical decomposition
101+
51-100
21-50
11-20
1-10
www/src/templates0% | 97% | 0% | 0% | 2%
src0% | 0% | 43% | 40% | 15%
src/utils0% | 0% | 20% | 48% | 30%
stories/transitions0% | 0% | 24% | 46% | 29%
stories0% | 0% | 0% | 79% | 21%
Alternative Visuals
Longest Units
Top 50 longest units
Unit# linesMcCabe index# params
54 4 0
53 20 1
32 3 0
32 10 2
24 7 2
24 7 1
23 4 0
22 4 0
22 6 2
21 1 0
21 8 2
20 2 1
20 2 1
20 2 0
19 1 0
17 1 3
17 1 1
17 6 3
17 6 3
17 4 2
16 7 1
16 6 3
15 1 1
15 6 3
14 2 1
14 4 2
14 7 3
14 1 0
12 5 2
12 6 2
11 2 0
11 4 0
11 1 2
11 4 3
10 4 2
9 1 1
9 1 2
8 1 2
8 1 1
8 1 1
7 7 3
6 3 2
6 2 0
6 1 0
6 2 1
6 7 3
5 1 0
5 1 1
4 1 2
4 2 1