Poboljšanja F12 alatki za programere u programu Internet Explorer 11

Promene korisničkog interfejsa F12

Nove ikone i obaveštenja Ikone za alatke "Memorija" i "Profiler" su promenjene.

Sada postoje indikatori na traci sa ikonama za greške u konzoli, promene u postavkama emulacije i za aktivne sesije profilisanja u alatkama za odziv memorije, profilera i korisničkog interfejsa. Sledeća slika prikazuje nove ikone sa obaveštenjima na ikonama alatke "Konzola" i "Memorija", koja ukazuje na to da postoje dve prikazane greške konzole i da je sesija profilisanja memorije u toku:

F6 superskup navigacija u okviru alatkiKopiranje F6 je kao korišćenje tastera Tab za kretanje po alatki, ali "kartice" se "kreću" kroz izabrani skup najčešće korišćenih elemenata u oknu sa alatkama, a ne kroz svaku stavku koju je moguće izabrati. Ovo je deo celokupnog čistijeg sistema za korišćenje tastature za kretanje unutar i između alatki.

Premeštanje unapred i nazad između nedavno korišćenih alatki pomoću tastatureMožete da koristite Kombinaciju tastera Ctrl + [ da biste se kretali unazad u istoriji navigacije alatki i CTRL + ] za kretanje unapred, slično strelicama unazad i unapred prilikom pregledanja.

Brzi pristup režimu dokumenta Nova padajuća lista se dodaje na vrh interfejsa koji vam omogućava da pristupite režimu dokumenta iz bilo koje alatke, tako da ne morate da menjate alatke.

Promene konzole

Console.timeStamp()Kada se poziva sa konzole ili u okviru koda, console.timeStamp() izlazi na konzolu Broj milisekuund koji je trenutna kartica pregledača otvorena. Ako se poziva prilikom pokretanja sesije profilisanja pomoću alatke za odziv korisničkog interfejsa, kreira oznaku korisnika na vremenskoj osi sesije zajedno sa vremenskom oznakom zasnovanom na vremenu od početka sesije.

Ctrl + L čisti konzolu svih poruka

Precizno automatsko dovršavanjeTe automatsko dovršavanje konzole više ne uključuje svojstva indeksera. To daje čistiji i precizniji izbor predloga za automatsko dovršavanje.

$, $$, $x, $0-$5 i $_ dodati su na listu automatskog dovršavanja konzole radi lakšeg dovršavanja i da bi ponašanje konzole bilo usaglašenije sa drugim pregledačima.

Indikator zausivljene porukeAko ste odabrali da isključite opciju "Obriši pri navigaciji", starije poruke konzole su zasivljene svojim ikonama kako bi se lakše razlikovalo od poruka za aktivnu stranicu i poruka od prethodnih stranica u istoriji.

Promene u istraživaču DOM

Promena traka u oknu "Izračunato" Trake za promenu (različite boje za promenjena svojstva, dodata svojstva i izbrisana svojstva) koje su korisnici uživali u oknu Stilovi sada se pojavljuju u oknu Izračunati stilovi.

Promene modula za otklanjanje grešaka

Oznaka mapa izvoraOdaberite karticu dokumenta u modulu za otklanjanje grešaka i možete da navedete izvornu mapu. To omogućava korišćenje izvornih mapa zajedno sa isporučenim kodom koji je uklonio komentar izvorne mape.

Automatsko dovršavanje u programu WatchesNow, prilikom dodavanja sata predlaže se opcija automatskog dovršavanja.

Inspekcija povratne vrednostiKada raskidate funkciju sa povratnom vrednošću, pređite u funkciju dok ne pređete na zatvorenu zagradu. Povratna vrednost će biti prikazana u odeljku Lokalni standardi okna Praćenja. Ponovo korak i vrednost će biti vraćena na kôd koji ga je pozvao.

Za brzu demonstraciju isprobajte ovaj kôd u konzoli:

function showval() { var x = 0; x++; debugger; return x; } showval(); 

Ona će pozvati funkciju, prelomiti grešku u otklanjanju grešaka i moći ćete da uđete u funkciju da biste videli povratnu vrednost.

Multi-select for breakpointsCtrl + click, Shift + click, and Ctrl + A can be used to select multiple breakpoints in the Breakpoints pane.

Nastavite i zanemarite prelome Pritisnite taster F5 da biste prešli na sledeći prelom. Držite taster F5 da biste nastavili sa više preloma dok ne otpustite taster F5.

Tačke prekida događaja i tačke praćenja Ovo funkcioniše slično tačkama prekida i tačkama praćenja koje su već prisutne u F12 alatkama, ali umesto da se aktiviraju kada se izvrši određeni blok koda, one se pokreću kada se pokrene određeni događaj. Svaki ima opcionalni uslovni filter koji će vam pomoći da suzite njihov opseg na određenu instancu događaja koji želite da ispitate. Možete ih dodati pomoću ikona Dodaj tačku praćenja događaja i Dodaj ikone tačke prekida događaja markirane na sledećoj slici:

Promene alatke za odziv korisničkog interfejsa

Sesije performansi uvoza/izvozaPomoću slučaja testiranja ne treba da reprodukujte svaki put kada želite da analizirate podatke koje proizvodi ili delite te podatke sa kolegom. Ikone uvoza (fascikle) i izvoza (diska) na traci sa ikonama alatke za odziv korisnika korisničkog interfejsa omogućavaju vam da sačuvate snimke memorije u datoteku koja se kasnije može uvesti.

