reactjs / gu.reactjs.org
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 105 files with 6,428 lines of code.
    • 1 very long files (1,130 lines of code)
    • 0 long files (0 lines of code)
    • 4 medium size files (1,224 lines of codeclsfd_ftr_w_mp_ins)
    • 11 small files (1,508 lines of code)
    • 89 very small files (2,566 lines of code)
17% | 0% | 19% | 23% | 39%
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
yml71% | 0% | 0% | 12% | 16%
js0% | 0% | 26% | 27% | 46%
yaml0% | 0% | 0% | 0% | 100%
css0% | 0% | 0% | 0% | 100%
html0% | 0% | 0% | 0% | 100%
File Size per Logical Decomposition
primary
1001+
501-1000
201-500
101-200
1-100
content73% | 0% | 0% | 12% | 13%
src/components0% | 0% | 26% | 25% | 47%
src0% | 0% | 64% | 22% | 12%
src/pages0% | 0% | 53% | 15% | 30%
src/templates0% | 0% | 0% | 33% | 66%
ROOT0% | 0% | 0% | 62% | 37%
gatsby0% | 0% | 0% | 59% | 40%
src/utils0% | 0% | 0% | 48% | 51%
plugins/gatsby-remark-header-custom-ids0% | 0% | 0% | 0% | 100%
plugins/gatsby-transformer-versions-yaml0% | 0% | 0% | 0% | 100%
scripts0% | 0% | 0% | 0% | 100%
src/css0% | 0% | 0% | 0% | 100%
content/tutorial0% | 0% | 0% | 0% | 100%
plugins/gatsby-transformer-home-example-code0% | 0% | 0% | 0% | 100%
plugins/gatsby-source-react-error-codes0% | 0% | 0% | 0% | 100%
plugins/gatsby-transformer-authors-yaml0% | 0% | 0% | 0% | 100%
content/community0% | 0% | 0% | 0% | 100%
static/js0% | 0% | 0% | 0% | 100%
static/html0% | 0% | 0% | 0% | 100%
plugins/gatsby-remark-use-jsx0% | 0% | 0% | 0% | 100%
Longest Files (Top 50)
File# lines# units
1130 -
theme.js
in src
391 7
index.js
in src/pages
374 3
Header.js
in src/components/LayoutHeader
233 -
CodeEditor.js
in src/components/CodeEditor
226 5
languages.yml
in content
192 -
StickyResponsiveSidebar.js
in src/components/StickyResponsiveSidebar
181 2
171 1
MarkdownPage.js
in src/components/MarkdownPage
140 -
139 -
Footer.js
in src/components/LayoutFooter
132 -
121 1
createLink.js
in src/utils
113 -
languages.js
in src/pages
110 -
Section.js
in src/templates/components/Sidebar
106 1
NavigationFooter.js
in src/templates/components/NavigationFooter
103 -
authors.yml
in content
99 -
all.html.js
in src/pages/blog
93 -
85 -
DocSearch.js
in src/components/LayoutHeader
85 2
ErrorDecoder.js
in src/components/ErrorDecoder
82 5
blog.js
in src/templates
74 2
gatsby-ssr.js
in plugins/gatsby-remark-header-custom-ids
70 1
CodeExample.js
in src/components/CodeExample
67 1
ButtonLink.js
in src/components/ButtonLink
65 -
BannerContextManager.js
in src/components/Banner
65 1
versions.js
in src/pages
64 -
HeaderLink.js
in src/components/LayoutHeader
63 -
TitleAndMetaTags.js
in src/components/TitleAndMetaTags
62 -
61 4
Sidebar.js
in src/templates/components/Sidebar
59 3
58 1
versions.yml
in content
56 -
codepen-example.js
in src/templates
55 1
Layout.js
in src/components/Layout
53 1
ScrollSyncSection.js
in src/templates/components/Sidebar
52 7
index.js
in plugins/gatsby-remark-header-custom-ids
51 1
create-redirects.js
in plugins/gatsby-transformer-versions-yaml
48 -
html.js
in src
42 -
Flex.js
in src/components/Flex
41 -
footerNav.yml
in content
40 -
docs.js
in src/templates
38 2
tutorial.js
in src/templates
37 2
reset.css
in src/css
36 -
community.js
in src/templates
34 2
33 3
ExternalFooterLink.js
in src/components/LayoutFooter
33 -
FooterNav.js
in src/components/LayoutFooter
31 -
nav.yml
in content/tutorial
30 -
types.js
in src
30 -
Files With Most Units (Top 27)
File# lines# units
theme.js
in src
391 7
ScrollSyncSection.js
in src/templates/components/Sidebar
52 7
CodeEditor.js
in src/components/CodeEditor
226 5
ErrorDecoder.js
in src/components/ErrorDecoder
82 5
61 4
33 3
Sidebar.js
in src/templates/components/Sidebar
59 3
index.js
in src/pages
374 3
DocSearch.js
in src/components/LayoutHeader
85 2
StickyResponsiveSidebar.js
in src/components/StickyResponsiveSidebar
181 2
docs.js
in src/templates
38 2
tutorial.js
in src/templates
37 2
blog.js
in src/templates
74 2
community.js
in src/templates
34 2
gatsby-ssr.js
in plugins/gatsby-remark-header-custom-ids
70 1
index.js
in plugins/gatsby-remark-header-custom-ids
51 1
121 1
58 1
171 1
10 1
10 1
slugify.js
in src/utils
5 1
Layout.js
in src/components/Layout
53 1
CodeExample.js
in src/components/CodeExample
67 1
BannerContextManager.js
in src/components/Banner
65 1
codepen-example.js
in src/templates
55 1
Section.js
in src/templates/components/Sidebar
106 1
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
index.js
in plugins/gatsby-remark-header-custom-ids
51 1 1
Correlations

