DEV Community

Cover image for Almost half of React's code is tests: what a SLOC counter shows that GitHub hides
huang lizhuo
huang lizhuo

Posted on AI-assisted

Almost half of React's code is tests: what a SLOC counter shows that GitHub hides

GitHub's repository sidebar shows language percentages. It never shows line counts. That always bothered me: is this dependency I'm about to adopt a tidy 2,000 lines or a 200,000-line monolith? The language bar says JavaScript 58%, TypeScript 42%, and nothing about how much of anything there is.

So I built OctoCounts. Paste any public GitHub repository URL and it downloads the source archive, runs tokei, and gives you files, total lines, code, comments, blanks, and per-language totals. No clone, no sign-up, free. Any branch, tag, or commit SHA, with results pinned to the exact commit and cached, so repeat views are instant.

What it found when I pointed it at React

The default count for facebook/react at the time of writing: 696,459 code lines across 6,927 files in 14 languages.

Then OctoCounts' analysis options kick in. Exclude tests and the number collapses:

Repository Default code lines Exclude tests Delta
facebook/react 696,459 364,248 −47.7%
vitejs/vite 112,297 82,439 −26.6%

Almost half of React's code is tests. For Vite it's over a quarter. Exclude docs and generated files, and the deltas are close to zero (0% and −1.3% for docs; 0% for generated in both), which says the interesting weight in these repos lives in tests, not in docs or vendored output.

There is a practical point hiding in that table: any SLOC comparison that mixes test-inclusive and test-exclusive counts is not a valid comparison. If one tool reports 696K and another reports 364K for the same repo at the same commit, both are right and the comparison is still wrong. That's why OctoCounts pins every report to a commit SHA and shows which configuration produced it. I wrote up the pilot (two repos, four configurations each, commit-pinned) at octocounts.com/research, dataset included.

What else comes with the count

  • Permanent report pages for every repo, e.g. octocounts.com/github/facebook/react, exportable as text, JSON, or a shareable PNG card
  • Live README badges: [![SLOC](https://api.octocounts.com/badge/:owner/:repo)](https://octocounts.com/github/:owner/:repo), with per-language variants
  • Compare pages for ~90 curated pairs: React vs Vue, Rust vs Go, Electron vs Tauri, plus a tool to compare any two repos or two refs of one repo
  • A browser extension (Chrome, Edge, Firefox) that puts the counts directly in GitHub's sidebar, next to the language bar that started all this
  • An API and an MCP server, so agents and developer tools can pull the same reports
  • A CLI: npx octocounts https://github.com/owner/repo --json
  • A GitHub Action that comments SLOC changes on pull requests

Everything is cached by owner + repo + commit + engine version, which is what makes the badges and the API cheap to serve.

Try it

Paste your own repository into octocounts.com and see what your numbers say. Mine came out at 43,192 code lines across 180 files in 12 languages (tests, docs, and generated excluded), Rust on top at 31.2%, which is a satisfying shape for a line counter that runs on tokei.

It's free and open source (MIT). Feedback welcome, especially on which filters would make the comparisons you care about valid.

Top comments (0)