← Voltar para o catálogo
Use when choosing, implementing, or reviewing browser storage such as localStorage, sessionStorage, IndexedDB, cookies, client persistence, offline data, secure storage, or cleanup strategy; Chinese triggers include 浏览器存储, 客户端持久化.
Ver no GitHub ↗
Copiar URL do repo
Copiar link do SKILL.md Licença: MIT
Como adicionar
Copiar comando
/plugin marketplace add bovinphang/frontend-craft
O comando exato pode variar conforme o repositório. Confira o README no GitHub.
Para o autor da skill
Cole no README do seu repo
Mostra que sua skill está catalogada na Skillteca, gera backlink e tráfego rastreável.
[](https://www.skillteca.com.br/skills/fec-browser-storage)
Copiar snippet
Cria interfaces frontend distintas e de nível de produção com alta qualidade de design, gerando código criativo e polido e design de UI que evita a estética genérica de IA. Use para construir componentes web, páginas e aplicações, ou para estilizar/embelezar UIs web.
Design e Frontend
#ai
#css
por anthropics
Guia para criar servidores MCP (Model Context Protocol) de alta qualidade que permitem que LLMs interajam com serviços externos por meio de ferramentas bem projetadas. Use ao construir servidores MCP para integrar APIs ou serviços externos, seja em Python (FastMCP) ou Node/TypeScript (MCP SDK).
Design e Frontend
#api
#llm
por anthropics
Kit de ferramentas para interagir e testar aplicações web locais usando Playwright. Suporta a verificação de funcionalidades de frontend, depuração de comportamento da UI, captura de screenshots do navegador e visualização de logs do navegador.
Design e Frontend
#test
por anthropics
Conjunto de ferramentas para criar artefatos HTML elaborados e multi-componentes para claude.ai, utilizando tecnologias web frontend modernas (React, Tailwind CSS, shadcn/ui). Use para artefatos complexos que exigem gerenciamento de estado, roteamento ou componentes shadcn/ui, não para artefatos HTML/JSX simples de arquivo único.
Design e Frontend
#ai
#css
por anthropics
Alerta por categoria
1 email curto, só com as skills novas de Design e Frontend. 4 minutos de leitura, sem spam, cancela com 1 clique.
Você confirma o email no primeiro envio. Sem spam. Cancela com 1 clique.
Ler descrição completa Recolher descrição 浏览器存储
Purpose
根据数据大小、安全要求和生命周期选择合适的客户端存储方案。
Procedure
先判断数据敏感度、体积、生命周期、是否需要跨 Tab、是否需要随请求发送。 小量非敏感偏好用 localStorage；Tab 级临时数据用 sessionStorage；大量结构化数据或离线缓存用 IndexedDB；认证态优先 httpOnly cookie。 封装统一 key 前缀、JSON parse/stringify、异常处理、过期清理和 quota 兜底。 敏感数据按安全规则处理，不把明文 token、密码、信用卡信息放进可被 JS 读取的存储。 审查隐私模式、存储配额、清理策略和跨浏览器兼容性。 Detailed References
涉及存储选型表、localStorage/sessionStorage 封装、IndexedDB 示例、Cookie 辅助方法和敏感数据规则时，加载 [references/storage-patterns.md](references/storage-patterns.md)。
Constraints
localStorage/sessionStorage 是同步 API，大数据读写会阻塞主线程。 除 httpOnly cookie 外，客户端存储都可被 XSS 读取。 Cookie 每次请求自动携带，不适合大数据。 IndexedDB 配额和隐私模式行为有浏览器差异。 URL 中不要传 token 或敏感数据。 Expected Output
产出统一的 storage/cookie/db 封装，key 有命名空间，数据有过期或清理策略，敏感数据只进入合适的安全边界。
Compartilhar
X
LinkedIn
Copiar link
