En la décima y última clase del curso de desarrollo de PWA con WordPress vamos a ver cómo podemos testear y auditar nuestra PWA a través de una serie de herramientas.
En esta lección vamos a testear y auditar nuestro WordPress PWA gracias a una serie de recomendaciones que podemos seguir en la documentación del plugin además de las herramientas de Google.
Finalmente veremos la herramienta de Google para generar auditorías de nuestras aplicaciones, que podemos encontrar en las Chrome Devtools además de poder instalarla en formato extensión en nuestro navegador Google Chrome. ¡Empecemos!
¡Así de fácil! Ya veis que para poder testear y auditar nuestra PWA para conseguir un correcto funcionamiento podemos optar por utilizar las herramientas que Google pone a nuestra disposición.
Gracias a esta herramienta podremos realizar un testing completo de la aplicación en cuanto rendimiento, carga de caché, funcionamiento de los service workers, SEO, accesibilidad y más. Cuando la herramienta termine de analizar la aplicación generará un reporte con una serie de puntuaciones además de una serie de informes detallados para que podamos comprobar si ha ido todo bien o si debemos ajustar nuestro proyecto.
Si queréis ampliar más, en su documentación podemos ver una serie de artículos que nos explican cómo podemos probar las PWA en diferentes navegadores en función del sistema operativo y dispositivo. Es interesante porque además nos especifican a partir de qué versión del navegador funcionan completamente las PWA.
A través de las Chrome Devtools como podemos revisar el manifest, los service worker activados con posibilidad de ver la información que carga cada página y la caché de la página y lo que se almacena en ella. Una vez revisemos esta parte veremos que Chrome nos ofrece una herramienta muy sencilla para comprobar nuestros themes responsive en diferentes tamaños simulando ver la página en un dispositivo móvil.
Ahora como deberes os animo a que investiguéis más a fondo las correcciones que la auditoría de lighthouse os propone. Pensad que durante todo el curso hemos utilizado el theme básico de WordPress pero en el momento que utilicéis vuestros propios themes o themes comprados/descargados, la puntuación no tiene por qué ser la correcta.
Así que sería interesante que le echéis un vistazo a vuestros proyectos finales página a página, al menos las más importantes para validar el funcionamiento. Como siempre, si tenéis cualquier duda o pregunta, podéis mandarla a través del formulario de soporte de la intranet de suscriptor.
Y hasta aquí esta lección, y el curso. Espero que haya sido de utilidad y de vuestro agrado. Nos vemos en la siguiente clase del siguiente curso, sea el que sea. ¡Hasta entonces!
Todos los capítulos de este curso:
- Curso de PWA para WordPress #1. ¿Que es PWA?
- Curso de PWA para WordPress #2. Funcionamiento y características de una PWA
- Curso de PWA para WordPress #3. Estructura y configuración del app manifest
- Curso de PWA para WordPress #4. Toma de contacto: Hello world PWA
- Curso de PWA para WordPress #5. Usando WordPress como PWA
- Curso de PWA para WordPress #6. Optimizando el theme de WordPress para PWA
- Curso de PWA para WordPress #7. Plugins para convertir WordPress en PWA
- Curso de PWA para WordPress #8. Configurando nuestro WordPress PWA
- Curso de PWA para WordPress #9. Notificaciones push
- Curso de PWA para WordPress #10. Testeando nuestra PWA