Skip to content

tasks.md

Latest commit

 

History

History
50 lines (38 loc) · 2.66 KB

tasks.md

File metadata and controls

50 lines (38 loc) · 2.66 KB

Tasks - Performance + A11y Roadmap

Fase 0 - Diagnóstico y línea base

  • Medir baseline de build y bundle (npm run build).
  • Detectar deuda técnica en scripts de lint/build.
  • Identificar puntos críticos de a11y (foco, labels, feedback de copiado).
  • Agregar benchmark repetible de tamaño por release (script y umbrales).

Fase 1 - Build pipeline y dependencias

  • Corregir scripts de lint para entorno npm + ESLint 9 legacy (ESLINT_USE_FLAT_CONFIG=false).
  • Simplificar vite.config.ts removiendo rollup-plugin-typescript2 y rollup-plugin-terser.
  • Mover React a peerDependencies y limpiar deps runtime innecesarias para consumidores.
  • Agregar sideEffects para preservar CSS/SCSS y mejorar tree-shaking.
  • Corregir configuración de generación de tipos (vite-plugin-dts + tsconfig).
  • Migrar de .eslintrc a eslint.config.js (flat config) para eliminar modo legacy.
  • Ejecutar bun install para regenerar lockfile tras limpieza de dependencias.
    • Nota: confirmado por el usuario que ejecuta bun i localmente.

Fase 2 - Robustez de share links

  • Introducir utilitario encodeShareParam para codificar parámetros de URL en todos los botones de share.
  • Aplicar encoding a url, title, message, description, mediaUrl, subject, content, to.
  • Reemplazar concatenación manual por URLSearchParams para mayor mantenibilidad.
  • Añadir validación opcional para URLs inválidas y fallback seguro.

Fase 3 - Accesibilidad de interacción

  • Añadir aria-label en botones de ícono y enlaces de share.
  • Mejorar botón de copiado con aria-live + role="status".
  • Agregar fallback de clipboard cuando navigator.clipboard falla.
  • Añadir estilos :focus-visible en botones e íconos.
  • Añadir soporte prefers-reduced-motion para reducir transiciones.
  • Estandarizar aria-hidden en todos los SVG decorativos con helper único.
  • Verificar contraste WCAG AA por variante de color (is-bordered/is-whited).

Fase 4 - CSS y rendimiento visual

  • Normalizar list-style/padding del grupo de botones.
  • Mejorar estilos base de interacción (cursor, font, line-height).
  • Migrar SCSS de @import a @use/@forward (evitar deprecaciones Dart Sass).
  • Extraer tokens de foco/espaciado para evitar duplicación entre botones e íconos.

Fase 5 - Calidad y release

  • Agregar tests de comportamiento para generación de URLs por red social.
  • Agregar tests de a11y (ej. @testing-library/react + jest-axe).
  • Integrar chequeo de bundle size en CI.
  • Documentar en README los nuevos props de copiado (url, copiedLabel).