Main menu

Cómo bloquear la carga de recursos con Chrome

Seguro que más de una vez te has preguntado cómo se comportará una web cuando una hoja de estilo, un script o cualquier otro recurso no se carga correctamente. Ya no tienes que esperar a quedarte sin Internet para verlo, te explicamos cómo simularlo en Chrome.

Desde que se lanzó la versión 59 del navegador Chrome, tenemos a nuestra disposición una nueva característica llamada Block Request URL la cual nos permite bloquear de manera manual cualquiera de los recursos que se cargan al abrir una web y ver cómo le afecta.

Veamos cómo llevarlo a cabo usando el blog de Endeos como ejemplo.

Bloquear la carga de recursos con las DevTools de Chrome

Abre las herramientas para desarrolladores de Chrome y accede al panel Network.

Chrome Pestaña Network

 

A continuación haz clic derecho en uno de los recursos, por ejemplo template.css y clica sobre Block request URL.

Chrome Block Request URL

 

Se abrirá una pestaña en la parte inferior de las DevTools desde la que podrás ver qué recursos hay bloqueados así como desbloquearlos para que vuelvan a su estado normal.

Bloquear URL Chrome

 

Otra función interesante es la posibilidad de crear un patrón usando comodines (un wildcard pattern) para bloquear varios recursos con facilidad.

Por ejemplo, podríamos impedir la carga de todos los ficheros CSS añadiendo el patrón *.css.

Clica sobre el símbolo + y pruébalo.

Bloquear todos los CSS

 

Vuelve a cargar la página y verás los efectos devastadores de tus bloqueos. Te aparecerá en rojo todos los elementos que no se cargan debido al bloqueo.

Bloquear la carga de recursos

 

Ya ves con qué facilidad puedes bloquear la carga de cualquier tipo de fichero con esta actualización de Chrome, antes lo hacíamos con AdBlock ¿te acuerdas? ¿Qué método prefieres tú?

Si aún no te ha quedado claro, seguro que con este vídeo no te quedan dudas.

Compartir en redes sociales

Si este artículo te ha sido de ayuda o te parece interesante, ayúdanos a difundirlo.

Compartir en Facebook Compartir en Twitter Compartir en Google+ Compartir en Linkedin
factory_shortcodes_assets:
a:0:{}

Al usar este sitio acepta el uso de cookies para análisis y contenido personalizado. Leer más

ACEPTAR
Aviso de cookies