Ahora puede navegar directamente a los componentes de su aplicaci\u00f3n agrupando los archivos creados\/implementados<\/strong> en el panel de origen .<\/strong> Vaya a Fuente > Men\u00fa de 3 puntos > Agrupar por autor\/implementado<\/strong>. Ahora, cuando abre los archivos, solo puede ver sus archivos implementados en el panel.<\/p>\n En versiones anteriores de Chrome, todos los archivos de c\u00f3digo fuente estaban visibles en el panel de navegaci\u00f3n<\/strong>, lo que dificultaba encontrar un solo archivo.<\/p>\n Puede restringir su b\u00fasqueda en el panel de origen a solo archivos relevantes. En versiones anteriores de Chrome, los archivos generados por el marco y otros terceros aparec\u00edan en los resultados de b\u00fasqueda, lo que dificultaba la identificaci\u00f3n del elemento de b\u00fasqueda.<\/p>\n Esta actualizaci\u00f3n es la versi\u00f3n de devtools para optimizar su b\u00fasqueda en navegadores web con las hojas de trucos de b\u00fasqueda de Google.<\/a> Para configurar esta configuraci\u00f3n, vaya al men\u00fa de 3 puntos > Ocultar fuentes de la lista de ignorados<\/strong>.<\/p>\n \u00bfScripts de terceros que llenan su consola? Chrome 106 agreg\u00f3 una extensi\u00f3n de lista de ignorados en el mapa de origen para permitirle ocultar scripts generados autom\u00e1ticamente por marcos y otros terceros.<\/p>\n Para activar esta funci\u00f3n, vaya a Configuraci\u00f3n > Lista de ignorados > Agregar autom\u00e1ticamente scripts de terceros conocidos<\/strong> a la lista de ignorados. Cuando vuelva a abrir los archivos, la consola mostrar\u00e1 solo los archivos relevantes asociados con su aplicaci\u00f3n. Ahora puede ver su c\u00f3digo sin distracciones.<\/p>\n Tardar\u00e1 menos en identificar un error en la consola, gracias a una nueva funci\u00f3n en Chrome 106. Las herramientas para desarrolladores de Chrome le brindan una vista detallada de las operaciones asincr\u00f3nicas y sus causas principales. En versiones anteriores, solo eran visibles los eventos que dieron lugar a la operaci\u00f3n. Las \u00faltimas herramientas de desarrollo muestran toda la cadena de operaciones y sus causas principales.<\/p>\n Google ha configurado un m\u00e9todo console.createTask()<\/strong> en Chrome 106. Este m\u00e9todo permite que los marcos realicen seguimientos de pila en la consola. Depurar JavaScript usando devtools es tan f\u00e1cil como depurar CSS usando Chrome.<\/a><\/p>\n Realice un seguimiento de las nuevas interacciones en el panel Rendimiento<\/strong> para identificar posibles problemas de capacidad de respuesta a su aplicaci\u00f3n. En Chrome 106, todas las interacciones se muestran en la pista Interacciones despu\u00e9s de una operaci\u00f3n. La pista muestra el origen de las interacciones y sus ID. El seguimiento ayuda a identificar la fuente e interceptarla en consecuencia.<\/p>\n![\"Google](\"https:\/\/howto.mediadoma.com\/wp-content\/uploads\/2022\/10\/post-167698-633f729228408.jpg\")
<\/a><\/p>\n2 B\u00fasqueda de archivos simplificada<\/h2>\n
<\/a><\/p>\n3 Ocultar scripts de terceros<\/h2>\n
<\/a><\/p>\n4 seguimientos de pila detallados<\/h2>\n
<\/a><\/p>\n5 Interacciones de pistas en el panel de rendimiento<\/h2>\n