Šiame vadove paaiškinsiu, kaip naudodamas Chrome Developer Tools Application skirtuką gali ištirti tinklalapio programų išteklius. Ypatingas dėmesys skiriamas įvairiems saugojimo variantams, tokkiems kaip Vietinis saugojimas, Sesijos saugojimas ir IndexedDB. Taip pat bus aptartas duomenų valdymas, saugojimas naudojant paslaugų darbuotoją, bei Slapukų valdymas. Optimizuodamas atminties valdymą, užtikrinsi, kad tavo programų sistema veiktų efektyviau.
Svarbiausios išvados
- Application skirtukas yra pagrindinis įrankis analizuojant ir optimizuojant tavo programų sistemą.
- Gali tiesiogiai naršykleje ištirti manifestavimo failą, paslaugų darbuotoją, saugojimo pasirinkimus ir slapukus.
- Šių saugojimo pasirinkimų išvalymas ir atstatymas gali padėti derinant klaidų paiešką ir našumo optimizavimą.
Žingsnis po žingsnio vadovas
Prieiga prie Application skirtuko
Norėdamas atidaryti Application skirtuką, eik į savo puslapį ir paspausk F12 klavišą arba spustelėk dešinįjį pelės klavišą ir pasirink "Tirti kodą". Developer Tools meniuje rasysi "Application" skirtuką, kuriame rasysi apžvalgą apie skirtingus išteklius, kuriuos tavo programų sistema naudoja.
Manifestavimo tyrimas
Application skirtuke patikrink skiltį "Manifest". Čia matysi savo programos manifestavimo failą ir pateiktą informaciją, tokiai kaip piktogramos, pavadinimai ir aprašymai, ir patikrink, ar tie duomenys yra teisingi. Tai ypač svarbu kuriantis progresyvias programas (PWA).
Paslaugų darbuotojo naudojimas
Kita žingsnis yra paslaugų darbuotojų tyrimas. Šie darbuotojai yra svarbūs tavo programų sistemos offline veikimui. Spausk "Paslaugų darbuotojai" skiltį, kad pamatytum užregistruotus paslaugų darbuotojus ir ištirtum jų funkcionalumus, tokius kaip pranešimai dėl atnaujinimo ar synchronizacija.
Testuoti offline funkcionalumą
Svarbus žingsnis yra testavimas offline režime. Gali įjungti offline režimą ir perkrauti puslapį, kad pamatytum, kaip jis elgiasi. Gerai sukurta programa turi veikti ir siųsti atitinkamus pranešimus, kai yra neprisijungusi prie interneto.
Saugojimo analizė
Dabar pereik į "Saugojimas" sritį. Čia rasysi apžvalgą apie talpyklą, Vietinį saugojimą, Sesijų saugojimą ir IndexedDB. Šie saugojimo variantai atlieka svarbų vaidmenį, kai reikia saugoti duomenis tarp skirtingų apsilankymų ar seansų.
Išvalyti saugomus duomenis
Gali išvalyti visus saugomus duomenis, pažymėdamas atitinkamus langelius ir pasirinkęs "Valyti svetainės duomenis". Tai gali padėti spręsti problemas, kurias sukelia seni ar klaidingi duomenys.
Darbas su Vietiniu saugojimu
Dabar nueik į Vietinio saugojimo sritį ir įrašyk kai kuriuos duomenis. Gali naudoti localStorage.setItem('raktas', 'reikšmė'); konsolėje, norėdamas sukurti naują įrašą, ir tuomet atnaujinti Vietinio saugojimo sritį, kad pamatytum pakeitimus.
Reikšmių keitimas Vietiniame saugojime
Šioje srityje taip pat gali tiesiogiai keisti reikšmes. Dukart spustelėk reikšmę, kad ją redaguotum. Atkreipk dėmesį, kad tekstas gali būti suvedamas JSON formatu, suteikiant galimybę saugoti sudėtingesnius duomenis.
Sesijos saugojimo naudojimas
Sesijos saugojimas yra panašus į Vietinį saugojimą, tačiau yra asmeninis ir ištrinamas, kai uždaromas skirtukas ar naršyklė. Gali išbandyti tai, pridėdamas kai kuriuos duomenis ir tikrindamas juos savo seanso metu.
Slapukų tyrimas
Paspauskite „Slapukai“, kad pamatytumėte savo internetinės aplikacijos domeną ir peržiūrėtumėte nustatytus slapukus. Galite patikrinti šių slapukų reikšmes, juos pakeisti ar net ištrinti. Tai ypač svarbu, jei turite problemų su naudotojo sesijomis ar autentifikacija.
Talpyklos saugyklos apžvalga
Talpyklos saugykla suteikia jums informaciją apie visus jūsų aplikacijos naudojamus talpykloje laikomus failus. Tai padeda suprasti, kurie failai yra prieinami neprisijungus prie interneto ar kurie galbūt turėtų būti atnaujinti.
Pagalbinių paslaugų naudojimas
Jei jūsų internetinė aplikacija naudoja funkcijas kaip pranešimai ar fono sinchronizacija, šias galite rasti skiltyje „Pagalbinės paslaugos“. Tai ypač svarbu kuriant PWAs, nes jos naudoja šias funkcijas siekdamos pagerinti naudotojo patirtį.
Cadrų ir iCadrų analizė
Jei jūsų internetinėje aplikacijoje naudojate iCadrus arba Cadrų rėmus, skiltyje „Cadrų“ galite patikrinti įkeltų išteklių sąrašą. Čia galite pamatyti, kurie failai yra įkelti iCadrų arba ar kiltų problemų.
Santrauka
Šiame vadove išmokote, kaip naudoti skirtingas „Application Tabs“ funkcijas „Chrome Developer Tools“. Gavote informaciją apie manifestą, tarnybų darbuotojų naudojimą, skirtingas saugyklos parinktis bei valdymą, kaip tvarkyti slapukus. Nuolat analizuodami ir optimizuodami šiuos išteklius, galite iš esmės pagerinti savo internetinės aplikacijos veikimą.
Daugiausia užduodamų klausimų
Kaip prieiti prie Application Tab?Paspauskite F12 arba kairiuoju pelės mygtuku spustelėkite puslapį ir pasirinkite „Tirti“.
Kokia skirtumas tarp Lokaliosios saugyklos ir Sesijos saugyklos?Lokalioji saugykla ilgalaikai saugo duomenis, tuo tarpu Sesijos saugykla yra galiojanti tik prisijungusioje naršyklės sesijoje.
Kaip ištrinti slapukus per Application Tab?Eikite į skiltį „Slapukai“, pasirinkite domeną, tada galėsite peržiūrėti ir ištrinti slapukus.
Kaip patikrinti savo internetinės aplikacijos neprisijungimo funkcionalumą?Aktyvinkite neprisijungimo režimą skirtuke „Tinklas“ ir perkraukite puslapį, kad patikrintumėte jo neprisijungimo funkcionalumą.
Kas yra paslaugų darbuotojas?Paslaugų darbuotojas yra skriptas, kurį naršyklė įdiegia fone ir kuris kontroliuoja tinklo užklausas siekiant leisti neprisijungimą ir talpinimą.
