use-dom
Use Expo DOM components to run web code in a webview on native and as-is on web. Migrate web code to native incrementally.
74
61%
Does it follow best practices?
Impact
99%
1.25xAverage score across 3 eval scenarios
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./plugins/expo/skills/use-dom/SKILL.mdQuality
Discovery
57%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
The description identifies a clear niche (Expo DOM components) and provides a reasonable overview of what the skill does, giving it good distinctiveness. However, it lacks an explicit 'Use when...' clause and could benefit from more specific concrete actions and additional trigger terms that users would naturally use when seeking this functionality.
Suggestions
Add an explicit 'Use when...' clause, e.g., 'Use when the user wants to embed web content in a React Native/Expo app using DOM components, or mentions "use dom" directive, webviews in Expo, or incremental web-to-native migration.'
Include additional natural trigger terms users might say, such as 'React Native', '"use dom" directive', 'web-to-native', 'hybrid rendering', or 'embed web component in native app'.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (Expo DOM components) and some actions ('run web code in a webview on native', 'migrate web code to native incrementally'), but doesn't list multiple concrete specific actions like creating components, configuring settings, or handling specific patterns. | 2 / 3 |
Completeness | Describes what it does (run web code in webview, migrate web code to native) but lacks an explicit 'Use when...' clause or equivalent trigger guidance, so the 'when' is only implied from context. | 2 / 3 |
Trigger Term Quality | Includes relevant terms like 'Expo DOM components', 'webview', 'native', 'web code', and 'migrate', but misses common variations users might say such as 'React Native', 'use directive "dom"', 'hybrid app', 'web-to-native', or 'incremental adoption'. | 2 / 3 |
Distinctiveness Conflict Risk | 'Expo DOM components' is a very specific niche technology with distinct terminology, making it unlikely to conflict with other skills. The combination of Expo, DOM components, and webview on native creates a clear, unique trigger profile. | 3 / 3 |
Total | 9 / 12 Passed |
Implementation
64%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This is a solid, actionable reference skill with excellent executable code examples covering the full range of DOM component use cases. Its main weaknesses are moderate verbosity (redundant dom prop typing across examples, some explanatory sections that could be trimmed) and a monolithic structure that would benefit from splitting advanced topics into separate files. The workflow dimension could be improved with explicit verification steps.
Suggestions
Reduce redundancy by showing the `dom` prop typing pattern once and referencing it, rather than repeating it in nearly every code example.
Trim or remove the 'What are DOM Components?' and 'When to Use/NOT to Use' sections — these are conceptual explanations Claude can infer from the concrete examples.
Consider splitting advanced topics (Router integration, CSS approaches, Native action exposure) into separate referenced files to improve progressive disclosure for this lengthy skill.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is fairly well-structured but includes some unnecessary verbosity. The 'What are DOM Components?' and 'When to Use / When NOT to Use' sections explain concepts Claude can infer. Several code examples are repetitive (e.g., multiple styled component examples, the dom prop typing pattern is shown redundantly across nearly every example). However, the content is not egregiously padded. | 2 / 3 |
Actionability | The skill provides fully executable, copy-paste ready code examples throughout — from basic DOM components to web library integration, native action exposure, router usage, CSS handling, and asset loading. Every section includes concrete TypeScript/TSX code with proper imports and types. | 3 / 3 |
Workflow Clarity | The skill clearly lists rules and constraints (5 rules for DOM components, router APIs that require props workaround), but there's no explicit workflow sequence for creating a DOM component from scratch. For a reference-style skill this is acceptable, but the 'When to Use' decision tree could be more structured, and there are no validation/verification steps (e.g., how to confirm the DOM component is rendering correctly in the webview). | 2 / 3 |
Progressive Disclosure | The content is well-organized with clear section headers, but it's a long monolithic file (~250 lines of content) with no references to external files. Topics like the full recharts example, CSS approaches, and router integration could be split into separate reference files. For a skill of this length, some progressive disclosure via linked files would improve navigability. | 2 / 3 |
Total | 9 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
- Repository
- expo/skills
- Commit
434c935
- 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.