microsoft / satcheljs-todomvc
Conditional Complexity

The distribution of complexity of units (measured with McCabe index).

Intro
  • Conditional complexity (also called cyclomatic complexity) is a term used to measure the complexity of software. The term refers to the number of possible paths through a program function. A higher value ofter means higher maintenance and testing costs (infosecinstitute.com).
  • Conditional complexity is calculated by counting all conditions in the program that can affect the execution path (e.g. if statement, loops, switches, and/or operators, try and catch blocks...).
  • Conditional complexity is measured at the unit level (methods, functions...).
  • Units are classified in four categories based on the measured McCabe index: 1-5 (simple units), 6-10 (medium complex units), 11-25 (complex units), 26+ (very complex units).
Learn more...
Conditional Complexity Overall
  • There are 20 units with 126 lines of code in units (31.4% of code).
    • 0 very complex units (0 lines of code)
    • 0 complex units (0 lines of code)
    • 0 medium complex units (0 lines of code)
    • 0 simple units (0 lines of code)
    • 20 very simple units (126 lines of code)
0% | 0% | 0% | 0% | 100%
Legend:
51+
26-50
11-25
6-10
1-5
Alternative Visuals
Conditional Complexity per Extension
51+
26-50
11-25
6-10
1-5
ts0% | 0% | 0% | 0% | 100%
tsx0% | 0% | 0% | 0% | 100%
Conditional Complexity per Logical Component
primary logical decomposition
51+
26-50
11-25
6-10
1-5
src/actions0% | 0% | 0% | 0% | 100%
src/components0% | 0% | 0% | 0% | 100%
src/components/footer0% | 0% | 0% | 0% | 100%
Most Complex Units
Top 20 most complex units
Unit# linesMcCabe index# params
function removeAllCompleted()
in src/actions/removeAllCompleted.ts
17 4 0
function toggleAllCompleted()
in src/actions/toggleAllCompleted.ts
7 4 0
function removeItem()
in src/actions/removeItem.ts
14 3 1
function toggleEditItem()
in src/actions/toggleEditItem.ts
9 3 1
function toggleCompleted()
in src/actions/toggleCompleted.ts
5 2 1
function updateItem()
in src/actions/updateItem.ts
7 2 2
componentDidUpdate()
in src/components/Main.tsx
6 2 0
function FilterButton()
in src/components/footer/FilterButton.tsx
13 2 1
function guid()
in src/actions/addItem.ts
3 1 0
function s4()
in src/actions/addItem.ts
3 1 0
function addItem()
in src/actions/addItem.ts
9 1 1
function setFilter()
in src/actions/setFilter.ts
3 1 1
function updateEditItemValue()
in src/actions/updateEditItemValue.ts
3 1 1
function updateTextboxValue()
in src/actions/updateTextboxValue.ts
3 1 1
export default function App()
in src/components/App.tsx
9 1 0
onToggleCompleted()
in src/components/Main.tsx
3 1 1
onDestroy()
in src/components/Main.tsx
3 1 1
onToggleAllCompleted()
in src/components/Main.tsx
3 1 0
export default reactive()
in src/components/footer/FilterButton.tsx
3 1 1
export default reactive()
in src/components/footer/ItemsLeftCount.tsx
3 1 1