Du kan nu navigera direkt till dina programkomponenter genom att gruppera filer p\u00e5 authored\/deployed<\/strong> p\u00e5 k\u00e4llpanelen<\/strong>. G\u00e5 till K\u00e4lla > 3-punktsmeny > Gruppera efter f\u00f6rfattare\/distribuerade<\/strong>. Nu n\u00e4r du \u00f6ppnar filerna kan du bara se dina distribuerade filer p\u00e5 panelen.<\/p>\n I tidigare Chrome-versioner var alla k\u00e4llkodsfiler synliga i navigeringspanelen<\/strong>, vilket gjorde det sv\u00e5rt att hitta en enda fil.<\/p>\n Du kan begr\u00e4nsa din s\u00f6kning p\u00e5 k\u00e4llpanelen till endast relevanta filer. I tidigare versioner av Chrome visades filer som genererats av ramverket och andra tredje parter i s\u00f6kresultaten, vilket gjorde det sv\u00e5rt att identifiera s\u00f6kobjektet.<\/p>\n Den h\u00e4r uppdateringen \u00e4r devtools-versionen f\u00f6r att optimera din s\u00f6kning i webbl\u00e4sare med Googles s\u00f6kfuskblad.<\/a> F\u00f6r att konfigurera den h\u00e4r inst\u00e4llningen, g\u00e5 till menyn med tre punkter > D\u00f6lj k\u00e4llor<\/strong> i ignoreringslistan .<\/p>\n Tredjepartsskript fyller upp din konsol? Chrome 106 lade till ett ignoreringslistatill\u00e4gg i k\u00e4llkartan f\u00f6r att du ska kunna d\u00f6lja skript som genereras automatiskt av ramverk och andra tredje parter.<\/p>\n F\u00f6r att aktivera den h\u00e4r funktionen, g\u00e5 till Inst\u00e4llningar > Ignorera lista > L\u00e4gg automatiskt till k\u00e4nda tredjepartsskript<\/strong> till ignoreringslistan. N\u00e4r du \u00f6ppnar filerna igen visar konsolen endast relevanta filer som \u00e4r kopplade till din applikation. Du kan nu se din kod utan distraktion.<\/p>\n Du kommer att ta kortare tid att identifiera ett fel p\u00e5 konsolen, tack vare en ny funktion p\u00e5 Chrome 106. Chrome Developer-verktyg ger dig en detaljerad bild av asynkrona operationer och deras grundorsaker. I tidigare versioner var endast de h\u00e4ndelser som ledde till operationen synliga. De senaste devTools visar hela kedjan av operationer och deras grundorsaker.<\/p>\n Google har konfigurerat en console.createTask()-<\/strong> metod i Chrome 106. Denna metod g\u00f6r det m\u00f6jligt f\u00f6r ramverk att utf\u00f6ra stacksp\u00e5rningar p\u00e5 konsolen. Att fels\u00f6ka JavaScript med hj\u00e4lp av devtools \u00e4r lika enkelt som att fels\u00f6ka CSS med chrome.<\/a><\/p>\n Sp\u00e5ra nya interaktioner i prestandapanelen<\/strong> f\u00f6r att identifiera potentiella svarsproblem f\u00f6r din applikation. I Chrome 106 visas alla interaktioner i interaktionssp\u00e5ret efter en operation. Sp\u00e5ret visar k\u00e4llan till interaktionerna och deras ID. Sp\u00e5rning hj\u00e4lper till att identifiera k\u00e4llan och f\u00e5nga upp den d\u00e4refter.<\/p>\n![\"Google](\"https:\/\/howto.mediadoma.com\/wp-content\/uploads\/2022\/10\/post-167698-633f729228408.jpg\")
<\/a><\/p>\n2 F\u00f6renklad fils\u00f6kning<\/h2>\n
<\/a><\/p>\n3 D\u00f6lj skript fr\u00e5n tredje part<\/h2>\n
<\/a><\/p>\n4 Detaljerade stacksp\u00e5r<\/h2>\n
<\/a><\/p>\n5 Sp\u00e5ra interaktioner i prestandapanelen<\/h2>\n