Creación de Pull Request y Auditorías con Github Actions
Clase 36 de 38 • Curso de Optimización Web
Contenido del curso
- 7

Entendiendo el Critical Rendering Path en Navegadores Web
11:11 - 8

Optimización de JavaScript para mejorar rendimiento web
10:53 - 9

Priorización de recursos CSS para mejorar rendimiento web
11:50 - 10

Optimización de Carga de Recursos con Preload, Prefetch y Preconnect
10:36 - 11

Optimización de Animaciones CSS para Mejorar el Renderizado
02:35
- 15

Optimización de Imágenes para Web: Formatos y Herramientas Efectivas
15:32 - 16

Optimización de Imágenes para Web: Uso de Tamaños y Formatos Adecuados
05:21 - 17

Comparación entre WebFonts y SVG: Ventajas y Desventajas
08:58 - 18

Lazy Loading de Imágenes: Técnicas y Estrategias Efectivas
10:14 - 19

Carga Adaptativa de Imágenes con Gatsby y Web API
04:13
- 20

Optimización de JavaScript para Producción Web
11:20 - 21

Análisis y Optimización de Bundles con Webpack
11:25 - 22

Optimización de Bundles en Proyectos Web con Webpack
17:14 - 23

Code Splitting con Webpack: Optimización de Bundles en Proyectos Web
06:31 - 24

Lazy Loading de Videos con JavaScript y Modales
21:44 - 25

Event Propagation y Filtrado de Eventos en JavaScript
17:24 - 26

Integración de Librerías en Proyectos JavaScript
14:58 - 27

Optimización de Carga de Modales con Lazy Loading en Webpack
13:25 - 28

Renderizado en Cliente vs. Servidor: Diferencias y Funciones
08:44 - 29

Implementación de Server Side Rendering en NodeJS
19:41 - 30

Optimización de Sitios con Static Site Generation
15:51
¿Cómo gestionar un pull request para auditar el performance en GitHub?
Al trabajar en la optimización de un proyecto, es fundamental asegurar que los cambios no afecten negativamente el rendimiento del sitio web. GitHub facilita la integración de auditorías de rendimiento, ofreciendo feedback valioso a través de sus herramientas de CI (integración continua). Aprender a gestionar un pull request eficazmente es crucial para garantizar que tu proyecto se mantenga en óptimo estado.
¿Qué pasos seguir para crear un pull request?
Antes de iniciar, asegúrate de tener tus métricas definidas y tu reporte de auditoría listo. Cuando estés listo para integrar estos cambios en tu proyecto, sigue estos pasos:
-
Realiza un commit: Asegúrate de tener un commit que contenga todos los cambios necesarios para la auditoría.
-
Sube los cambios: Utiliza
git pushpara subir tus cambios a la rama en la que estás trabajando. Si estás en una situación académica, y únicamente por fines didácticos, podrías necesitar usarpush forcesi tienes conflictos de subidas anteriores, pero esto no es recomendable en situaciones reales. -
Navega en GitHub: Ve a la pestaña de pull request en GitHub y crea uno nuevo desde la base
masterhacia el branch activo, en este caso,optimización audit. -
Crea y nombra tu pull request: Establece un nombre descriptivo para el pull request, por ejemplo, "In test Lighthouse CI with GitHub Actions".
¿Qué beneficio aporta el uso de actions para auditar?
Una vez creado el pull request, podrás verificar el rendimiento del proyecto mediante la pestaña "Checks". Esto te permitirá confirmar que los cambios son positivos:
-
Ejecución de auditoría: GitHub ejecutará una serie de checks, incluyendo el cálculo de rendimiento mediante Lighthouse.
-
Feedback instantáneo: Recibirás retroalimentación inmediata dependiendo de si las métricas cumplen o fallan con el presupuesto estimado. Una x indicará un fallo, alertándote de posibles regresiones.
-
Acceso a artefactos de resultados: Si has activado la opción de
upload artefacts, puedes descargar un archivo comprimido (ZIP) con los informes en formato HTML y JSON, como se generaría manualmente desde la terminal.
¿Cómo interpretar los artefactos generados por Lighthouse?
Cuando descargas el ZIP de artefactos generado, obtendrás detalles muy valiosos sobre el estado de tu proyecto:
-
HTML y JSON: Los informes te ofrecen una visión clara de las áreas que cumplen o necesitan mejora.
-
Comparaciones entre URLs: Puedes ver resultados de auditorías de diferentes URLs si has realizado múltiples pruebas.
Estos pasos te facilitarán la revisión y te proporcionarán un marco para prevenir regresiones futuras, manteniendo siempre un ojo en el rendimiento del proyecto.
¿Qué precauciones debes tener al trabajar con auditorías?
El proceso de auditoría y CI en GitHub no solo optimiza el rendimiento, sino que previene la entrada de regresiones mediante alertas anticipadas. Es un método preventivo crucial que te asegurará que los cambios futuros no comprometan tu sitio web. Además, siempre es importante:
-
No usar force push salvo en casos académicos: Hacerlo puede sobrescribir cambios esenciales realizados por otros colaboradores, lo que podría causar conflictos.
-
Revisar con regularidad los resultados de las auditorías: Esto asegura que estés siempre al tanto de cómo los cambios impactan a tu proyecto.
Con todo esto conocimiento, seguir perfeccionando tus habilidades en herramientas de CI y auditorías será un gran aliado en tu camino de desarrollo profesional. ¡Sigue adelante y no dejes de aprender!