File Size vs. Commits (all time): 105 points

content/authors.yml x: 25 commits (all time) y: 99 lines of code gatsby-browser.js x: 7 commits (all time) y: 13 lines of code src/components/Banner/Banner.js x: 3 commits (all time) y: 21 lines of code src/components/Banner/BannerContext.js x: 3 commits (all time) y: 5 lines of code src/components/Banner/BannerContextManager.js x: 4 commits (all time) y: 65 lines of code src/components/LayoutHeader/Header.js x: 46 commits (all time) y: 233 lines of code src/components/MarkdownHeader/MarkdownHeader.js x: 25 commits (all time) y: 30 lines of code src/components/MarkdownPage/MarkdownPage.js x: 51 commits (all time) y: 140 lines of code src/components/StickyResponsiveSidebar/StickyResponsiveSidebar.js x: 31 commits (all time) y: 181 lines of code src/pages/index.js x: 55 commits (all time) y: 374 lines of code src/theme.js x: 52 commits (all time) y: 391 lines of code gatsby-config.js x: 51 commits (all time) y: 171 lines of code plugins/gatsby-transformer-home-example-code/gatsby-node.js x: 16 commits (all time) y: 29 lines of code src/components/FeedbackForm/index.js x: 3 commits (all time) y: 2 lines of code src/components/LayoutHeader/DocSearch.js x: 14 commits (all time) y: 85 lines of code src/components/TitleAndMetaTags/TitleAndMetaTags.js x: 29 commits (all time) y: 62 lines of code src/pages/acknowledgements.html.js x: 29 commits (all time) y: 16 lines of code gatsby-node.js x: 42 commits (all time) y: 5 lines of code gatsby/createPages.js x: 7 commits (all time) y: 121 lines of code gatsby/onCreateNode.js x: 11 commits (all time) y: 58 lines of code gatsby/onCreatePage.js x: 6 commits (all time) y: 11 lines of code gatsby/onCreateWebpackConfig.js x: 3 commits (all time) y: 14 lines of code plugins/gatsby-remark-header-custom-ids/gatsby-client.js x: 4 commits (all time) y: 26 lines of code plugins/gatsby-remark-header-custom-ids/gatsby-ssr.js x: 5 commits (all time) y: 70 lines of code plugins/gatsby-remark-header-custom-ids/index.js x: 5 commits (all time) y: 51 lines of code plugins/gatsby-source-react-error-codes/gatsby-node.js x: 17 commits (all time) y: 23 lines of code plugins/gatsby-transformer-authors-yaml/gatsby-node.js x: 4 commits (all time) y: 22 lines of code plugins/gatsby-transformer-versions-yaml/create-redirects.js x: 5 commits (all time) y: 48 lines of code plugins/gatsby-transformer-versions-yaml/gatsby-node.js x: 9 commits (all time) y: 25 lines of code src/components/ButtonLink/ButtonLink.js x: 11 commits (all time) y: 65 lines of code src/components/ButtonLink/index.js x: 10 commits (all time) y: 2 lines of code src/components/CodeEditor/CodeEditor.js x: 62 commits (all time) y: 226 lines of code src/components/CodeEditor/index.js x: 15 commits (all time) y: 2 lines of code src/components/CodeExample/CodeExample.js x: 10 commits (all time) y: 67 lines of code src/components/CodeExample/index.js x: 4 commits (all time) y: 2 lines of code src/components/Container/Container.js x: 18 commits (all time) y: 19 lines of code src/components/ErrorDecoder/ErrorDecoder.js x: 23 commits (all time) y: 82 lines of code src/components/Flex/Flex.js x: 17 commits (all time) y: 41 lines of code src/components/Header/Header.js x: 18 commits (all time) y: 12 lines of code src/components/Layout/Layout.js x: 3 commits (all time) y: 53 lines of code src/components/LayoutFooter/ExternalFooterLink.js x: 17 commits (all time) y: 33 lines of code src/components/LayoutFooter/Footer.js x: 57 commits (all time) y: 132 lines of code src/components/LayoutFooter/FooterNav.js x: 19 commits (all time) y: 31 lines of code src/components/LayoutFooter/SectionLinks.js x: 5 commits (all time) y: 30 lines of code src/components/LayoutHeader/HeaderLink.js x: 21 commits (all time) y: 63 lines of code src/components/LayoutHeader/SearchSvg.js x: 15 commits (all time) y: 18 lines of code src/css/reset.css x: 9 commits (all time) y: 36 lines of code src/html.js x: 26 commits (all time) y: 42 lines of code src/pages/404.js x: 16 commits (all time) y: 18 lines of code src/pages/blog/all.html.js x: 22 commits (all time) y: 93 lines of code src/pages/jsx-compiler.html.js x: 18 commits (all time) y: 24 lines of code src/pages/languages.js x: 7 commits (all time) y: 110 lines of code src/pages/versions.js x: 12 commits (all time) y: 64 lines of code src/prism-styles.js x: 19 commits (all time) y: 139 lines of code src/site-constants.js x: 71 commits (all time) y: 4 lines of code src/templates/blog.js x: 20 commits (all time) y: 74 lines of code src/templates/codepen-example.js x: 18 commits (all time) y: 55 lines of code src/templates/community.js x: 20 commits (all time) y: 34 lines of code src/templates/components/MetaTitle/index.js x: 21 commits (all time) y: 16 lines of code src/templates/components/NavigationFooter/NavigationFooter.js x: 22 commits (all time) y: 103 lines of code src/templates/components/Sidebar/ScrollSyncSection.js x: 10 commits (all time) y: 52 lines of code src/templates/components/Sidebar/Section.js x: 32 commits (all time) y: 106 lines of code src/templates/components/Sidebar/Sidebar.js x: 19 commits (all time) y: 59 lines of code src/templates/docs.js x: 20 commits (all time) y: 38 lines of code src/templates/tutorial.js x: 23 commits (all time) y: 37 lines of code src/types.js x: 11 commits (all time) y: 30 lines of code src/utils/createLink.js x: 23 commits (all time) y: 113 lines of code src/utils/findSectionForPath.js x: 17 commits (all time) y: 28 lines of code src/utils/isItemActive.js x: 22 commits (all time) y: 21 lines of code src/utils/loadScript.js x: 9 commits (all time) y: 11 lines of code src/utils/patchDOMForGoogleTranslate.js x: 5 commits (all time) y: 33 lines of code src/utils/sectionList.js x: 20 commits (all time) y: 16 lines of code src/utils/slugify.js x: 17 commits (all time) y: 5 lines of code src/utils/toCommaSeparatedList.js x: 17 commits (all time) y: 4 lines of code static/js/jsfiddle-integration-babel.js x: 3 commits (all time) y: 10 lines of code content/languages.yml x: 43 commits (all time) y: 192 lines of code content/footerNav.yml x: 10 commits (all time) y: 40 lines of code content/versions.yml x: 35 commits (all time) y: 56 lines of code content/community/nav.yml x: 13 commits (all time) y: 22 lines of code static/html/single-file-example.html x: 11 commits (all time) y: 19 lines of code content/tutorial/nav.yml x: 7 commits (all time) y: 30 lines of code crowdin.yaml x: 4 commits (all time) y: 85 lines of code content/acknowledgements.yml x: 1 commits (all time) y: 1130 lines of code
1130.0
lines of code
  min: 2.0
  average: 61.22
  25th percentile: 10.5
  median: 30.0
  75th percentile: 64.5
  max: 1130.0
