Tip Google Chrome: Refresco de la caché

Cuando estamos trabajando en la parte de Front end es muy habitual la necesidad de limpiar la caché del navegador. Chrome dentro de sus Developer Tools podemos habilitar la primera opción Disable cache (while DevTools is open):

Disable-cache-Chrome-Developer-Tools

Sin embargo, en las versiones más recientes del navegador se nos ofrece la posibilidad de seleccionar el tipo de recarga que necesitamos a través del botón disponible al lado de la barra de direcciones.

tip

¿Cómo lo activamos?

En Windows basta con abrir las Developer Tools (F12) y hacer clic con el botón derecho sobre el botón de recarga de la página (o mantener pulsado el botón izquierdo).

A partir de este momento se abrirá el menú con las opciones mostradas en la captura anterior. Cada una de ellas corresponde con lo siguiente:

Normal Reload
Realiza la misma acción que si pulsáramos F5, es decir, utilizará la caché cada vez que sea posible, evitando de este modo la recarga de archivos JavaScript, imágenes, estilos, etcétera.
Hard Reload
No usará nada de la caché cuando se realice la petición. Forzará al navegador a recuperar los archivos nuevamente.
Empty Cache and Hard Reload
En este caso directamente vacía la caché, por lo que estará forzando a realizarse un Hard reload.

Lo cierto es que nos facilita el trabajo reduciendo los pasos para algo muy utilizado en el día a día 😀

Espero que sea de utilidad.

¡Saludos!