CtrlK
BlogDocsLog inGet started
Tessl Logo

markstream-react

Integrate the beta markstream-react package into a React 18+ or Next app. Use when Codex needs to add the React renderer, choose the root, `next`, or `server` entrypoint, import CSS correctly, choose between `content` and `nodes`, keep client boundaries safe, add renderer-local `streamingComponents` or `htmlComponents`, use parser transforms, or prepare a repo for `react-markdown` migration.

69

Quality

83%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

75%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, mostly executable body with a clear sequenced workflow and validation step. It would benefit from a copy-paste code example and a more specific validation command, and from de-duplicating the streaming-vs-history guidance.

Suggestions

Add one small copy-paste JSX/JS example showing the recommended import and a <Markstream> usage with the streaming-vs-history prop set, to lift actionability from specific-but-described to copy-paste ready.

Tighten the validation step (8) with a concrete command template (e.g. 'run the project's typecheck: `tsc --noEmit` or `next build`') instead of the generic 'smallest useful dev, build, or typecheck command'.

De-duplicate the streaming-vs-recovering-history block: keep the full prop recipes in one place (Workflow step 5) and reference them from Default Decisions rather than restating the same values.

DimensionReasoningScore

Conciseness

Lean workflow and default-decisions sections that assume Claude's competence and avoid basic-concept padding; minor duplication of the streaming-vs-recovering-history guidance between Workflow step 5 and Default Decisions keeps it just below 5.

4 / 5

Actionability

Concrete guidance with exact import paths (markstream-react/index.css, markstream-react/next) and exact prop values (smoothStreaming="auto", fade={false}); instruction-only but actionable, with the minor gap of no full copy-paste code examples.

4 / 5

Workflow Clarity

An 8-step sequenced workflow includes an explicit validation step ('Validate with the smallest useful dev, build, or typecheck command'); the validation phrasing is slightly vague and lacks a specific command, so it does not reach 5.

4 / 5

Progressive Disclosure

Well-organized into Workflow, Default Decisions, and Useful Doc Targets with clearly signaled one-level-deep doc references; no bundle files exist and the flat doc-target list is a minor organization gap versus the top anchor.

4 / 5

Total

16

/

20

Passed

Description

92%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 specific, complete, and distinctive description that names many concrete actions and an explicit 'Use when' trigger. Trigger terms lean technical, leaving minor room for more natural phrasings.

DimensionReasoningScore

Specificity

Lists multiple specific concrete actions — add the React renderer, choose root/next/server entrypoints, import CSS, choose content vs nodes, add renderer-local streamingComponents or htmlComponents, use parser transforms, prepare react-markdown migration — for comprehensive coverage; not below 5 since coverage is broad and concrete rather than a few actions.

5 / 5

Completeness

Explicitly answers both what ('Integrate the beta markstream-react package into a React 18+ or Next app') and when ('Use when Codex needs to...') with concrete trigger phrases; fits the top anchor exactly.

5 / 5

Trigger Term Quality

Good coverage of natural developer terms (markstream-react, React 18+, Next app, react-markdown migration) but jargon-heavy (entrypoint, client boundaries, parser transforms) with a few natural phrasings missing; above 3 due to solid keyword breadth, below 5 since synonyms/extensions are incomplete.

4 / 5

Distinctiveness Conflict Risk

Clear niche (beta markstream-react, React 18+/Next, specific entrypoints and component maps) with distinct triggers and minimal overlap with other skills.

5 / 5

Total

19

/

20

Passed

Validation

100%

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

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
Simon-He95/markstream-vue
Reviewed

Table of Contents

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.