microsoft / charticulator.com
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 48 units with 548 lines of code in units (15.7% of code).
    • 0 very long units (0 lines of code)
    • 2 long units (110 lines of code)
    • 3 medium size units (112 lines of code)
    • 9 small units (132 lines of code)
    • 34 very small units (194 lines of code)
0% | 20% | 20% | 24% | 35%
Legend:
101+
51-100
21-50
11-20
1-10
Unit Size per Extension
101+
51-100
21-50
11-20
1-10
tsx0% | 29% | 20% | 20% | 30%
js0% | 0% | 34% | 26% | 38%
rb0% | 0% | 0% | 51% | 48%
ts0% | 0% | 0% | 0% | 100%
Unit Size per Logical Component
primary logical decomposition
101+
51-100
21-50
11-20
1-10
tutorials/viewer/src0% | 28% | 19% | 19% | 32%
scripts0% | 0% | 56% | 0% | 43%
_plugins0% | 0% | 0% | 51% | 48%
tutorials/viewer0% | 0% | 0% | 69% | 30%
Alternative Visuals
Longest Units
Top 20 longest units
Unit# linesMcCabe index# params
public render()
in tutorials/viewer/src/tutorial_view.tsx
 56 3 0
public render()
in tutorials/viewer/src/video_view.tsx
 54 6 0
public componentDidMount()
in tutorials/viewer/src/video_view.tsx
 47 6 0
function displayVideoCallout()
in scripts/video-callout.js
 36 2 3
public onKeyDownHandler()
in tutorials/viewer/src/video_view.tsx
 29 10 1
public renderTimeAxis()
in tutorials/viewer/src/video_view.tsx
 19 2 0
thumbnail_image
in _plugins/plugins.rb
 17 4 2
public renderTimeAxis()
in tutorials/viewer/src/tutorial_view.tsx
 17 2 2
public onTimestampUpdated()
in tutorials/viewer/src/tutorial_view.tsx
 16 7 2
function mainFunction()
in tutorials/viewer/build_utils.js
 15 2 1
public scrollItemIntoView()
in tutorials/viewer/src/tutorial_view.tsx
 13 3 1
stable_sort
in _plugins/plugins.rb
 12 3 2
commands.makedirs = function()
in tutorials/viewer/build_utils.js
 12 1 0
public componentDidMount()
in tutorials/viewer/src/index.tsx
 11 1 0
public getAnchorPoint()
in tutorials/viewer/src/tutorial_view.tsx
 10 2 0
constructor()
in tutorials/viewer/src/video_view.tsx
 10 1 1
commands.bundle = function()
in tutorials/viewer/build_utils.js
 9 1 0
public getCaptionAtTimestamp()
in tutorials/viewer/src/tutorial_view.tsx
 9 4 1
function formatTimestamp()
in tutorials/viewer/src/video_view.tsx
 9 1 1
relativize_url
in _plugins/plugins.rb
 8 2 1