Šiame vadove sužinosite, kaip naudoti "Chrome" programuotojo įrankius tinklo ryšiams riboti, HTTP antraštėms analizuoti ir atsakymams peržiūrėti. Šios funkcijos ypač naudingos norint išbandyti svetainės veikimą skirtingomis tinklo sąlygomis ir suprasti grąžinamų duomenų struktūrą. Tinklo jungčių ribojimas leidžia imituoti naudotojo patirtį mobiliuosiuose įrenginiuose, o antraščių analizė suteikia informacijos apie galimas problemas.
Pagrindinės išvados
- Ribojimas leidžia imituoti lėtą tinklo greitį ir išbandyti naudotojų elgseną tokiomis sąlygomis.
- HTTP antraštėse pateikiama informacija apie tai, kaip duomenys grąžinami klientui.
- Kūrėjo įrankiuose esanti peržiūros funkcija leidžia lengvai išnagrinėti JSON ir kitų formatų duomenų struktūrą.
Žingsnis po žingsnio vadovas
Sušvelninkite tinklo greitį
Norėdami imituoti lėtą tinklo ryšį, atidarykite "Chrome" programuotojo įrankius ir pereikite prie skirtuko Tinklas. Ten galite pasirinkti skirtingus greičius, pavyzdžiui, "greitas 3G". Taip galėsite išbandyti savo svetainės įkrovimo laiką realiomis sąlygomis.
Pakartotinai įkeldami puslapį galite tiesiogiai pamatyti, kaip atrodo našumas naudojant šį nustatymą. Atkreipkite dėmesį, kad įkrovimo laikas yra gerokai lėtesnis nei įprastomis sąlygomis.
Jei norite, kad jis būtų dar lėtesnis, galite pasirinkti parinktį "Lėtas 3G". Čia reikia kantrybės, nes turinio įkėlimas trunka pastebimai ilgiau.
Taip pat galite įjungti funkciją "neprisijungus prie interneto". Ši parinktis ypač įdomi norint išbandyti, kaip veikia jūsų žiniatinklio programa, kai nėra interneto ryšio.
Testavimas neprisijungus prie interneto su paslaugų darbuotojais
Paslaugų darbininkai suteikia galimybę svetaines padaryti prieinamas neprisijungus prie interneto. Jei turite puslapį, kuris turėtų veikti neprisijungus prie interneto, galite patikrinti, ar atitinkamas turinys taip pat pasiekiamas neprisijungus prie interneto, suaktyvinę funkciją "offline" programuotojo įrankiuose.
Taip pat galite patikrinti, ar navigacija veikia neprisijungus ar prisijungus, pažiūrėję į langą "Navigator". Tai svarbu siekiant užtikrinti, kad jūsų programa būtų galima naudotis ir be interneto ryšio.
Darbas su antraštėmis
Norėdami patikrinti HTTP antraštes, perkraukite savo svetainę ir pažiūrėkite į grąžinamus duomenis. Skirtuke "Network" (Tinklas) galite matyti išsamią informaciją apie atsakymo antraštes, pavyzdžiui, Content-Type (Turinio tipas) ir Content-Length (Turinio ilgis).
Čia taip pat rasite informacijos apie tai, ar atitinkamam failui įjungta spartinančioji atmintinė, ar ne. Tai svarbu norint optimizuoti svetainės našumą.
Peržiūrėti JSON duomenų struktūrą
Jei gaunate atgal JSON duomenis, galite lengvai patikrinti šių duomenų peržiūrą. Kūrėjo meniu galite išskleisti ir išnagrinėti duomenų struktūrą. Duomenis matysite ne tik neapdorotame tekste, bet ir paryškintus spalvotai, o tai pagerina skaitomumą.
Didelis peržiūros privalumas yra tas, kad galite tiesiog nukopijuoti duomenis ir naudoti juos, pavyzdžiui, kodo redaktoriuje.
Darbas su paveikslėliais
Paveikslėlių duomenis taip pat galima pasiekti per programuotojo įrankius. Pavyzdžiui, jei peržiūrite SVG failus, juos galite peržiūrėti skirtuke "Peržiūra".
Kitų formatų, pavyzdžiui, PNG ar JPEG, vaizdus galite išsaugoti vietoje arba tiesiog nukopijuoti URL adresus naudodami parinktis "Copy Image URL" arba "Save Image as".
Problemų nustatymas
Ypač naudinga programuotojo įrankių funkcija - galimybė analizuoti būsenos kodus. Jei būsenos kodas grąžinamas didesnis nei 400, tai reiškia, kad iškilo problema, kurią turėtumėte toliau tirti.
Atkreipkite dėmesį į užklausos antraštes, kad nustatytumėte galimus klaidos šaltinius - autentifikavimo klaidą ar kitas problemas, kilusias įkeliant puslapį.
Suvestinė
Šiame vadove sužinojote, kaip sumažinti tinklo greitį, analizuoti HTTP antraštes ir geriau panaudoti peržiūros informaciją. Naudodamiesi šiomis priemonėmis galite dar labiau optimizuoti savo svetainės naudotojo patirtį ir nustatyti galimus klaidų šaltinius.
Dažniausiai užduodami klausimai
Kas yra "Chrome" programuotojo įrankių "Chrome Developer Tools" droseliavimas? Droseliavimas leidžia imituoti tinklo greitį ir išbandyti, kaip jūsų svetainė veikia skirtingomis sąlygomis.
Kaip programuotojo įrankiuose galima peržiūrėti HTTP antraštes? Galite naudoti skirtuką Tinklas ir, įkėlę svetainę, patikrinti grąžinamas HTTP antraštes.
Ar galiu testuoti ir neprisijungus prie interneto?Taip, galite įjungti neprisijungimo prie interneto funkciją ir patikrinti, ar jūsų svetainė veikia ir be interneto ryšio.
Kaip programuotojo įrankiuose galiu analizuoti JSON duomenis?Norėdami peržiūrėti JSON duomenų struktūrą ir pasirinktinai išskleisti subobjektus, galite naudoti peržiūros funkciją.
Ką daryti, jei grąžinamas didesnis nei 400 būsenos kodas?Patikrinkite užklausos antraštes, kad nustatytumėte klaidos priežastį, ir įsitikinkite, kad pateikta visa reikiama informacija.
