CtrlK
BlogDocsLog inGet started
Tessl Logo

uinaf/react-ban-use-effect

Ban direct `useEffect` in React components. Use when writing, refactoring, or reviewing React code so derived state, data fetching, user actions, resets, and mount-only external synchronization use declarative replacement patterns instead of dependency-array choreography.

95

1.02x
Quality

95%

Does it follow best practices?

Impact

98%

1.02x

Average score across 4 eval scenarios

SecuritybySnyk

Passed

No known issues

Overview
Quality
Evals
Security
Files

Quality

Content

92%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is concise, actionable, and workflow-clear with a concrete replacement ladder and an explicit validation step. Its one weakness is progressive disclosure: three reference files are linked but none exist in the bundle, so the signaled navigation leads nowhere.

Suggestions

Add the missing references/ directory with replacements.md, alternatives.md, and upstream.md so the linked navigation resolves, or remove the dead links and inline the essential content.

Confirm the section anchor referenced in 'See the external-system replacement (references/replacements.md#5-synchronize-external-systems)' exists once the file is created.

Consider a one-line note in each reference link stating what the file contains, so Claude can decide whether to open it without loading it.

DimensionReasoningScore

Conciseness

Lean and efficient throughout — it never explains what React or useEffect is, assumes Claude's competence, and every section (Start Here, Replacement Ladder, Escape Hatches, Enforcement, Boundaries) earns its place, matching the 'lean and efficient; every token earns its place' anchor.

3 / 3

Actionability

Provides a concrete numbered replacement ladder with named libraries (TanStack Query, SWR, Relay, Apollo) and a copy-paste-ready ESLint config block, matching the 'fully executable code/commands; specific examples; copy-paste ready' anchor.

3 / 3

Workflow Clarity

The 'Start Here' section is a clearly sequenced 5-step process whose step 5 is an explicit validation checkpoint ('run the repo's lint/type/test gate... Fix failures and rerun before completion'), matching the 'clear sequence with explicit validation steps; feedback loops for error recovery' anchor.

3 / 3

Progressive Disclosure

The body is well-organized and signals one-level-deep references (replacements.md, alternatives.md, upstream.md) with clear link text, but the referenced files do not exist — no references/ directory is present — so navigation is broken. This falls below the 'easy navigation' bar of level 3 while still being better structured than the monolithic level-1 anchor.

2 / 3

Total

11

/

12

Passed

Description

100%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong, well-constructed description that follows the good-example pattern: concrete action statement, explicit 'Use when' triggers with multiple scenarios, and a clear 'Do not use for' negative scope. Voice is imperative/third person with no first- or second-person phrasing.

DimensionReasoningScore

Specificity

Names the domain and lists multiple concrete actions/contexts — 'writing, refactoring, reviewing, or migrating React components or hooks that import, call, add, or replace direct useEffect' — matching the 'lists multiple specific concrete actions' anchor.

3 / 3

Completeness

Explicitly answers both what ('Ban direct useEffect in React code') and when ('Use when writing, refactoring, reviewing, or migrating...') plus a negative-scope 'Do not use for...' clause, matching the 'clearly answers both what AND when' anchor.

3 / 3

Trigger Term Quality

Covers natural terms a React developer would actually say — 'useEffect', 'React', 'refactoring', 'reviewing', 'migrating', 'lint/agent rules', 'fetching', 'derived state' — with the key trigger 'useEffect' front and center. Not the level below, which expects only partial coverage with missing common variations.

3 / 3

Distinctiveness Conflict Risk

A clear narrow niche (no-direct-useEffect policy) with explicit negative scope ('Do not use for ordinary React work with no effect smell, non-React code...') making it unlikely to trigger for the wrong skill.

3 / 3

Total

12

/

12

Passed

Validation

87%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

relative_links

Relative link issues: 5 missing

Warning

referenced_paths_exist

Referenced path issues: 9 missing

Warning

Total

14

/

16

Passed

Reviewed

Table of Contents