0 71.0
commits (all time)
min: 1.0 | average: 17.38 | 25th percentile: 7.0 | median: 15.0 | 75th percentile: 20.5 | max: 71.0

File Size vs. Contributors (all time): 105 points

content/authors.yml x: 15 contributors (all time) y: 99 lines of code gatsby-browser.js x: 6 contributors (all time) y: 13 lines of code src/components/Banner/Banner.js x: 3 contributors (all time) y: 21 lines of code src/components/Banner/BannerContext.js x: 3 contributors (all time) y: 5 lines of code src/components/Banner/BannerContextManager.js x: 4 contributors (all time) y: 65 lines of code src/components/LayoutHeader/Header.js x: 18 contributors (all time) y: 233 lines of code src/components/MarkdownHeader/MarkdownHeader.js x: 13 contributors (all time) y: 30 lines of code src/components/MarkdownPage/MarkdownPage.js x: 23 contributors (all time) y: 140 lines of code src/components/StickyResponsiveSidebar/StickyResponsiveSidebar.js x: 16 contributors (all time) y: 181 lines of code src/pages/index.js x: 25 contributors (all time) y: 374 lines of code src/theme.js x: 24 contributors (all time) y: 391 lines of code gatsby-config.js x: 20 contributors (all time) y: 171 lines of code plugins/gatsby-transformer-home-example-code/gatsby-node.js x: 9 contributors (all time) y: 29 lines of code src/components/FeedbackForm/index.js x: 3 contributors (all time) y: 2 lines of code src/components/LayoutHeader/DocSearch.js x: 10 contributors (all time) y: 85 lines of code src/components/TitleAndMetaTags/TitleAndMetaTags.js x: 15 contributors (all time) y: 62 lines of code src/pages/acknowledgements.html.js x: 16 contributors (all time) y: 16 lines of code gatsby-node.js x: 10 contributors (all time) y: 5 lines of code gatsby/createPages.js x: 6 contributors (all time) y: 121 lines of code gatsby/onCreateNode.js x: 9 contributors (all time) y: 58 lines of code gatsby/onCreatePage.js x: 5 contributors (all time) y: 11 lines of code gatsby/onCreateWebpackConfig.js x: 3 contributors (all time) y: 14 lines of code plugins/gatsby-remark-header-custom-ids/gatsby-client.js x: 4 contributors (all time) y: 26 lines of code plugins/gatsby-remark-header-custom-ids/gatsby-ssr.js x: 4 contributors (all time) y: 70 lines of code plugins/gatsby-remark-header-custom-ids/index.js x: 4 contributors (all time) y: 51 lines of code plugins/gatsby-source-react-error-codes/gatsby-node.js x: 10 contributors (all time) y: 23 lines of code plugins/gatsby-transformer-authors-yaml/gatsby-node.js x: 4 contributors (all time) y: 22 lines of code plugins/gatsby-transformer-versions-yaml/create-redirects.js x: 3 contributors (all time) y: 48 lines of code plugins/gatsby-transformer-versions-yaml/gatsby-node.js x: 5 contributors (all time) y: 25 lines of code scripts/generateHeadingIDs.js x: 4 contributors (all time) y: 61 lines of code src/components/ButtonLink/ButtonLink.js x: 9 contributors (all time) y: 65 lines of code src/components/ButtonLink/index.js x: 8 contributors (all time) y: 2 lines of code src/components/CodeEditor/CodeEditor.js x: 24 contributors (all time) y: 226 lines of code src/components/CodeEditor/index.js x: 9 contributors (all time) y: 2 lines of code src/components/CodeExample/CodeExample.js x: 5 contributors (all time) y: 67 lines of code src/components/CodeExample/index.js x: 4 contributors (all time) y: 2 lines of code src/components/Container/Container.js x: 10 contributors (all time) y: 19 lines of code src/components/ErrorDecoder/ErrorDecoder.js x: 13 contributors (all time) y: 82 lines of code src/components/Flex/Flex.js x: 10 contributors (all time) y: 41 lines of code src/components/Header/Header.js x: 10 contributors (all time) y: 12 lines of code src/components/Layout/Layout.js x: 3 contributors (all time) y: 53 lines of code src/components/LayoutFooter/ExternalFooterLink.js x: 10 contributors (all time) y: 33 lines of code src/components/LayoutFooter/Footer.js x: 32 contributors (all time) y: 132 lines of code src/components/LayoutFooter/FooterLink.js x: 11 contributors (all time) y: 21 lines of code src/components/LayoutFooter/FooterNav.js x: 12 contributors (all time) y: 31 lines of code src/components/LayoutFooter/SectionLinks.js x: 4 contributors (all time) y: 30 lines of code src/components/LayoutHeader/HeaderLink.js x: 11 contributors (all time) y: 63 lines of code src/components/LayoutHeader/SearchSvg.js x: 9 contributors (all time) y: 18 lines of code src/css/reset.css x: 5 contributors (all time) y: 36 lines of code src/html.js x: 15 contributors (all time) y: 42 lines of code src/pages/blog/all.html.js x: 11 contributors (all time) y: 93 lines of code src/pages/jsx-compiler.html.js x: 11 contributors (all time) y: 24 lines of code src/pages/languages.js x: 5 contributors (all time) y: 110 lines of code src/pages/versions.js x: 7 contributors (all time) y: 64 lines of code src/prism-styles.js x: 10 contributors (all time) y: 139 lines of code src/site-constants.js x: 24 contributors (all time) y: 4 lines of code src/templates/blog.js x: 14 contributors (all time) y: 74 lines of code src/templates/codepen-example.js x: 9 contributors (all time) y: 55 lines of code src/templates/community.js x: 14 contributors (all time) y: 34 lines of code src/templates/components/ChevronSvg/index.js x: 10 contributors (all time) y: 30 lines of code src/templates/components/MetaTitle/index.js x: 12 contributors (all time) y: 16 lines of code src/templates/components/NavigationFooter/NavigationFooter.js x: 14 contributors (all time) y: 103 lines of code src/templates/components/Sidebar/ScrollSyncSection.js x: 8 contributors (all time) y: 52 lines of code src/templates/components/Sidebar/Section.js x: 16 contributors (all time) y: 106 lines of code src/templates/components/Sidebar/Sidebar.js x: 11 contributors (all time) y: 59 lines of code src/templates/docs.js x: 14 contributors (all time) y: 38 lines of code src/templates/tutorial.js x: 15 contributors (all time) y: 37 lines of code src/types.js x: 6 contributors (all time) y: 30 lines of code src/utils/createLink.js x: 12 contributors (all time) y: 113 lines of code src/utils/isItemActive.js x: 12 contributors (all time) y: 21 lines of code src/utils/loadScript.js x: 7 contributors (all time) y: 11 lines of code src/utils/patchDOMForGoogleTranslate.js x: 3 contributors (all time) y: 33 lines of code src/utils/sectionList.js x: 14 contributors (all time) y: 16 lines of code src/utils/toCommaSeparatedList.js x: 10 contributors (all time) y: 4 lines of code static/js/jsfiddle-integration-babel.js x: 3 contributors (all time) y: 10 lines of code content/languages.yml x: 9 contributors (all time) y: 192 lines of code content/footerNav.yml x: 7 contributors (all time) y: 40 lines of code content/versions.yml x: 14 contributors (all time) y: 56 lines of code content/community/nav.yml x: 7 contributors (all time) y: 22 lines of code static/html/single-file-example.html x: 8 contributors (all time) y: 19 lines of code crowdin.yaml x: 4 contributors (all time) y: 85 lines of code content/acknowledgements.yml x: 1 contributors (all time) y: 1130 lines of code
1130.0
lines of code
  min: 2.0
  average: 61.22
  25th percentile: 10.5
  median: 30.0
  75th percentile: 64.5
  max: 1130.0
0 32.0
contributors (all time)
min: 1.0 | average: 9.53 | 25th percentile: 5.0 | median: 9.0 | 75th percentile: 12.0 | max: 32.0

File Size vs. Commits (30 days): 0 points

No data for "commits (30d)" vs. "lines of code".

File Size vs. Contributors (30 days): 0 points

No data for "contributors (30d)" vs. "lines of code".


File Size vs. Commits (90 days): 0 points

No data for "commits (90d)" vs. "lines of code".

File Size vs. Contributors (90 days): 0 points

No data for "contributors (90d)" vs. "lines of code".