← Bumalik sa mga Features
Free

Local Storage Editor

Nagbibigay ang Local Storage Editor ng malinis na interface ng talahanayan para sa pamamahala ng mga entry ng localStorage at sessionStorage para sa kasalukuyang site. I-browse ang lahat ng key-value pair, i-edit ang mga value nang inline, magdagdag ng bagong entry, at tanggalin ang mga hindi na kailangan. Ang mga JSON value ay awtomatikong natutukoy at naformat para sa madaling pagbabasa. Lumipat sa pagitan ng mga tab ng localStorage at sessionStorage para pamahalaan ang parehong uri ng storage.

Nagtatago ang mga web application ng napakaraming state sa localStorage at sessionStorage — mga kagustuhan ng user, authentication token, feature flag, assignment ng A/B test, nilalaman ng shopping cart, draft ng form, naka-cache na API response, at UI state. Ang pag-debug ng mga value na ito sa Chrome DevTools ay nangangailangan ng pag-navigate sa Application tab, paghahanap sa seksyon ng Storage, at paggamit ng pangunahing key-value viewer na may limitadong kakayahan sa pag-edit. Dinadala ng Local Storage Editor ito sa isang espesyal na ginawang panel na may tabbed na paglipat ng storage, inline na pag-edit, JSON auto-formatting, at bulk na operasyon. Ipinapakita ng talahanayan ang bawat key-value pair na may pangalan ng key at value. Ang mga JSON value (na napaka-karaniwan — mga object na na-serialize gamit ang JSON.stringify) ay awtomatikong natutukoy at ipinapakita nang may tamang pag-format at syntax highlighting. I-click ang anumang value para i-edit ito nang in place — ang mga pagbabago ay isinusulat sa storage API kaagad. Magdagdag ng bagong entry gamit ang malinis na form, o tanggalin ang mga entry nang isa-isa o nang sabay-sabay.

Live na Preview
example.com
localStorage (6) sessionStorage (2) + Add Entry
KeyValue
ds_license_keyPRO-XXXX-XXXX
themedark
user_prefs{"lang":"en","notifications":true,"sidebar":"collapsed"}
last_visited2026-04-08T10:30:00Z
cart_items[{"id":1,"qty":2},{"id":5,"qty":1}]
onboardingcompleted
Click any value to edit · JSON values are auto-formatted
Mga Pangunahing Tampok

Tabbed na Paglipat ng Storage

Lumipat sa pagitan ng localStorage at sessionStorage gamit ang mga tab button sa tuktok ng panel. Ipinapakita ng bawat tab ang bilang ng entry (hal., "localStorage (12)" / "sessionStorage (3)"). Parehong uri ng storage ay pinamamahalaan mula sa isang interface.

Inline na Pag-edit ng Value

I-click ang anumang value cell para i-edit ito nang in place. Para sa simpleng value, i-type ang bagong string. Para sa mga JSON value, nagpapalawak ang editor sa isang formatted na textarea na may syntax highlighting. Ang mga pagbabago ay naitsave sa storage API kaagad.

JSON Auto-Detection at Formatting

Ang mga JSON value (mga object at array na na-serialize gamit ang JSON.stringify) ay awtomatikong natutukoy at ipinapakita nang may tamang indentation at syntax highlighting. I-edit ang formatted na JSON nang direkta — ito ay muli-se-serialize kapag na-save mo.

Magdagdag ng Bagong Entry

I-click ang "Add Entry" para lumikha ng bagong key-value pair. Ilagay ang pangalan ng key at value (string o JSON). Ang entry ay agad na isinusulat sa localStorage o sessionStorage para sa kasalukuyang domain.

Indibidwal at Bulk na Pagtanggal

Tanggalin ang mga indibidwal na entry gamit ang delete button ng row, o gamitin ang "Clear All" para alisin ang bawat entry para sa kasalukuyang uri ng storage. Kapaki-pakinabang para sa pag-reset ng estado ng application habang nagsu-subukan.

Real-Time na Pagtatampok

Ang mga pagbabagong ginawa sa editor ay agad na makikita sa application. Kung nagbabasa ang app ng value mula sa localStorage sa pakikipag-ugnayan ng user, ang pag-edit ng value na iyon sa panel ay nagbabago ng babasahin ng app sa susunod — hindi na kailangan ng page reload para sa karamihan ng kaso.

Mga Karaniwang Kaso ng Paggamit

Pag-debug ng Estado ng Application

Suriin kung anong mga value ang naimbak ng iyong application sa localStorage. Naroroon ba ang auth token? Tama ba ang istraktura ng user preference object? Nagiging sanhi ba ng hindi inaasahang gawi ang lumang naka-cache na value?

Pag-reset ng Estado ng Application

I-clear ang lahat ng localStorage para i-reset ang application sa paunang estado nito — kapaki-pakinabang para sa pagsu-subukan ng mga karanasan sa unang pagtakbo, onboarding flow, at mga default na configuration nang hindi kina-clear ang data ng browser para sa ibang site.

Pagsu-subukan ng mga Feature Flag

Maraming application ang nag-iimbak ng mga feature flag value sa localStorage. I-edit ang mga ito nang direkta para paganahin o huwag paganahin ang mga feature nang hindi dumadaan sa UI ng pamamahala ng flag o muling dina-deploy.

Pagsimula ng Iba't Ibang Estado ng User

I-edit ang mga naimbak na kagustuhan ng user, mga setting ng tema, mga pagpili ng wika, o mga flag ng pagkumpleto ng onboarding para gayahin ang iba't ibang estado ng user at subukan kung paano pinamamahalaan ng application ang bawat isa.

Pagsusuri ng Third-Party na Storage

Tingnan kung anong data ang iniimbak ng mga third-party script (analytics, chat, advertising) sa localStorage ng iyong domain. I-audit ang data para sa pagsunod sa privacy at hindi inaasahang paggamit ng storage.

Paano Gamitin
1

I-activate ang Local Storage Editor

Buksan ang DevSuite Pro floating dock at i-click ang icon ng Local Storage Editor. Magbubukas ang isang panel na nagpapakita ng lahat ng localStorage entry para sa kasalukuyang domain.

2

I-browse ang mga Entry

Mag-scroll sa pamamagitan ng talahanayan ng key-value. Ang mga JSON value ay awtomatikong naformat. Lumipat ng tab para tingnan ang sessionStorage sa halip.

3

I-edit ang mga Value

I-click ang anumang value para i-edit ito nang inline. Para sa mga JSON value, lumalabas ang isang formatted na editor. Ang mga pagbabago ay naitsave sa storage API kaagad.

4

Magdagdag o Magtanggal ng mga Entry

I-click ang "Add Entry" para lumikha ng bagong key-value pair. I-click ang delete icon sa anumang row para alisin ito. Inaalis ng "Clear All" ang lahat.

5

Subukan ang Gawi ng Application

Pagkatapos mag-edit ng mga storage value, makipag-ugnayan sa pahina para makita kung paano tumutugon ang application sa binagong data.

Handa na bang Subukan? Local Storage Editor?

I-install ang DevSuite Pro nang libre at i-unlock ang 39+ developer tools para sa iyong browser.

Idagdag sa Chrome Idagdag sa Edge Idagdag sa FireFox