web storage 用于前端存储用户个性化配置，通过 localstorage 保存主题、功能开关、表单草稿及平台偏好等字符串或 json 数据，页面加载时读取还原，无需后端、零网络开销；建议统一字符串化布尔值、搭配系统偏好检测、加 try-catch 防解析失败。
用 Web Storage 存储用户个性化配置，核心是把用户操作产生的偏好（比如主题、字体大小、默认模型、表单草稿等）以字符串形式存进 localStorage，页面加载时读取并还原，实现“关掉再打开还是原来的样子”。它不依赖后端、零网络开销，适合前端主导的配置记忆场景。
主题与外观设置
深色/浅色模式、主色调、字体缩放等视觉偏好最常用 localStorage 实现：
- 用户点击切换按钮时，执行
localStorage.setItem('theme', 'dark')或localStorage.setItem('fontSize', 'larger') - 页面初始化阶段（如 DOMContentLoaded），用
localStorage.getItem('theme')读取值，存在则给添加对应 class 或动态设置 CSS 变量（如document.documentElement.style.setProperty('--bg-color', '#1e1e1e')） - 建议搭配
window.matchMedia('(prefers-color-scheme: dark)')检测系统级偏好作为默认回退，增强兼容性
功能开关与界面状态
用户主动开启/关闭的 UI 功能项，例如“显示高级选项”“启用实时预览”“折叠侧边栏”等：
- 每个开关绑定一个唯一 key，如
localStorage.setItem('showAdvancedOptions', 'true') - 组件挂载时读取该 key，控制 v-show / v-if 或 React state 的初始值
- 避免布尔值直接存，统一转字符串（
'true'/'false'），或用 JSON 存对象整体管理，如：localStorage.setItem('uiSettings', JSON.stringify({ sidebarCollapsed: true, autoSave: false }))
表单内容自动保存
长表单（如注册页、订单填写、模型训练配置）意外刷新或离开前保留已填内容：
- 监听输入框 change 或 input 事件，将字段值实时写入 localStorage，key 可带页面标识，如
'form-profile-username' - 页面加载时遍历相关 key，逐个恢复 input.value 或表单数据对象
- 提交成功后调用
localStorage.removeItem()清除对应缓存，防止旧数据干扰下次填写
平台级用户偏好（如 ms-swift 类工具）
面向开发者或专业用户的 Web 工具，常需记住模型选择、量化方式、最近任务类型等高频操作项：
- 定义统一 key，如
'ms_swift_user_prefs'，用JSON.stringify()存整个配置对象 - 提供“恢复默认”入口，调用
localStorage.removeItem('ms_swift_user_prefs')即可重置 - 读取时加 try-catch，防止 JSON 解析失败导致白屏，出错时 fallback 到内置默认配置
不复杂但容易忽略
