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 208 files with 7,818 lines of code.
- 0 very long files (0 lines of code)
- 0 long files (0 lines of code)
- 4 medium size files (997 lines of codeclsfd_ftr_w_mp_ins)
- 14 small files (1,779 lines of code)
- 190 very small files (5,042 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 |
|---|---|---|
 styles.scss in projects/apps/demo-app/src |
276 | - |
 media-marshaller.ts in projects/libs/flex-layout/core/media-marshaller |
252 | 11 |
layout-gap.ts in projects/libs/flex-layout/flex/layout-gap |
240 | 15 |
flex.ts in projects/libs/flex-layout/flex/flex |
229 | 8 |
custom-matchers.ts in projects/libs/flex-layout/_private-utils/testing |
192 | 23 |
print-hook.ts in projects/libs/flex-layout/core/media-marshaller |
167 | 12 |
layout-align.ts in projects/libs/flex-layout/flex/layout-align |
154 | 3 |
show-hide.ts in projects/libs/flex-layout/extended/show-hide |
137 | 6 |
match-media.ts in projects/libs/flex-layout/core/match-media |
127 | 8 |
style-utils.ts in projects/libs/flex-layout/core/style-utils |
123 | 6 |
media-trigger.ts in projects/libs/flex-layout/core/media-trigger |
119 | 12 |
style.ts in projects/libs/flex-layout/extended/style |
114 | 5 |
build-bundles.ts in tools/package-tools |
111 | 12 |
base2.ts in projects/libs/flex-layout/core/base |
110 | 15 |
align-columns.ts in projects/libs/flex-layout/grid/align-columns |
109 | 3 |
media-observer.ts in projects/libs/flex-layout/core/media-observer |
107 | 5 |
server-provider.ts in projects/libs/flex-layout/server |
106 | 5 |
server-match-media.ts in projects/libs/flex-layout/server |
103 | 10 |
align-rows.ts in projects/libs/flex-layout/grid/align-rows |
91 | 3 |
flex-offset.ts in projects/libs/flex-layout/flex/flex-offset |
89 | 3 |
dom-tools.ts in projects/libs/flex-layout/_private-utils/testing |
83 | 17 |
grid-align.ts in projects/libs/flex-layout/grid/grid-align |
83 | 2 |
break-points.ts in projects/libs/flex-layout/core/breakpoints/data |
75 | - |
issue-266.component.scss in projects/apps/demo-app/src/app/github-issues/issue-266 |
71 | - |
 responsive-style.component.html in projects/apps/demo-app/src/app/responsive/responsive-style |
71 | - |
app.component.scss in projects/apps/universal-demo-app/src/app |
71 | - |
columns.ts in projects/libs/flex-layout/grid/columns |
70 | 2 |
rows.ts in projects/libs/flex-layout/grid/rows |
70 | 2 |
validateDecoratorsRule.ts in tools/tslint-rules |
68 | 5 |
layout-gap.component.ts in projects/apps/demo-app/src/app/layout/layout-gap |
67 | 1 |
layout-alignment.component.html in projects/apps/demo-app/src/app/layout/layout-alignment |
66 | - |
auto.ts in projects/libs/flex-layout/grid/auto |
64 | 2 |
layout.ts in projects/libs/flex-layout/flex/layout |
64 | 2 |
img-src.ts in projects/libs/flex-layout/extended/img-src |
63 | 3 |
areas.ts in projects/libs/flex-layout/grid/areas |
61 | 2 |
split.directive.ts in projects/apps/universal-demo-app/src/app/split |
60 | 2 |
style-transforms.ts in projects/libs/flex-layout/extended/style |
60 | 7 |
gap.ts in projects/libs/flex-layout/grid/gap |
59 | 2 |
hide-with-custom-bp.component.ts in projects/apps/demo-app/src/app/stack-overflow/hide-custom-bp |
58 | - |
class.ts in projects/libs/flex-layout/extended/class |
57 | 3 |
flex-align.ts in projects/libs/flex-layout/flex/flex-align |
56 | 1 |
issue-266.component.html in projects/apps/demo-app/src/app/github-issues/issue-266 |
52 | - |
grid-position.component.ts in projects/apps/demo-app/src/app/grid/grid-position |
52 | - |
split.directive.ts in projects/apps/demo-app/src/app/github-issues/split |
51 | 1 |
watermark.component.ts in projects/apps/demo-app/src/app |
51 | 2 |
_layout-bp.scss in projects/libs/flex-layout/core/sass |
50 | - |
layout-validator.ts in projects/libs/flex-layout/_private-utils |
50 | 5 |
grid-column-span.component.html in projects/apps/demo-app/src/app/stack-overflow/grid-column-span |
47 | - |
responsive.module.ts in projects/apps/demo-app/src/app/responsive |
44 | - |
layout.module.ts in projects/apps/demo-app/src/app/layout |
44 | - |
Files With Most Units (Top 20)
| File | # lines | # units |
|---|---|---|
custom-matchers.ts in projects/libs/flex-layout/_private-utils/testing |
192 | 23 |
dom-tools.ts in projects/libs/flex-layout/_private-utils/testing |
83 | 17 |
base2.ts in projects/libs/flex-layout/core/base |
110 | 15 |
layout-gap.ts in projects/libs/flex-layout/flex/layout-gap |
240 | 15 |
build-bundles.ts in tools/package-tools |
111 | 12 |
media-trigger.ts in projects/libs/flex-layout/core/media-trigger |
119 | 12 |
print-hook.ts in projects/libs/flex-layout/core/media-marshaller |
167 | 12 |
media-marshaller.ts in projects/libs/flex-layout/core/media-marshaller |
252 | 11 |
server-match-media.ts in projects/libs/flex-layout/server |
103 | 10 |
match-media.ts in projects/libs/flex-layout/core/match-media |
127 | 8 |
flex.ts in projects/libs/flex-layout/flex/flex |
229 | 8 |
style-transforms.ts in projects/libs/flex-layout/extended/style |
60 | 7 |
style-utils.ts in projects/libs/flex-layout/core/style-utils |
123 | 6 |
show-hide.ts in projects/libs/flex-layout/extended/show-hide |
137 | 6 |
validateDecoratorsRule.ts in tools/tslint-rules |
68 | 5 |
server-provider.ts in projects/libs/flex-layout/server |
106 | 5 |
break-point-registry.ts in projects/libs/flex-layout/core/breakpoints |
37 | 5 |
media-observer.ts in projects/libs/flex-layout/core/media-observer |
107 | 5 |
layout-validator.ts in projects/libs/flex-layout/_private-utils |
50 | 5 |
style.ts in projects/libs/flex-layout/extended/style |
114 | 5 |
Files With Long Lines (Top 1)
There is only one file with lines longer than 120 characters. In total, there is only one long line.
| File | # lines | # units | # long lines |
|---|---|---|---|
app.component.html in projects/apps/demo-app/src/app |
36 | - | 1 |