Debuggeando caché y networking

Éste curso salió precisamente después que tomé los de optimización Web y debuggin con Chrome DevTools y la verdad ya estaba un poco “cansado” de ver el NetWork en inspeccionar, pero creo que es más necesario de lo que pensaba. El “pan de cada día” en esto del FrontEnd. Así que hay que aprender a amarlo.

😲😲😱😨🙀🙀

😂🤣

Ctrl + F5

“para re carga fuerte”

Quiero decir que el profesor de manera equivocada filtró su API key en el 7:12, haciendo hover en la peticion list…

En algunos poryectos me ha tocado implementar esta libreria https://axios-cache-interceptor.js.org/#/, excelente para manejar memoization de peticiones ya desde el código.

Una cosa bastante útil que sale en el Curso de manipulación del DOM es la técnica del Lazy loading, la cual consiste en llamar a la API solo cuando estemos sobre la imagen y no desde antes, así podemos tener una carga más rápida de las imágenes y nuestra aplicación corre de la misma forma.

Aqui les dejo el link de la API que estamos utilizando, primero deben de tener una cuenta con ellos para que les pueda dar la API_KEY. https://www.themoviedb.org/settings/api

Para profundizar en Network está esta clase del profe Diego

Muy interesante lo de la caché.

Mientras estudiaba en la universidad tenia que hacer unos ejercicios de JavaScript, no funcionaba bien aunque el código estaba perfecto, pasaron muchas horas hasta que el profe me dijo que presionara CTRL +F5 para recargar borrando el caché y se arreglo. Lo digo por si alguien alguna vez ha tenido un problema similar para que lo tengan en cuenta! A veces el caché juega malas pasadas

Yo utilizo Mozilla Firefox, y las herramientas de desarrollo tambien son muy buenas, practicamente las mismas que tiene Google Chrome.

No se si sea un ejemplo válido en cual se aplica el tema del caché, pero recuerdo que en el Curso Profesional de Python hay un apartado sobre la carpeta pycache que lo que hace es que se guarda nuestro código ya ejecutado , para que en una segunda ejecución al sin algún cambio en el código, este no sea interpretado y conviertido a bytecode de nuevo, si no que lo cargue ya directamente ayudandonos a que se ejecute más rápido

Pueden consultarlo en este link: ¿Cómo funciona Python?

Interesante, no sabía la funcionalidad de Network, increíble…otra visión del mundo.

Oww, en mi caso particular no se están guargando en caché todas mis solicitudes a la api.
·
En mi proyecto, además de conectarme a la API de TheMovieDB, también estoy usando una API traductor para tener en español las categorías y las descripciones de las películas, y precisamente estas últimas solicitudes a la API Traductor no se están guargando en caché (y por tanto sin importar si recargo la página o no, siempre tardan unos segunditos en cargar).
·
Pero bueno, creo que eso ya es más debido al hecho de que, en el caso de la API Traductor, las solicutdes que hago para que me traduzca las categorías y las descripciones de las películas son de tipo POST (en vez de las de tipo GET de TheMovieDB), y estas últimas no las guarda en caché a pesar de que en realidad siempre traduce el mismo texto.