メニュー
Utilize built-in browser APIs (like Popover API, View Transitions etc) instead of building features manually via JavaScript. Use when using browser APIs.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
| name | modern-browser-apis |
| description | Utilize built-in browser APIs (like Popover API, View Transitions etc) instead of building features manually via JavaScript. Use when using browser APIs. |
We prefer native, modern browser APIs — standardized, widely supported, and high-leverage — to heavy external libraries or custom fallbacks. Use them to simplify logic, improve performance, and reduce bundle size where appropriate.
These APIs are stable, broadly implemented, and useful in everyday applications.
if ('clipboard' in navigator) { … }
For APIs not universally supported (e.g., WebGPU), provide a graceful fallback (WebGL or degraded UI).
Always combine user gesture requirements (e.g., for sharing or clipboard) with permission checks.
ASYNC FIRST: Prefer promise/async APIs to avoid blocking UI.
PERMISSIONS UI: Convey clearly to users when the browser will ask for access (files, clipboard, sharing).
PERFORMANCE MINDFUL: Observe and prioritize main thread work using PerformanceObserver or Scheduling APIs.
SECURE CONTEXTS: Use HTTPS; many APIs require secure contexts to function.
Write code for browsers as platforms, not just JS engines.
Prefer native semantics (e.g., lazy loading via IntersectionObserver vs manual scroll handlers).
Reduce external dependencies where modern browser APIs suffice.
Document API usage and fallback patterns for maintenance and cross-browser support.
Skill for integrating Better Auth - the comprehensive TypeScript authentication framework. Use when working with better-auth / authentication related code.
Write clean, efficient TypeScript code that follows common best practices. Use when defining or using types or other TypeScript features.
Comprehensive, read-only code review skill for analyzing entire codebases or explicitly mentioned files. Use when asked to review code for logic bugs, type errors, security issues, performance problems, regressions, maintainability risks, or other user-specified focus areas. Prioritize a thorough, evidence-based report with file references and never modify code while reviewing.
Write clean, modern, and highly accessible HTML & JSX code, using semantically correct elements and attributes. Use when working on HTML / JSX code.
Build modern Next.js apps with App Router and best practices. Use when working on Next.js code or using Next.js features.
Build clean, modern React components that apply common best practices and avoid common pitfalls like unnecessary state management or useEffect usage. Use when working on React code or using React features.