前端开发 Skill技能列表
RailsHotwire开发技能Skill rails-hotwire
此技能提供 Ruby on Rails 中 Hotwire 框架的最佳实践指南，用于构建高性能、交互式 Web 应用。涵盖 Turbo Drive、Turbo Frames、Turbo Streams、Turbo 8 形态变换和 Stimulus 控制器的使用，优化导航、部分页面更新、实时广播、错误处理和渐进增强。关键词：Rails, Hotwire, Turbo, Stimulus, 交互式应用, 实时更新, 前端优化, Web 开发, 最佳实践。
Rails设计系统指南Skill rails-design-system
此技能提供Ruby on Rails应用程序的设计系统最佳实践，专注于构建一致、可维护的用户界面。涵盖Turbo、Stimulus、ERB部分、设计令牌等关键技术，适用于前端开发和UI组件架构。关键词：Ruby on Rails, 设计系统, UI一致性, 前端开发, Turbo, Stimulus, 组件化, 视图优化。
Rails应用UI块Skill rails-application-ui-blocks
此技能专为Rails应用程序设计，用于高效选择和集成预构建的UI块到视图中，支持新页面创建和现有UI重构，确保行为一致、可访问性优化，并兼容Turbo和Stimulus框架。关键词：Rails, UI块, 视图开发, 前端集成, 可访问性, Turbo, Stimulus。
OrvalOpenAPI客户端生成Skill orval
这是一个用于从OpenAPI规范自动生成类型安全的TypeScript客户端的技能，支持React Query、SWR等查询库集成，提供自定义mutators和Mock测试功能，适用于前端开发和API消费。关键词：Orval, OpenAPI, TypeScript, 客户端生成, React Query, SWR, 自定义mutators, MSW mocks。
Knip死代码检测最佳实践Skill knip-deadcode
这个技能是关于使用 Knip 工具来检测和移除 JavaScript 和 TypeScript 项目中的未使用代码，包括配置最佳实践、CI 集成、性能优化等。关键词：Knip, 死代码检测, JavaScript, TypeScript, 代码清理, 性能优化, CI/CD, 前端开发, 代码质量。
jscodeshift代码转换最佳实践Skill jscodeshift
这个技能提供了Facebook/Meta的jscodeshift codemod开发最佳实践指南，用于自动化JavaScript/TypeScript代码的迁移、重构和转换。关键词包括：jscodeshift, AST转换, 代码迁移, 自动化重构, codemod开发, 前端工具, 代码质量提升。
谷歌JavaScript最佳实践指南Skill js-google
这个技能基于Google官方JavaScript样式指南，提供了JavaScript代码的编写、审查和重构的最佳实践。它涵盖了模块系统、语言特性、类型安全、命名约定等方面，帮助确保代码风格一致和预防常见错误。关键词：JavaScript, 代码风格, 最佳实践, Google指南, 前端开发, 编程规范, 代码审查。
FramerMotion性能优化技能Skill framer-motion
本技能提供 Framer Motion 在 React 应用中的动画性能优化综合指南，包含 42 条规则覆盖 9 个优先级类别，帮助开发者优化包大小、防止重渲染、实现高效动画，提升前端性能。关键词：Framer Motion, React 动画, 性能优化, 前端开发, 动画指南, 性能最佳实践
动画最佳实践指南Skill emilkowal-animations
这个技能提供了基于Emil Kowalski的Web界面动画最佳实践，涵盖缓和选择、定时、属性选择、变换技术、交互模式、战略动画和可访问性等关键领域。适用于React、CSS或Framer Motion开发，帮助提升动画性能、用户体验和可访问性。关键词：动画、Web开发、React、CSS、Framer Motion、性能优化、用户体验、可访问性。
Chrome扩展开发技能Skill chrome-extension
这个技能提供了Chrome扩展（Manifest V3）的性能和代码质量最佳实践指南，涵盖服务工作者生命周期、内容脚本优化、消息传递效率、存储操作、网络权限、内存管理、UI性能、API使用模式、代码风格、组件模式、错误处理和测试模式。适用于开发者编写、迁移或优化Chrome扩展代码，提升扩展性能和用户体验。关键词：Chrome扩展，Manifest V3，性能优化，代码质量，前端开发，浏览器扩展。
Chrome扩展UX/UI最佳实践Skill chrome-extension-ui
这个技能提供了Chrome浏览器扩展的用户体验和用户界面设计的最佳实践指南，涵盖组件选择、可访问性、弹出窗口、侧边栏、内容脚本UI等关键方面，优化Manifest V3兼容性，旨在帮助开发者创建高效、易用且符合规范的扩展。关键词：Chrome扩展、UX/UI设计、最佳实践、前端开发、浏览器扩展、Manifest V3、设计指南。
Zod最佳实践技能Skill zod
此技能提供Zod在TypeScript应用中的模式验证最佳实践指南，专注于类型安全、解析、错误处理等关键领域，帮助开发者高效定义和验证schema。关键词：Zod, TypeScript, schema验证, 类型安全, 解析, 错误处理, 最佳实践, 模式定义, 验证性能, 自动化重构