前端开发 Skill技能列表
注册组件模式Skill registry-component-patterns
该技能涉及在shadcn/ui框架中注册和管理8位风格的前端组件,包括定义组件和块的注册模式、管理依赖关系、设置分类等,适用于游戏UI和复古主题的前端开发。关键词:shadcn/ui, 8位组件, 组件注册, 前端开发, 游戏UI。
JavaScripttoSorted不可变数组排序Skill js-tosorted-immutable
这个技能是关于在JavaScript中使用toSorted()方法进行数组排序而不突变原始数组,特别适用于React应用,以确保数据不可变性。关键词包括:JavaScript, toSorted, 不可变性, 数组排序, React, 前端开发, 数组突变避免。
Set和Map高效查找优化Skill js-set-map-lookups
该技能用于在JavaScript或TypeScript中优化代码性能,通过使用Set和Map数据结构实现O(1)时间复杂度的成员查找,替代低效的数组includes方法,适用于高频查找场景,提升应用程序响应速度和效率。关键词:Set Map O(1) 查找 优化 JavaScript TypeScript 性能提升
正则表达式性能优化Skill js-hoist-regexp
这个技能用于优化前端React应用中的正则表达式使用,通过将RegExp创建提升到模块作用域或使用React的useMemo钩子进行记忆化,避免在每次渲染或函数调用时重复创建,从而提高性能并减少内存开销。关键词:React性能优化, 正则表达式提升, useMemo记忆化, 前端开发技巧, JavaScript最佳实践。
JavaScript早期退出优化技巧Skill js-early-exit
JavaScript早期退出技巧用于在编码中尽早从函数或循环返回,以避免执行不必要的计算,从而提高代码性能和效率。适用于数据处理、输入验证、条件判断等场景。关键词:JavaScript,早期返回,代码优化,性能优化,函数设计。
shadcn/ui组件注册集成技能Skill fumadocs-registry-integration
这个技能用于将 8-bit 风格的 UI 组件集成到 shadcn/ui 组件库中,通过更新 registry.json 文件,使开发者能使用命令行工具快速添加和管理组件。它包括创建组件文件、更新注册表、管理依赖和样式文件,适用于前端开发和组件库集成。关键词:shadcn/ui, 8-bit 组件, 前端开发, 组件注册, 集成, 代码管理, 样式文件。
FumadocsMDX结构指南Skill fumadocs-mdx-structure
该技能用于创建和管理Fumadocs平台的MDX文档文件,包括前置元数据设置、组件导入、安装命令生成和代码示例编写,适用于前端开发中的8-bit组件文档化工作。关键词:MDX文档、前端开发、组件集成、Fumadocs、8-bit组件、文档结构。
8-bit组件文档编写Skill fumadocs-component-docs
该技能用于为 8-bit 风格组件创建和维护结构化文档,包括组件预览、使用示例、属性表格和导入指南,旨在提高前端组件库的文档质量和用户体验。关键词:8-bit 组件、文档编写、前端开发、组件库、SEO 优化。
组件包装架构Skill component-wrapper-architecture
这个技能用于在React项目中包装现有的shadcn/ui组件,以添加8位复古风格,同时确保向后兼容性和代码重用。关键词包括:组件包装、8位风格、shadcn/ui、React、TypeScript、前端开发、复古UI。
动态导入懒加载技术Skill bundle-dynamic-imports
这个技能涉及使用 Next.js 框架的 `next/dynamic` 功能实现组件懒加载,以优化网页性能和用户体验。适用于在初始渲染时不需要的大型组件,如代码编辑器、图表、富文本编辑器等。通过动态导入,可以减少初始加载时间,提升应用响应速度。关键词:动态导入、懒加载、Next.js、前端优化、性能提升、组件加载、代码分割。
前端导入优化技巧Skill bundle-barrel-imports
这个技能用于通过避免使用桶文件导入来优化前端项目的捆绑大小和性能。它能减少不必要的模块加载,提高开发启动速度、构建效率和冷启动性能,适用于使用React等现代前端框架时的库导入优化。关键词:前端优化、捆绑大小、导入优化、性能提升、barrel files。
复古动画性能优化Skill animation-performance-retro
此技能用于优化复古风格的动画性能,特别针对像素艺术、游戏UI效果和类似界面,通过使用CSS变换、GPU加速、步进动画等技术,确保动画流畅渲染和高效性能。关键词:动画优化、像素艺术、游戏UI、硬件加速、CSS、加载状态、条件动画、前端开发。