image-optimization
✓Orientación de expertos sobre optimización de imágenes para el rendimiento web. Úselo cuando trabaje con formatos de imagen (WebP, AVIF, JPEG, PNG, GIF, SVG, HEIC, JPEG XL), configuraciones de compresión, imágenes responsivas, carga diferida, CDN, Core Web Vitals o cualquier tarea de desarrollo web relacionada con imágenes. Cubre la selección de formato, configuración de calidad, srcset/sizes, elemento de imagen, dirección de arte, fetchpriority, estrategias de marcador de posición (LQIP, Blur-up, Blurhash), consultas de contenedores, HDR/amplia gama de colores, herramientas de imágenes impulsadas por IA, procesamiento perimetral/sin servidor y optimización del rendimiento.
SKILL.md
| Photos | AVIF | WebP → JPEG | | Graphics/logos with transparency | SVG | WebP → PNG | | Photos with transparency | WebP | PNG | | Animations | WebP | GIF (or MP4 for long animations) | | Icons | SVG | WebP → PNG | | Screenshots | WebP | PNG |
| JPEG | 75-85 | 80 is sweet spot for photos | | WebP | 75-85 | More efficient than JPEG at same quality | | AVIF | 60-75 | Much more efficient, use lower numbers | | PNG | N/A | Lossless, optimize with tools like oxipng |
Standard widths: 320, 480, 768, 1024, 1366, 1600, 1920, 2560
Orientación de expertos sobre optimización de imágenes para el rendimiento web. Úselo cuando trabaje con formatos de imagen (WebP, AVIF, JPEG, PNG, GIF, SVG, HEIC, JPEG XL), configuraciones de compresión, imágenes responsivas, carga diferida, CDN, Core Web Vitals o cualquier tarea de desarrollo web relacionada con imágenes. Cubre la selección de formato, configuración de calidad, srcset/sizes, elemento de imagen, dirección de arte, fetchpriority, estrategias de marcador de posición (LQIP, Blur-up, Blurhash), consultas de contenedores, HDR/amplia gama de colores, herramientas de imágenes impulsadas por IA, procesamiento perimetral/sin servidor y optimización del rendimiento. Fuente: igorvaryvoda/image-optimization-skill.
Datos (listos para citar)
Campos y comandos estables para citas de IA/búsqueda.
- Comando de instalación
npx skills add https://github.com/igorvaryvoda/image-optimization-skill --skill image-optimization- Categoría
- </>Desarrollo
- Verificado
- ✓
- Primera vez visto
- 2026-02-01
- Actualizado
- 2026-02-18
Respuestas rápidas
¿Qué es image-optimization?
Orientación de expertos sobre optimización de imágenes para el rendimiento web. Úselo cuando trabaje con formatos de imagen (WebP, AVIF, JPEG, PNG, GIF, SVG, HEIC, JPEG XL), configuraciones de compresión, imágenes responsivas, carga diferida, CDN, Core Web Vitals o cualquier tarea de desarrollo web relacionada con imágenes. Cubre la selección de formato, configuración de calidad, srcset/sizes, elemento de imagen, dirección de arte, fetchpriority, estrategias de marcador de posición (LQIP, Blur-up, Blurhash), consultas de contenedores, HDR/amplia gama de colores, herramientas de imágenes impulsadas por IA, procesamiento perimetral/sin servidor y optimización del rendimiento. Fuente: igorvaryvoda/image-optimization-skill.
¿Cómo instalo image-optimization?
Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/igorvaryvoda/image-optimization-skill --skill image-optimization Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code o Cursor
¿Dónde está el repositorio de origen?
https://github.com/igorvaryvoda/image-optimization-skill
Detalles
- Categoría
- </>Desarrollo
- Fuente
- skills.sh
- Primera vez visto
- 2026-02-01