microsoft / charticulator
File Size

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.
Learn more...
File Size Overall
  • There are 322 files with 122,337 lines of code.
    • 16 very long files (63,562 lines of code)
    • 30 long files (20,725 lines of code)
    • 75 medium size files (24,870 lines of codeclsfd_ftr_w_mp_ins)
    • 49 small files (7,140 lines of code)
    • 152 very small files (6,040 lines of code)
51% | 16% | 20% | 5% | 4%
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
html99% | 0% | 0% | 0% | <1%
scss82% | 3% | 9% | 3% | 1%
ts29% | 26% | 30% | 5% | 7%
tsx25% | 24% | 31% | 11% | 6%
css100% | 0% | 0% | 0% | 0%
yml0% | 97% | 0% | 0% | 2%
js0% | 0% | 0% | 100% | 0%
File Size per Logical Decomposition
primary
1001+
501-1000
201-500
101-200
1-100
src/fabric-icons99% | 0% | 0% | 0% | <1%
src/app22% | 26% | 31% | 11% | 7%
src/core24% | 28% | 33% | 5% | 8%
sass/components37% | 14% | 34% | 10% | 2%
src0% | 90% | 0% | 0% | 9%
ROOT0% | 63% | 0% | 35% | 1%
src/container0% | 0% | 99% | 0% | <1%
sass0% | 0% | 69% | 0% | 30%
src/worker0% | 0% | 0% | 75% | 24%
sass/common0% | 0% | 0% | 51% | 48%
public0% | 0% | 0% | 0% | 100%
public_test0% | 0% | 0% | 0% | 100%
sass/editor0% | 0% | 0% | 0% | 100%
Longest Files (Top 50)
File# lines# units
fabric-icons.html
in src/fabric-icons
 24927 -
fabric-icons.scss
in src/fabric-icons/scss
 13585 -
fabric-icons.tsx
in src/fabric-icons/src
 2869 -
base.ts
in src/core/prototypes/plot_segments/region_2d
 2782 49
fabric-icons.css
in src/fabric-icons/css
 2275 -
IconNames.ts
in src/fabric-icons/src
 2266 -
axis.ts
in src/core/prototypes/plot_segments
 2201 43
app_store.ts
in src/app/stores
 2027 57
fluentui_manager.tsx
in src/app/views/panels/widgets
 1671 46
attribute_editor.scss
in sass/components/canvas
 1603 -
mark_editor.tsx
in src/app/views/canvas
 1594 31
chart_editor.tsx
in src/app/views/canvas
 1435 26
palettes.ts
in src/app/resources
 1178 4
state.ts
in src/core/prototypes
 1081 58
index.ts
in src/core/prototypes/links
 1061 17
fluent_mapping_editor.tsx
in src/app/views/panels/widgets
 1007 24
fluentui_tool_bar.tsx
in src/app/views
 957 10
textbox.ts
in src/core/prototypes/marks
 909 11
tool_bar.tsx
in src/app/views
 901 27
cartesian.ts
in src/core/prototypes/plot_segments/region_2d
 889 16
polar.ts
in src/core/prototypes/plot_segments/region_2d
 878 15
migrator.ts
in src/app/stores
 867 45
data_field_binding_builder.tsx
in src/app/views/dataset
 856 31
actions.ts
in src/app/actions
 842 114
solver.ts
in src/core/solver
 828 34
export_view.tsx
in src/app/views/file_view
 790 15
rect.ts
in src/core/prototypes/marks
 751 15
image.ts
in src/core/prototypes/marks
 745 11
menubar.tsx
in src/app/views
 728 15
link_creator.tsx
in src/app/views/panels
 718 12
categorical.ts
in src/core/prototypes/scales
 689 26
canvas.scss
in sass/components/canvas
 640 -
index.tsx
in src/app/renderer
 616 9
import_data_view.tsx
in src/app/views/file_view
 593 15
index.ts
in src/app/template
 586 10
strings.ts
in src
 581 -
utils.ts
in src/core/common
 573 57
THIRD_PARTY.yml
in root
 558 -
dataset_view.tsx
in src/app/views/dataset
 554 10
polar_coordinator.ts
in src/core/prototypes/guides
 544 11
index.ts
in src/core/prototypes/charts
 536 12
nested_chart.ts
in src/core/prototypes/marks
 534 18
curve.ts
in src/core/prototypes/plot_segments/region_2d
 530 13
creating_component.tsx
in src/app/views/canvas
 525 18
gap_ratio.tsx
in src/app/views/canvas/handles
 505 5
color_space_picker.tsx
in src/app/components
 502 22
popup_controller.tsx
in src/app/controllers
 494 18
editing_link.tsx
in src/app/views/canvas
 489 7
buttons.scss
in sass/components
 478 -
fluentui_image_2.tsx
in src/app/views/panels/widgets/controls
 459 10
Files With Most Units (Top 20)
File# lines# units
actions.ts
in src/app/actions
 842 114
state.ts
in src/core/prototypes
 1081 58
app_store.ts
in src/app/stores
 2027 57
utils.ts
in src/core/common
 573 57
base.ts
in src/core/prototypes/plot_segments/region_2d
 2782 49
fluentui_manager.tsx
in src/app/views/panels/widgets
 1671 46
classes.ts
in src/core/expression
 394 46
migrator.ts
in src/app/stores
 867 45
axis.ts
in src/core/prototypes/plot_segments
 2201 43
solver.ts
in src/core/solver
 828 34
mark_editor.tsx
in src/app/views/canvas
 1594 31
data_field_binding_builder.tsx
in src/app/views/dataset
 856 31
color.ts
in src/core/common
 384 31
coordinate_system.ts
in src/core/graphics
 352 28
tool_bar.tsx
in src/app/views
 901 27
chart_editor.tsx
in src/app/views/canvas
 1435 26
categorical.ts
in src/core/prototypes/scales
 689 26
container.tsx
in src/container
 349 25
bezier_curve.ts
in src/core/graphics
 248 25
fluent_mapping_editor.tsx
in src/app/views/panels/widgets
 1007 24
Files With Long Lines (Top 14)

There are 14 files with lines longer than 120 characters. In total, there are 88 long lines.

File# lines# units# long lines
fabric-icons.tsx
in src/fabric-icons/src
 2869 - 62
THIRD_PARTY.yml
in root
 558 - 5
mark_editor.tsx
in src/app/views/canvas
 1594 31 5
build.js
in root
 198 10 3
config.template.yml
in root
 13 - 2
editing_link.tsx
in src/app/views/canvas
 489 7 2
datetime.ts
in src/core/dataset
 207 3 2
color_picker.scss
in sass/components
 330 - 1
zoomable.tsx
in src/app/components
 72 7 1
chart_editor.tsx
in src/app/views/canvas
 1435 26 1
angle.tsx
in src/app/views/canvas/handles
 212 5 1
text_alignment.tsx
in src/app/views/canvas/handles
 386 8 1
elements.ts
in src/core/graphics
 363 19 1
image.ts
in src/core/prototypes/marks
 745 11 1