frontend-code-review
Use only when the user explicitly requests a review or audit of frontend code under `web/` or `packages/dify-ui/`. Supports pending-change, file-focused, and pasted-diff reviews. Do not use for implementation-only requests, diagnosis without review intent, or backend-only code.
How do I install this agent skill?
npx skills add https://github.com/langgenius/dify --skill frontend-code-reviewIs this agent skill safe to install?
- Gen Agent Trust Hubpass
This skill is designed to perform frontend code reviews by checking TypeScript and JavaScript files against a set of quality, performance, and business logic rules. No security issues or malicious patterns were detected.
- Socketpass
No alerts
- Snykfail
Risk: HIGH · 1 issue
- Runlayerpass
4 files scanned · No issues
- ZeroLeakswarn
1 finding · Score: 69/100
What does this agent skill do?
Frontend Code Review
Review the requested scope for concrete, reproducible regressions. This skill owns the review phase and routes directly to its bundled rule packs. For a combined review-and-fix request, establish findings before applying implementation or testing guidance.
Evidence First
- Establish the review scope from the requested files or current diff.
- Read the changed lines, their behavior owner, and the nearest scoped
AGENTS.md. - Trace public consumers, generated contracts, primitive APIs, or runtime configuration only when they decide correctness.
- Report only findings tied to an observable failure, violated contract, security boundary, or demonstrated maintenance risk.
Rule Routing
Read only the packs matched by the diff:
- DOM semantics, focus, keyboard, forms, disabled state, or visible interaction:
references/accessibility-ui.md - Dify UI imports, Base UI wrappers, overlays, tokens, or primitive contracts:
references/dify-ui.md - Component ownership, props, state, Effects, navigation, or module boundaries:
references/component-architecture.md - Generated clients, Query, mutations, auth, SSR, URL state, or persistence:
references/data-query-contracts.md - Test files or a concrete missing-regression-test finding:
references/testing.md - Bundle, waterfall, rendering, or subscription cost supported by evidence:
references/performance.md - Stable Dify runtime invariants in the named paths:
references/dify-invariants.md - General TypeScript or styling quality not owned above:
references/code-quality.md
Read packages/dify-ui/README.md, packages/dify-ui/AGENTS.md, packages/dify-ui/docs/overlays.md, or web/docs/test.md only when the reviewed code falls under that contract. Check current official documentation when local code and bundled references do not settle a framework, browser, or accessibility behavior.
Severity And Output
- P0: security or privacy leak, data loss, production crash, or inaccessible critical workflow.
- P1: user-visible regression, invalid API or authorization contract, hydration failure, or broken primary interaction.
- P2: concrete maintainability, performance, test, or accessibility defect likely to cause incorrect behavior.
- P3: minor actionable cleanup; omit unless the user requested a thorough audit.
Lead with findings ordered by severity. Include a tight file and line reference, the failing contract or reproduction path, impact, and a concrete fix direction. If there are no findings, say No issues found. and state any material verification gap. Do not add praise sections, speculative risks, or an unsolicited offer to implement fixes.
How can the creator link this skill?
Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.
<a href="https://skillzs.dev/skills/langgenius/dify/frontend-code-review">View frontend-code-review on skillZs</a>