Pregled slikeAko ste videli HTTP zahtev za sliku i zapitali se koja je slika, slika se sada pregleda u detaljima o događaju.

Filtriranje događaja Dugme "Filtriraj događaje" je malo, ali moćno. Skriven iza tog dugmeta nalazi se meni koji vam omogućava da filtrirate događaje na više načina i svaki način ima značajan uticaj:

• Filter imena događaja: Filtrirajte bilo koje ime događaja koje sadrži podudaranje za tekst filtera.

• Filter aktivnosti korisničkog interfejsa: Pomoću polja za potvrdu možete da isključite velike kategorije događaja da biste olakšali fokusiranje na oblast koju istražujete. Na primer, ako vas zanima samo mrežna aktivnost, možete da filtrirate celokupnu buku korisničkog interfejsa i kolekcije smeća.

• Filter vremenske granične vrednosti: Ova funkcija filtrira događaje najvišeg nivoa manje od jedne milisekunde tokom trajanja. U mnogim scenarijima, ovo drastično pojednostavljuje prikaz vodopada i pomaže vam da se fokusirate na efektnije događaje.
  

Događaji izvršavanja HTML5 skriptiAko koristite slušaoce upita medija ili mutationObserver, sada možete da identifikujete njihove odgovarajuće troškove kada pokrenete sesiju profilisanja performansi.

Grupisanje okvira Dugme između padajuće liste Sortiraj po i menija Filtriraj događaje preklopnik grupisanje okvira. Ovo grupiše događaje najvišeg nivoa u odgovarajuću jedinicu rada (ili "okvir") tokom vremenskog perioda u kojima su se pojavljivale animacije ili vizuelne ispravke. Okviri se tretiraju kao drugi događaji, tako da mogu da se sortiraju i filtriraju i pružaju inkluzivni rezime vremena.

Mere korisnikaAko koristite API performance.mark() da biste dodali trouglove na vremensku osu kako biste naznačili gde se određeni događaji dešavali, API performance.measure() proširuje korisnost oznaka performansi. Koristite performance.measure() da biste kreirali događaj mere korisnika koji obuhvaćuje vreme između dva događaja performance.mark(), zatim kliknite desnim tasterom miša na događaj, a zatim koristite opciju Filter za događaj da biste izabrali samo događaje između dve oznake.

Bojenje za DOMOva funkcija dodaje boje DOM elementima, literalima niske i literalima brojeva. Osim što će sadržaj u okviru različitih F12 alatki izgledati i ponašati se više slično, on alatki za odziv korisničkog interfejsa dodaje više vizuelne privlačnosti.

Rezime selekcijeKad izaberete deo vremenske ose, okno Sa detaljima o događaju će prikazati rezime izbora. Zadržite pokazivač iznad različitih segmenata kružnog grafikona za opis alatke sa kategorijom događaja segmenta.

Podrška za console.timeStamp()Korišćenje metoda console.timeStamp() u kodu ili u konzoli tokom sesije profilisanja kreira oznaku korisnika na vremenskoj osi koja ima vreme od početka sesije profilisanja.

Promene alatke za memoriju

Dominator foldingDominator presavijanje pomaže u pojednostavljivanju sadržaja snimka uklanjanjem objekata iz prikaza najvišeg nivoa koji su logički komponente drugog objekta (na primer, <BR> u okviru <DIV>, opsega koji funkcija čuva) i obično su dodatni detalji koji ne poboljšavaju uvid u podatke, Ali bi moglo da vam oduћi vreme. 

Na primer, sledeća slika se prikazuje pre i posle prikaza, pokazujući kako dominatorski presavijanje poboljšava "priču" koju alatka govori. Presavijeni prikaz prikazuje 30 HTML <DIV> elemenata, koji navode 15,64 megabajta (MB) memorije i koji se drže za odvajane DOM čvorove. U mnogim slučajevima nije važno da znate sastav objekta, već samo da znate da je prevelik ili da cure (naročito kada koristite biblioteke nezavisnih proizvođača).

Bojenje DOM- a, niske & Literali brojevaOva funkcija dodaje boju DOM elementima, literalima niski i literalima brojeva. Pored toga što čini da sadržaj u okviru različitih F12 alatki izgleda i ponaša se više slično, to analizu memorije čini vizuelno interesantnijom.

Ciklus korena filtriranjeSant da biste mogli da istražite sastav objekta a da se ne zaboravite da se izgubite u kružnoj referentnoj putanji? Ova funkcija otkriva podređene reference koje su kružne i "skraćuju" ih kako vas ne bi zbunili tako što ćete ih preneti u beskonačno. Pored toga, ona komentariše ove reference tako da je jasno kada je referenca "skraćena".

Sesija uvoza/izvoza Ne bi trebalo da reprodukujte predmet testiranja svaki put kada želite da analizirate podatke koje proizvodi ili delite te podatke sa kolegom. Ikone uvoza (fascikle) i izvoza (diska) na traci sa ikonama alatke "Memorija" omogućavaju vam da sačuvate snimke memorije u datoteku koja se kasnije može uvesti.

Promene alatke za emulaciju

Ikona postavke postojanosti i uspostavljanje početnih vrednosti Ikona postavki trajne emulacije dodaje se u alatku za emulaciju. Ovo će održavati trenutne postavke emulacije dok se posebno ne onemogući. To vam omogućava da radite, zatvorite pregledač, a zatim se vratite sa netaknute postavke emulacije. Sa desne strane ove ikone nalazi se ikona "Uspostavi početne vrednosti postavki emulacije", koja brzo vraća alatku na podrazumevane vrednosti.