The distribution of size of files (measured in lines of code).
Intro
- File size measurements show the distribution of size of files.
- Files are classified in four categories based on their size (lines of code): 1-100 (very small files), 101-200 (small files), 201-500 (medium size files), 501-1000 (long files), 1001+(very long files).
- It is a good practice to keep files small. Long files may become "bloaters", code that have increased to such gargantuan proportions that they are hard to work with.
File Size Overall
- There are 196 files with 7,588 lines of code.
- 0 very long files (0 lines of code)
- 0 long files (0 lines of code)
- 2 medium size files (551 lines of codeclsfd_ftr_w_mp_ins)
- 19 small files (2,644 lines of code)
- 175 very small files (4,393 lines of code)
Legend:
1001+
501-1000
201-500
101-200
1-100
explore: zoomable circles | sunburst | 3D view
File Size per Extension
1001+
501-1000
201-500
101-200
1-100
File Size per Logical Decomposition
primary
Longest Files (Top 50)
| File | # lines | # units |
|---|---|---|
 details-list.component.ts in libs/fabric/src/lib/components/details-list |
322 | 19 |
renderer.ts in libs/core/src/lib/renderer |
229 | 3 |
react-node.ts in libs/core/src/lib/renderer |
190 | 23 |
command-bar.component.ts in libs/fabric/src/lib/components/command-bar |
187 | 9 |
wrapper-component.ts in libs/core/src/lib/components |
182 | 14 |
base-button.component.ts in libs/fabric/src/lib/components/button |
174 | 8 |
persona.component.ts in libs/fabric/src/lib/components/persona |
165 | 5 |
dropdown.component.ts in libs/fabric/src/lib/components/dropdown |
155 | 6 |
search-box.component.ts in libs/fabric/src/lib/components/search-box |
150 | 8 |
dialog.component.ts in libs/fabric/src/lib/components/dialog |
141 | 4 |
hover-card.component.ts in libs/fabric/src/lib/components/hover-card |
139 | 6 |
panel.component.ts in libs/fabric/src/lib/components/panel |
135 | 3 |
contextual-menu-item.directive.ts in libs/fabric/src/lib/components/contextual-menu/directives |
133 | 6 |
base-picker.component.ts in libs/fabric/src/lib/components/pickers/base-picker |
126 | 10 |
pivot.component.ts in libs/fabric/src/lib/components/pivot |
115 | 4 |
calendar.component.ts in libs/fabric/src/lib/components/calendar |
114 | 5 |
date-picker.component.ts in libs/fabric/src/lib/components/date-picker |
114 | 2 |
base-combo-box.component.ts in libs/fabric/src/lib/components/combo-box |
111 | 8 |
focus-trap-callout.component.ts in libs/fabric/src/lib/components/callout |
107 | 1 |
callout.component.ts in libs/fabric/src/lib/components/callout |
103 | 1 |
base-text-field.component.ts in libs/fabric/src/lib/components/text-field |
103 | 8 |
spin-button.component.ts in libs/fabric/src/lib/components/spin-button |
99 | 1 |
shimmer.component.ts in libs/fabric/src/lib/components/shimmer |
97 | 4 |
render-props.ts in libs/core/src/lib/components |
93 | 4 |
grouped-list.component.ts in libs/fabric/src/lib/components/grouped-list |
93 | 3 |
tooltip-host.component.ts in libs/fabric/src/lib/components/tooltip |
87 | 5 |
checkbox.component.ts in libs/fabric/src/lib/components/checkbox |
85 | 3 |
modal.component.ts in libs/fabric/src/lib/components/modal |
85 | 2 |
expanding-card.component.ts in libs/fabric/src/lib/components/hover-card |
78 | 2 |
slider.component.ts in libs/fabric/src/lib/components/slider |
78 | 2 |
link.component.ts in libs/fabric/src/lib/components/link |
76 | 1 |
progress-indicator.component.ts in libs/fabric/src/lib/components/progress-indicator |
76 | 6 |
text-field.component.ts in libs/fabric/src/lib/components/text-field |
72 | 1 |
Disguise.ts in libs/core/src/lib/renderer/components |
71 | 4 |
nav.component.ts in libs/fabric/src/lib/components/nav |
71 | 1 |
masked-text-field.component.ts in libs/fabric/src/lib/components/text-field |
71 | 1 |
action-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
command-bar-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
compound-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
default-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
icon-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
messagebar-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
primary-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
split-button.component.ts in libs/fabric/src/lib/components/button |
70 | 1 |
message-bar.component.ts in libs/fabric/src/lib/components/message-bar |
70 | 3 |
image.component.ts in libs/fabric/src/lib/components/image |
68 | 1 |
choice-group.component.ts in libs/fabric/src/lib/components/choice-group |
67 | 3 |
plain-card.component.ts in libs/fabric/src/lib/components/hover-card |
65 | 2 |
toggle.component.ts in libs/fabric/src/lib/components/toggle |
65 | 2 |
details-list-column.directive.ts in libs/fabric/src/lib/components/details-list/directives |
64 | 1 |
Files With Most Units (Top 20)
| File | # lines | # units |
|---|---|---|
react-node.ts in libs/core/src/lib/renderer |
190 | 23 |
details-list.component.ts in libs/fabric/src/lib/components/details-list |
322 | 19 |
wrapper-component.ts in libs/core/src/lib/components |
182 | 14 |
base-picker.component.ts in libs/fabric/src/lib/components/pickers/base-picker |
126 | 10 |
command-bar.component.ts in libs/fabric/src/lib/components/command-bar |
187 | 9 |
base-button.component.ts in libs/fabric/src/lib/components/button |
174 | 8 |
base-combo-box.component.ts in libs/fabric/src/lib/components/combo-box |
111 | 8 |
search-box.component.ts in libs/fabric/src/lib/components/search-box |
150 | 8 |
base-text-field.component.ts in libs/fabric/src/lib/components/text-field |
103 | 8 |
contextual-menu-item.directive.ts in libs/fabric/src/lib/components/contextual-menu/directives |
133 | 6 |
dropdown.component.ts in libs/fabric/src/lib/components/dropdown |
155 | 6 |
hover-card.component.ts in libs/fabric/src/lib/components/hover-card |
139 | 6 |
progress-indicator.component.ts in libs/fabric/src/lib/components/progress-indicator |
76 | 6 |
react-template.ts in libs/core/src/lib/renderer |
62 | 5 |
renderprop-helpers.ts in libs/core/src/lib/renderer |
52 | 5 |
calendar.component.ts in libs/fabric/src/lib/components/calendar |
114 | 5 |
changeable-helper.ts in libs/fabric/src/lib/components/core/shared |
59 | 5 |
persona.component.ts in libs/fabric/src/lib/components/persona |
165 | 5 |
tooltip-host.component.ts in libs/fabric/src/lib/components/tooltip |
87 | 5 |
render-props.ts in libs/core/src/lib/components |
93 | 4 |
Files With Long Lines (Top 12)
There are 12 files with lines longer than 120 characters. In total, there are 15 long lines.
| File | # lines | # units | # long lines |
|---|---|---|---|
contextual-menu-item.directive.ts in libs/fabric/src/lib/components/contextual-menu/directives |
133 | 6 | 3 |
details-list-column.directive.ts in libs/fabric/src/lib/components/details-list/directives |
64 | 1 | 2 |
calendar.component.ts in libs/fabric/src/lib/components/calendar |
114 | 5 | 1 |
base-combo-box.component.ts in libs/fabric/src/lib/components/combo-box |
111 | 8 | 1 |
command-bar.component.ts in libs/fabric/src/lib/components/command-bar |
187 | 9 | 1 |
command-bar-item.directives.ts in libs/fabric/src/lib/components/command-bar/directives |
29 | 1 | 1 |
dropdown.component.ts in libs/fabric/src/lib/components/dropdown |
155 | 6 | 1 |
people-picker.module.ts in libs/fabric/src/lib/components/pickers/people-picker |
21 | 1 | 1 |
pivot.component.ts in libs/fabric/src/lib/components/pivot |
115 | 4 | 1 |
progress-indicator.component.ts in libs/fabric/src/lib/components/progress-indicator |
76 | 6 | 1 |
shimmer.component.ts in libs/fabric/src/lib/components/shimmer |
97 | 4 | 1 |
base-text-field.component.ts in libs/fabric/src/lib/components/text-field |
103 | 8 | 1 |