Kokius įrankius ir skirtukus naudoji Chrome DevTools, norint derinti ir analizuoti tinklalapius?

Norint derinti ir analizuoti interneto puslapius Chrome DevTools, paprastai naudoju šias korteles:

• Elements — norėdami peržiūrėti ir keisti DOM struktūrą ir CSS stilius realiu laiku.
• Console — norėdami rodyti žurnalus, vykdyti JavaScript kodą ir aptikti klaidas.
• Network — norėdami analizuoti tinklo užklausas, patikrinti išteklių įkėlimą, atsako laikus ir būsenas.
• Sources — norėdami derinti JavaScript kodą, nustatyti sustojimo taškus ir žingsnis po žingsnio vykdyti.
• Performance — norėdami profiliuoti puslapio našumą, analizuoti įkėlimo ir atvaizdavimo laikus.
• Application — norėdami dirbti su vietine saugykla, slapukais, IndexedDB ir talpykla.
• Security — norėdami patikrinti ryšio ir sertifikatų saugumą.

Pavyzdys: jei puslapis ilgai kraunasi, atidarau Network skirtuką, rūšiuoju užklausas pagal laiką ir žiūriu, kurie ištekliai lėtina įkėlimą.