client-side-routing

How to add routes without remounting the app shell. Use when adding a new route, fixing agent sidebar reloads on navigation, or choosing between `root.tsx` layout and pathless `_app.tsx` layout patterns.

Quality

83%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

78%Weight 40%Scale 1-5

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

A well-structured, actionable skill: it leads with the rule, shows both correct patterns with concrete code, an explicit anti-pattern, and clear guidance for adding a new route. Main room for improvement is tightening the redundant Rule/Hard Rule sections and the meandering Chat-First paragraph, and adding a quick verification step.

Suggestions

Merge the 'Rule' and 'Hard Rule' sections, which restate the same no-remount constraint, and tighten the 'Chat-First Routes' paragraph to a single sentence about keeping the shell mounted around full-page chat routes.

Add a short verification step after adding a route, e.g. 'navigate between two routes and confirm the agent sidebar state (open threads, scroll) persists without reconnect'.

Show the actual '_app.tsx' component code instead of a comment placeholder, mirroring the executable root.tsx snippet for Pattern #1.

Dimension	Reasoning	Score
Conciseness	The body is mostly lean — the 'Why' is one sentence and code examples are minimal — but 'Rule' and 'Hard Rule' repeat the same remount constraint, and the 'Chat-First Routes' paragraph wanders into dev-server detail that could be trimmed. This fits the 'efficient; minor instances of over-explanation' anchor.	4 / 5
Actionability	Both correct patterns get concrete, usable examples (the root.tsx wrapper snippet and the route file tree) and the anti-pattern is shown as real code. It stops short of fully copy-paste-ready: the '_app.tsx' component is only described in a comment ('# renders <AppLayout><Outlet /></AppLayout>') rather than shown.	4 / 5
Workflow Clarity	'Adding a New Route' gives unambiguous per-pattern instructions and the pattern headers state their applicability conditions ('All routes need the shell' vs 'Mix of protected and public routes'). However there is no verification checkpoint (e.g. confirming the sidebar survives navigation after the change), so it sits at 'clear sequence with most checkpoints present; minor validation gaps'.	4 / 5
Progressive Disclosure	This is a single-purpose rule skill with no external reference files, and all content (rule, two patterns, anti-pattern, chat-route caveat) appropriately lives in the well-sectioned SKILL.md. Nothing needs splitting out and navigation is easy, matching the simple-skill case where well-organized sections alone earn the top score.	5 / 5
	Total	17 / 20 Passed

Description

83%Weight 40%Scale 1-5

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 description: it states a concrete capability and gives an explicit 'Use when...' clause with three specific, natural trigger scenarios including file-level tokens. The only weaknesses are minor — slightly narrow action coverage and a broad 'new route' trigger that could overlap with generic routing skills.

Dimension	Reasoning	Score
Specificity	The description names several concrete actions — 'add routes without remounting the app shell', 'fixing agent sidebar reloads on navigation', and choosing between 'root.tsx layout and pathless _app.tsx layout patterns' — down to specific file names. It falls just short of the 5 anchor because coverage is narrow (route addition/remount-fixing only, with no mention of related routing concerns).	4 / 5
Completeness	It explicitly answers both what ('How to add routes without remounting the app shell') and when ('Use when adding a new route, fixing agent sidebar reloads on navigation, or choosing between...') with three concrete trigger phrases, matching the top anchor.	5 / 5
Trigger Term Quality	Natural trigger phrases users would actually say are present: 'adding a new route', 'sidebar reloads on navigation', plus concrete file tokens like 'root.tsx' and '_app.tsx'. A few common variations (e.g. 'navigation', 'redirect', 'layout remount') are missing, matching the 'good keyword coverage; a few natural terms missing' anchor.	4 / 5
Distinctiveness Conflict Risk	The pathless '_app.tsx' pattern and 'agent sidebar' framing carve out a distinct niche, but the broad trigger 'adding a new route' could overlap with a generic routing or API-endpoint skill, matching the 'mostly distinct; minor overlap risk' anchor.	4 / 5
	Total	17 / 20 Passed

Validation

81%

Warnings & errors only

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

Validation — 13 / 16 Passed

Validation for skill structure

Criteria	Description	Result
metadata_version	'metadata.version' is missing	Warning
metadata_field	'metadata' should map string keys to string values	Warning
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	13 / 16 Passed

Repository: BuilderIO/agent-native
Path: .agents/skills/client-side-routing/SKILL.md
Commit: a941a2e

Reviewed: 9 days ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.