React Best Practices
ryokun6/ryos
React performance optimization guidelines from Vercel Engineering (vercel-labs/agent-skills).
Vite performance optimization guidelines. An agent skill from pproenca/dot-skills.
$ npx skills add pproenca/dot-skills --skill vite -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install pproenca/dot-skills vite --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/.experimental/vite .claude/skills/vite && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "vite" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/vite into .claude/skills/vite/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vite", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/viteType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add pproenca/dot-skills --skill vite -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install pproenca/dot-skills vite --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/.experimental/vite .agents/skills/vite && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "vite" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/vite into .agents/skills/vite/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vite", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add pproenca/dot-skills --skill vite -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install pproenca/dot-skills vite --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/.experimental/vite .cursor/skills/vite && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "vite" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/vite into .cursor/skills/vite/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vite", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/pproenca/dot-skills.git --path skills/.experimental/vite--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add pproenca/dot-skills --skill vite -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install pproenca/dot-skills vite --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/.experimental/vite .gemini/skills/vite && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "vite" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/vite into .gemini/skills/vite/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vite", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install pproenca/dot-skills viteInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add pproenca/dot-skills --skill vite -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/.experimental/vite .github/skills/vite && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "vite" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/vite into .github/skills/vite/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vite", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add pproenca/dot-skills --skill vite -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install pproenca/dot-skills vite --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/.experimental/vite .opencode/skills/vite && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "vite" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/vite into .opencode/skills/vite/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vite", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
viteVite performance optimization guidelines. An agent skill from pproenca/dot-skills.
Vite is an agent skill from pproenca/dot-skills. Vite performance optimization guidelines. This skill should be used when writing, reviewing, or refactoring Vite configuration and projects to ensure optimal performance patterns. Triggers on tasks involving Vite config, build optimization, dependency pre-bundling, plugin development, bundle analysis, or HMR issues.
Its SKILL.md is about 1.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 50 other files, including reference files and assets (for example `AGENTS.md`, `README.md` and `assets/templates/_template.md`).
It sits in Development, covering Hooks and plugins, Performance optimization and Refactoring. It works with Vite. The repository describes itself as: A collection of AI agent skills following the Agent Skills open format. The licence is MIT.
8 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit cf93c57. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Vite loads about 1.6k tokens when it runs, and up to ~17k if it reads all its reference files. Until then it costs about 81 tokens; SKILL.md has 453 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from pproenca/dot-skills at commit cf93c57, republished under its MIT licence (© pproenca). 453 words, ~1,615 tokens.
.claude/skills/vite/SKILL.md (or your agent's skills folder). This skill also uses 47 other files; get the full folder from GitHub.Comprehensive performance optimization guide for Vite applications. Contains 42 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.
Reference these guidelines when:
| Priority | Category | Impact | Prefix |
|---|---|---|---|
| 1 | Dependency Pre-bundling | CRITICAL | deps- |
| 2 | Plugin Performance | CRITICAL | plugin- |
| 3 | Bundle Optimization | CRITICAL | bundle- |
| 4 | Import Resolution | HIGH | import- |
| 5 | Build Configuration | HIGH | build- |
| 6 | Development Server | MEDIUM-HIGH | dev- |
| 7 | CSS Optimization | MEDIUM | css- |
| 8 | Advanced Patterns | LOW-MEDIUM | advanced- |
deps-include-large-cjs - Include large dependencies with many modulesdeps-exclude-esm - Exclude small ESM dependenciesdeps-force-rebundle - Use --force flag for dependency changesdeps-hold-until-crawl - Configure holdUntilCrawlEnd for startup behaviordeps-entries - Configure custom entry points for discoverydeps-linked-packages - Handle linked dependencies in monoreposplugin-lazy-imports - Use dynamic imports in plugin codeplugin-avoid-long-hooks - Avoid long operations in startup hooksplugin-transform-early-return - Early return in transform hooksplugin-audit-community - Audit community plugins for performanceplugin-swc-over-babel - Use SWC instead of Babel for Reactbundle-manual-chunks - Use manualChunks for vendor splittingbundle-dynamic-imports - Use dynamic imports for route-level splittingbundle-analyze - Analyze bundle compositionbundle-tree-shaking - Enable effective tree-shakingbundle-chunk-warning - Address large chunk warningsbundle-compression - Disable compressed size reporting for large projectsbundle-asset-inlining - Configure asset inlining thresholdimport-avoid-barrel - Avoid barrel file importsimport-explicit-extensions - Use explicit file extensionsimport-path-aliases - Configure path aliases for clean importsimport-svg-strings - Import SVGs as strings instead of componentsimport-glob-patterns - Use glob imports carefullybuild-modern-target - Target modern browsersbuild-minification - Use esbuild for minificationbuild-sourcemaps - Disable source maps in productionbuild-css-code-split - Enable CSS code splittingbuild-rolldown - Consider Rolldown for faster buildsbuild-output-dir - Configure output directory and cachingdev-server-warmup - Warm up frequently used filesdev-browser-cache - Keep browser cache enabled in DevToolsdev-fs-limits - Increase file descriptor limits on Linuxdev-wsl-polling - Use polling for WSL file watchingdev-https-proxy - Configure HTTPS and proxy for developmentcss-lightning - Use Lightning CSS instead of PostCSScss-avoid-preprocessors - Prefer CSS over preprocessors when possiblecss-modules - Use CSS Modules for component stylescss-inline-critical - Extract critical CSS for initial paintadvanced-ssr-externalize - Externalize dependencies for SSRadvanced-env-static - Use static environment variablesadvanced-profiling - Profile build performanceadvanced-lib-mode - Configure library mode for package developmentRead individual reference files for detailed explanations and code examples:
| File | Description |
|---|---|
| AGENTS.md | Complete compiled guide with all rules |
| references/_sections.md | Category definitions and ordering |
| assets/templates/_template.md | Template for new rules |
| metadata.json | Version and reference information |
© pproenca, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 47 other files (references, assets) in skills/.experimental/vite of pproenca/dot-skills.
Open the folder on GitHubat commit cf93c57
Vite next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Vite this skillpproenca/dot-skills | 214 | — | ~1.6k | Automated safety check: Pass | MIT | |
| React Best Practicesryokun6/ryos | 1.3k | — | ~2k | Automated safety check: Pass | MIT | |
| Svelte5 Best PracticesSikandarJODD/cnblocks | 430 | 1 repos | ~810 | Automated safety check: Pass | MIT | |
| React Best Practicesshapeshift/web | 206 | 1 repos | ~2k | Automated safety check: Pass | MIT | |
| Performance ProfilingLiberatedPixelCup/Universal-LPC-Spritesheet-Character-Generator | 1.8k | — | ~1.8k | Automated safety check: Pass | GPL-3.0 | |
| Nuxt Best Practicesvinayakkulkarni/nxui | 212 | — | ~1.5k | Automated safety check: Pass | MIT |
ryokun6/ryos
React performance optimization guidelines from Vercel Engineering (vercel-labs/agent-skills).
SikandarJODD/cnblocks
Svelte 5 runes, snippets, SvelteKit patterns, and modern best practices for TypeScript and component development.
shapeshift/web
Comprehensive React and Next.js performance optimization guide with 40+ rules for eliminating waterfalls, optimizing bundles, and improving rendering.
LiberatedPixelCup/Universal-LPC-Spritesheet-Character-Generator
Run the headless app, catalog-load, and ZIP profilers and interpret the JSON the way a human would from window.profiler.report(), profile:load, and the ZIP console table.
vinayakkulkarni/nxui
Nuxt 4 performance optimization and architecture guidelines (current through Nuxt 4.5) for building fast, maintainable full-stack applications.
supabitapp/supaterm
Diagnose data races, convert callback-based code to async/await, implement actor isolation patterns, resolve Sendable conformance issues, and guide Swift 6 migration.
pproenca/dot-skills
Audio forensics and voice recovery guidelines for CSI-level audio analysis.
pproenca/dot-skills
Guided, scripted pipeline for running JSX/TSX/React codemods safely across large legacy codebases.
pproenca/dot-skills
Create well-structured RFCs and technical proposals for software projects.
pproenca/dot-skills
Developer-experience friction auditing and fixing — slow onboarding, repeated manual setup steps, missing bootstrap/reset/seed scripts, undiscoverable conventions.
pproenca/dot-skills
Turn a rough idea for a language into a complete, implementable specification — a DSL, query, config/data, template, or protocol language — by interviewing the author dimension by dimension until…
pproenca/dot-skills
Drafting Python Enhancement Proposals (PEPs) — proposing a Python language feature, a standard library change, an interoperability standard, or an informational/process document for the Python…
Works with
Categories
Vite performance optimization guidelines. An agent skill from pproenca/dot-skills. Vite is an agent skill from pproenca/dot-skills. Vite performance optimization guidelines.
Vite fits situations like: tasks involving Vite config; build optimization; dependency pre-bundling; plugin development.
Run `npx skills add pproenca/dot-skills --skill vite -a claude-code`. Or copy the skill folder (skills/.experimental/vite in pproenca/dot-skills) into .claude/skills/vite in your project. Claude Code loads it when a task matches its description.
Run `npx skills add pproenca/dot-skills --skill vite -a codex`. Or copy the skill folder (skills/.experimental/vite in pproenca/dot-skills) into .agents/skills/vite in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add pproenca/dot-skills --skill vite -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/vite, .gemini/skills/vite, .github/skills/vite and .opencode/skills/vite in your project.
SKILL.md names no scripts, command-line tools or credentials: Vite is instructions for the agent only.
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Vite is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 1.6k tokens (SKILL.md is roughly 6.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 16k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with Vite: React Best Practices (ryokun6/ryos, 1.3k stars), Svelte5 Best Practices (SikandarJODD/cnblocks, 430 stars), React Best Practices (shapeshift/web, 206 stars) and Performance Profiling (LiberatedPixelCup/Universal-LPC-Spritesheet-Character-Generator, 1.8k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
pproenca (a GitHub user) maintains it in pproenca/dot-skills, which has 214 GitHub stars. The repository holds 182 skills in this directory. The repository was last updated on August 15, 2026.
Source: pproenca/dot-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.