reactjs / pt-PT.reactjs.org
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 64 units with 1,394 lines of code in units (21.9% of code).
    • 3 very long units (590 lines of code)
    • 3 long units (210 lines of code)
    • 3 medium size units (102 lines of code)
    • 22 small units (324 lines of code)
    • 33 very small units (168 lines of code)
42% | 15% | 7% | 23% | 12%
Legend:
101+
51-100
21-50
11-20
1-10
Unit Size per Extension
101+
51-100
21-50
11-20
1-10
js42% | 15% | 7% | 23% | 12%
Unit Size per Logical Component
primary logical decomposition
101+
51-100
21-50
11-20
1-10
src/components52% | 17% | 9% | 14% | 5%
src/pages94% | 0% | 0% | 4% | <1%
src/templates0% | 33% | 14% | 32% | 19%
scripts0% | 0% | 0% | 93% | 6%
src0% | 0% | 0% | 56% | 44%
src/utils0% | 0% | 0% | 70% | 29%
ROOT0% | 0% | 0% | 100% | 0%
gatsby0% | 0% | 0% | 52% | 47%
static/js0% | 0% | 0% | 0% | 100%
plugins/gatsby-remark-header-custom-ids0% | 0% | 0% | 0% | 100%
Alternative Visuals
Longest Units
Top 50 longest units
Unit# linesMcCabe index# params
256 2 0
186 5 0
148 5 0
95 8 0
61 2 0
54 3 0
40 3 0
39 2 0
23 2 2
20 6 1
20 1 1
19 2 2
18 3 1
18 1 1
17 1 1
16 2 0
16 4 0
15 3 3
14 3 1
14 2 1
14 3 3
13 3 2
13 1 2
13 3 1
13 4 2
12 2 0
12 1 1
12 1 1
12 1 1
12 1 0
11 5 2
10 1 1
10 3 1
10 3 1
10 3 1
10 1 2
7 3 0
7 2 2
7 1 0
6 2 3
6 1 1
6 1 2
6 1 1
5 1 2
5 2 2
5 2 1
5 2 1
5 1 0
4 1 2
4 2 2