前端开发 Skill技能列表
VercelReact最佳实践Skill vercel-react-best-practices
这个技能提供React和Next.js应用程序的性能优化最佳实践指南，由Vercel维护。它包含57条规则，分为8个优先级类别，帮助开发者在编写、审查或重构代码时确保高性能模式。关键词包括React性能优化、Next.js优化、数据获取、包大小、重新渲染控制、服务器端性能、客户端性能、JavaScript优化。
Vue组合式APISkill vue-composition-api
Vue组合式API是Vue 3框架的核心功能，用于通过组合式函数构建响应式、可维护和可复用的前端应用程序。它提供ref、reactive、computed、watch等核心特性，支持更好的代码组织、逻辑复用和TypeScript集成，适用于现代Vue开发，提高开发效率和代码质量。关键词：Vue 3, Composition API, 前端开发, 响应式编程, TypeScript, 组件化开发, 可复用逻辑, 生命周期钩子, 状态管理。
ReactContext模式Skill react-context-patterns
React Context模式是一种用于在React应用中共享状态和管理全局数据的技术，有效避免prop drilling，提升组件复用性和应用性能。适用于前端开发中的状态管理、认证、主题切换、通知系统、模态框管理、表单处理等场景。关键词：React, Context, 状态管理, 前端开发, 组件通信, 性能优化, TypeScript, 全局状态, prop drilling避免。
国际化与本地化Skill i18n-localization
该技能专注于软件的国际化和本地化实现，包括管理多语言翻译、处理区域文件、支持从右到左布局等，确保应用适应全球市场。关键词：国际化、本地化、翻译管理、多语言支持、RTL、前端开发、后端开发。
Zustand存储模式Skill zustand-store-patterns
这个技能是关于使用Zustand进行React状态管理的存储模式，用于优化应用性能和组织代码结构，包括存储定义、选择器、动作分离、性能优化等。关键词：Zustand, React, 状态管理, 存储模式, 前端开发, 性能优化。
前端组件模式Skill frontend-component-patterns
前端组件模式技能专注于使用设计模式如复合组件、渲染属性、自定义钩子和高阶组件来构建可重用、可组合和可维护的React、Vue、Angular组件。适用于创建组件库、实现组件组合、设计直观的组件API、管理状态模式等场景，以提高前端开发效率和代码质量。关键词：前端开发、React、Vue、Angular、组件设计、设计模式、可重用组件、组件架构。
Vue响应性系统Skill vue-reactivity-system
Vue响应性系统是Vue.js框架的核心部分，基于JavaScript Proxies实现数据响应式更新，包括ref、reactive、computed、watch等API，用于前端开发中的状态管理、性能优化和复杂数据流处理，关键词包括Vue、响应性、ref、reactive、computed、watch、状态管理、前端开发。
算法艺术生成Skill algorithmic-art
这个技能专注于使用p5.js创建算法艺术，通过种子随机性和交互式参数探索生成独特的视觉作品。它涉及计算美学、噪声函数、粒子系统和流动场，允许用户调整参数并探索无限的艺术变体。关键词：算法艺术、生成艺术、p5.js、交互式参数、种子随机性、计算美学。
JSON-UI报告渲染器Skill json-ui
JSON-UI 是一个强大的 JSON 到 HTML 报告渲染器，支持 React 组件和双语国际化。它允许开发者通过定义 JSON 结构快速生成美观、交互式的学术或数据报告网页。核心功能包括组件化架构、Zod 模式验证、静态 HTML 输出、React 组件库以及无缝的中英文语言切换。适用于学术论文展示、数据分析报告、自动化文档生成等场景。关键词：JSON渲染，HTML报告，React组件，双语国际化，i18n，学术报告，数据可视化，前端开发工具。
React最佳实践指南Skill react-best-practices
这是一份关于 React 框架性能优化与开发最佳实践的权威指南。它系统性地总结了来自官方文档和一线工程团队的经验，涵盖代码审查、性能调试、打包优化、副作用管理、状态设计等核心场景。关键词包括：React 性能优化、重渲染、代码分割、useEffect 最佳实践、状态管理、React 编译器、SSR、不可变更新、前端开发。
Context7高效文档获取器Skill context7-efficient
Context7高效文档获取器是一款专为开发者设计的智能文档检索工具，通过创新的shell管道过滤技术实现高达86.8%的令牌节省。该工具能够智能获取JavaScript、Python、Go、Rust等主流编程语言的库文档、API参考、代码示例和最佳实践。核心功能包括智能库解析、代码示例提取、API签名过滤和概念解释，特别适用于React hooks查询、Next.js路由语法、Prisma使用模式等框架学习场景。主要关键词：文档获取、令牌优化、代码示例、API参考、开发工具、智能过滤、MCP技术、编程学习、框架文档、效率提升。
原子设计：夸克Skill atomic-design-quarks
原子设计：夸克技能专注于使用原子设计方法论中的夸克级别来构建和维护设计系统的基础。它包括定义和管理设计令牌（如颜色、间距、字体大小、阴影等原始值），并将它们导出为CSS自定义属性，以实现样式一致性和主题支持。此技能适用于前端开发中的设计系统建设，确保可维护性和可扩展性，适用于创建可主题化的组件库、大型代码库一致性维护以及多品牌应用开发。关键词：原子设计、夸克、设计令牌、CSS变量、前端开发、设计系统、样式一致性、主题化。