Output Console / Network — nuevos filtros de dominios y deslizadores exponenciales
La pestaña Network de la Output Console pasó por su mayor reconstrucción desde su lanzamiento, en mayo de 2026. Nuevos campos de filtro de dominios que aceptan varias entradas a la vez, Alt+clic para añadir uno al instante, deslizadores de tamaño y tiempo que por fin tienen granularidad fina en el extremo bajo, columnas redimensionables en DataLayer y URLs largas más legibles. Aquí tienes un recorrido completo por los cambios desde v2.13.193 hasta v2.13.205.
«Dominios+» y «Dominios-» — varios dominios a la vez (v2.13.199)
El antiguo filtro de dominios aceptaba un único valor. En la práctica monitorizas varios servicios a la vez — analítica + imágenes + una API. Ahora hay dos campos uno al lado del otro en la fila de estado:
- «Dominios+» — una lista de dominios que quieres ver. Una entrada pasa si coincide con alguno de ellos.
- «Dominios-» — una lista de dominios que excluir. Una entrada que coincida con cualquiera de ellos desaparece.
En ambos campos escribes varios dominios separados por una barra vertical |, por ejemplo cdn.example.com|api.example.com|images.example.com. El filtro se aplica en vivo, sin necesidad de confirmar.
Alt+clic — añade un dominio directamente desde una fila de Network (v2.13.200)
En vez de escribir el dominio a mano, haz clic en una fila de Network con un modificador:
- Alt+clic — añade (o quita) el dominio de la entrada al campo «Dominios+».
- Alt+Mayús+clic — añade (o quita) el dominio al campo «Dominios-».
La primera versión del atajo estaba en Ctrl (v2.13.199), pero Ctrl+clic en macOS lo captura el sistema como menú contextual — el clic nunca llegaba al listener. Alt+clic funciona igual en Windows, Linux y macOS y no colisiona con ningún atajo nativo de ellos. El atajo actúa como conmutador: otro Alt+clic sobre el mismo dominio lo elimina.
Deslizadores de tamaño y tiempo — escala exponencial + campos de entrada (v2.13.198)
Los deslizadores antiguos eran lineales, así que un paso del cursor izquierdo equivalía a ~16 kB o ~1000 ms — moverlos del cero ya recortaba la mitad de las entradas. Ahora tienes:
- Una escala exponencial (curva
^3) — la parte inferior del recorrido cubre valores pequeños con granularidad fina (kB / ms por paso), y la parte superior cubre rangos amplios. Lo que normalmente te interesa (respuestas pequeñas, peticiones rápidas) queda justo bajo tu dedo. - Un hueco mínimo más pequeño entre los cursores — juntarlos cerca del extremo inferior de la escala da un rango diminuto en lugar de, por ejemplo, «0–112 kB».
- Campos de entrada a cada lado del recorrido — escribe mín. y máx. manualmente (en kB / ms). El campo y el deslizador están sincronizados: mueves el deslizador y los campos se actualizan; escribes un valor y el deslizador salta.
Entradas sin tamaño — ocultas al mover el filtro (v2.13.197)
Algunas respuestas de Network no tienen la cabecera content-length (streaming, chunked). Antes, esas entradas ignoraban el filtro de tamaño y se mostraban siempre, lo que resultaba raro al mover el deslizador («creo que la había filtrado pero esta sigue ahí»). Ahora: un deslizador de tamaño movido también oculta las entradas sin tamaño declarado. El comportamiento por defecto (deslizador en rango completo) no cambia.
Acortado de URL largas — solo en la fila colapsada (v2.13.195)
Una query string larga podía ocupar toda la ventana de Network. Ahora en la fila colapsada (pestañas Network y All) la URL se acorta a 255 caracteres. Expándela con la flecha (▸/▾) y verás la URL completa sin truncar — los detalles siempre completos. Los saltos de línea en cualquier punto (tokens largos, URLs) evitan que el contenido se desborde más allá del ancho de la ventana.
Columnas redimensionables en DataLayer + tipografía coherente (v2.13.194 + v2.13.196)
La pestaña DataLayer tiene dos columnas: «Nuevos pushes» y «instantánea de window.dataLayer». La línea central entre ambas es ahora un divisor arrastrable — la proporción se mantiene durante la sesión por ventana de Output. La reconstrucción continua de la lista de la instantánea de página ya no desencaja las columnas durante el arrastre (la reconstrucción se pausa mientras se arrastra).
El otro pequeño arreglo fue la tipografía del panel derecho de DataLayer: el árbol de window.dataLayer hereda ahora el tamaño de fuente del panel Output Console (una regla !important anterior bloqueaba el cambio).
Caso de uso 1 — triaje de rendimiento solo de peticiones críticas
Aterrizas en la página de un cliente y quieres ver solo las peticiones críticas — sin píxeles de tracking, sin imágenes. «Dominios-» recibe google-analytics.com|googletagmanager.com|hotjar.com|facebook.net; el deslizador de tiempo baja a 500 ms, el de tamaño a 50 kB. Te quedan solo las peticiones más lentas y pesadas, y normalmente ya sabes cuál es la que provoca la queja.
Caso de uso 2 — depuración de tracking, solo tu analítica
El escenario opuesto: quieres solo las peticiones de tracking. «Dominios+» = google-analytics.com|googletagmanager.com|cloudflareinsights.com. Todo lo demás en Network desaparece de la vista, y el panel dataLayer a su lado muestra el estado actual. El contador de la pestaña sigue mostrando cuántas peticiones se han disparado en total, así que puedes ver qué porcentaje del tráfico es tracking.
Véase también
- Output Console — la ventana donde vive la pestaña Network
- Atajos de teclado de JustZix — la chuleta completa — incluido Alt+clic / Alt+Mayús+clic
- Ventanas en la página — ventanas de desarrollo dentro de la página
Instala JustZix — y ten un monitor Network de nivel DevTools en cada pestaña.
Valora este artículo
Sin valoraciones — sé el primero.