Across 38 total functions in sudheerj/reactjs-interview-questions, all top-ranked structural risk concentrates in a single subdirectory: coding-exercise/src. Six functions show high structural complexity with no recent activity — the two highest-ranked both carry activity-weighted risk scores above 7.6 with zero commits in the last 30 days. No function combines high structural complexity with active recent changes, so the story here is not live regression risk but accumulated structural debt that will demand attention the moment this code is next extended or debugged.
The table below ranks functions by activity-weighted risk — a score that multiplies structural complexity by recent commit frequency. A function that is both hard to understand (high cyclomatic complexity) and actively changing is a higher priority than one that is complex but untouched. CC = cyclomatic complexity (independent execution paths); ND = max nesting depth; FO = fan-out (distinct callees).
Top 5 Hotspots
| Function | File | Risk | CC | ND | FO |
|---|---|---|---|---|---|
App | coding-exercise/src/App.js | 8.3 | 4 | 1 | 6 |
registerValidSW | coding-exercise/src/serviceWorker.js | 7.7 | 5 | 3 | 7 |
useFetch | coding-exercise/src/exercises/exercise-04-custom-hooks/Solution.js | 6.7 | 4 | 2 | 7 |
PostsList | coding-exercise/src/exercises/exercise-04-custom-hooks/Problem.js | 6.7 | 6 | 1 | 6 |
UserProfile | coding-exercise/src/exercises/exercise-04-custom-hooks/Problem.js | 6.7 | 6 | 1 | 6 |
No functions score above the critical risk threshold in this repo, and the 19 lower-complexity functions scattered across the codebase are largely maintenance-free. The concentration of all high-priority structural debt in coding-exercise/src makes that module the clear starting point for any refactoring investment.
App — coding-exercise/src/App.js
The App function is the root component of the coding exercise application — the structural entry point through which all UI composition flows. Despite a moderate cyclomatic complexity of 4, its fan-out of 6 means it directly calls into six distinct functions or components, making it the coordination hub for this module. That breadth of coupling is what drives its activity-weighted risk score of 8.31 to the top of the list. The exit_heavy pattern detected here means the function contains multiple return paths, each of which represents a distinct execution branch that requires its own test coverage to verify correctly. With only 2 total commits on the file and zero bug-linked commits in the external signals, there is no historical defect record to point to — but that absence of signal is partly explained by the file’s dormancy: it has not been touched in 175 days and has seen no contributors in the last 90 days.
The practical risk is a blast-radius problem. Six fan-out dependencies mean that a future developer adding a new exercise type or restructuring imports here will need to reason about — and potentially adjust — six downstream relationships simultaneously, all while navigating multiple return paths. The concrete recommendation is to audit the six callees and determine whether any conditional rendering logic driving those exit paths can be extracted into a dedicated routing or layout component. Reducing fan-out to 3–4 and consolidating the return paths to a single render expression would significantly lower the surface area for introducing regressions during the next development push.
registerValidSW — coding-exercise/src/serviceWorker.js
By name and path, registerValidSW handles the registration lifecycle of a valid service worker — likely managing the install, update, and activation callbacks that a Create React App-style service worker setup requires. Its structural profile reflects that responsibility: a cyclomatic complexity of 5, a max nesting depth of 3, and a fan-out of 7 combine to produce an activity-weighted risk score of 7.68. The nesting depth of 3 is a direct consequence of the promise-chain and event-listener patterns typical of service worker registration code, where callbacks nest inside load handlers which nest inside registration results.
What makes this function the more concerning of the two from a longevity standpoint is its dormancy: registerValidSW has not been modified in 758 days — more than two years — and has had exactly one commit touch its file in its entire recorded history, with zero contributors active in the last 90 days. Service worker APIs have continued to evolve in that window, and a function with 7 fan-out dependencies sitting untouched for over two years accumulates quiet compatibility debt even without visible churn. The recommendation is to review the function against current browser service worker API behavior before any feature work resumes in this module, and to add integration-level tests that exercise at least the install and update paths — ensuring that the nesting-driven conditional logic behaves as expected if the registration sequence is ever modified.
useFetch — coding-exercise/src/exercises/exercise-04-custom-hooks/Solution.js
useFetch is a custom hook that coordinates data fetching with component state — a pattern prone to accumulating complexity as requirements grow. At CC 4 and ND 2 the structural profile is modest, but a fan-out of 7 means the hook already calls into seven distinct functions from a compact body. That breadth is what keeps its risk score at 6.7 despite the low nesting depth. If this hook were extended with retry logic or caching, the fan-out would climb quickly. Should future exercise requirements grow, introduce a separate useFetchWithRetry hook rather than adding branches to this one — keeping each hook to a single concern prevents the FO from compounding.
PostsList — coding-exercise/src/exercises/exercise-04-custom-hooks/Problem.js
PostsList renders a list of posts fetched via the useFetch hook in the same exercise directory. CC 6 at a nesting depth of 1 points to conditional rendering written as expressions rather than nested blocks — a common React pattern for handling loading, error, and data-present states. Fan-out of 6 is typical for a component managing both data presentation and those conditional states. At risk 6.7 this is clearly a lower priority than the two top-ranked functions. If the exercise grows with additional data states or rendering variations, extracting a PostItem component would isolate per-item logic and keep fan-out in check.
UserProfile — coding-exercise/src/exercises/exercise-04-custom-hooks/Problem.js
UserProfile sits in the same file as PostsList and carries an identical structural profile: CC 6, ND 1, FO 6, risk 6.7. As a component that renders user profile fields with similar conditional states, the same fan-out pressure applies. Both components are well below the threshold for immediate action; the sub-component extraction strategy described for PostsList applies equally here if the exercise scaffold is ever extended.
Key Takeaways
- Prioritize
Appin coding-exercise/src/App.js before the next feature push. Its fan-out of 6 combined with multiple exit paths means the next developer to touch it will need to hold more context than the function’s size implies. Extract conditional rendering branches into a dedicated component to cut both fan-out and exit-path count. - Schedule a service worker API review for
registerValidSW. At 758 days without a commit, this is the most dormant high-risk function in the repo. Before any work resumes in the coding-exercise module, verify that its 7 downstream dependencies and nested callback structure still align with current service worker behavior. - The broader repo is structurally clean. With 32 of 38 functions below the high-risk threshold and no function combining high complexity with active recent changes, the debt is contained. Addressing these two functions in
coding-exercise/srcresolves all top-ranked risk in the repository.
Patterns Found
Antipatterns detected across the top functions in this snapshot:
| Pattern | Occurrences |
|---|---|
exit_heavy | 1 |
These labels belong to two tiers — Tier 1 (structural): complex_branching, deeply_nested, exit_heavy, long_function, god_function. Tier 2 (relational/temporal): hub_function, cyclic_hub, middle_man, neighbor_risk, stale_complex, churn_magnet, shotgun_target, volatile_god.
Reproduce This Analysis
git clone https://github.com/sudheerj/reactjs-interview-questions
cd reactjs-interview-questions
git checkout 04f9d9c3f288db53b958b0f444aa4701cfe81fd6
hotspots analyze . --mode snapshot --explain-patterns --forceTo run the same analysis on your own codebase, run hotspots analyze . --mode snapshot in any local git repo — no configuration required.
Hotspots highlights structural and activity risk — not “bad code.” Findings are a prioritization aid, not a bug predictor. Editorial policy →