En la sexta clase del curso de desarrollo de PWA con WordPress vamos a ver cómo podemos optimizar el theme de nuestro WordPress para PWA.
En esta lección vamos a continuar utilizando nuestro WordPress con el plugin base PWA desarrollado por Google. La idea es que podamos ver cómo modificar el comportamiento de nuestro theme cuando utilicemos el modo offline de la PWA y podamos ajustar el contenido que se visualiza en los diferentes escenarios.
Finalmente vamos a realizar una serie de comprobaciones y modificaciones en nuestro theme para probar qué ocurre cuando accedemos a nuestra PWA sin conexión a Internet y qué ocurre cuando activamos/desactivamos la caché del plugin PWA. ¡A ello!
¡Así de fácil! Ya sabemos cómo podemos modificar el fichero offline y algunos trucos de optimización para nuestro theme.
Es importante que recordemos que si estamos utilizando nuestro WordPress en un servidor local y no remoto tenemos que apagar el software que estemos utilizando para poder ver el modo offline funcionando, es decir, si estáis utilizando Apache, Nginx o una solución que los contiene, tenéis que apagar dicho servicio para poder probar el funcionamiento de manera local.
También destacar los consejos y teoría sobre cacheado de assets que hemos visto y cómo funcionan realmente dentro del ámbito PWA. Tenéis que pensar que diseñar un theme para PWA no es diferente a diseñar pensando en responsive y mobile first dado que en ambos sistema de diseño debemos priorizar siempre que podamos la optimización de los recursos: imágenes, ficheros CSS y Javascript.
Como deberes os animo a que investiguéis más sobre cómo podéis optimizar el theme de vuestro WordPress instalando plugins que os permitan optimizar la carga de assets de vuestro site para que posteriormente la PWA pueda aprovechar esa optimización.
Que no se os olvide que si tenéis cualquier duda o comentario podéis escribirnos a través del panel de soporte y os atenderemos :)
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