一个真正有效的小UX改进

我在开发软件时，会尽量让应用程序记住一些事情，这样用户就不必一遍又一遍地重复相同的操作。

大多数应用会在刷新页面或稍后返回时重置所有数据。这很快就会让人感到烦躁。

我的意思是：

• 你再次点击同一个标签页
• 您可以重新选择筛选条件或排序方式。
• 您重新输入相同的内容或提示
• 你每次都切换深色模式
• 你反复展开同一个面板

虽然都是些小事，但积少成多，会让你的应用体验变差。

用来localStorage记住事情

我现在会保存一些状态信息localStorage。这样做只是为了让应用程序感觉更稳定、更一致。

以下是我通常会保存的内容：

• 上次打开的标签页
• 深色或浅色模式
• 草稿输入或提示
• 筛选器或排序设置
• 折叠/展开侧边栏
• 已关闭的模态框或弹出窗口（通常是需要立即操作的那些）
• 最近使用的颜色
• 预览模式（移动端/桌面端）
• 选定语言

没什么特别深刻或严肃的事情，只是一些能帮助人们继续之前未完成的事情。

示例：保存和加载深色模式

以下是一个使用 localStorage 保存深色模式设置的基本示例：

// Save mode
localStorage.setItem('theme', 'dark'); 

// Load mode
const savedTheme = localStorage.getItem('theme'); 
if (savedTheme === 'dark') {
    document.body.classList.add('dark');
}

或者在 React 中：

useEffect(() => {
    const saved = localStorage.getItem('theme');
    if (saved) {
        setTheme(saved);
        // assume setTheme updates UI
    }
}, []);

const toggleTheme = () => {
    const newTheme = theme === 'dark' ? 'light' : 'dark';
    setTheme(newTheme);
    localStorage.setItem('theme', newTheme);
};

快速提示

• 只存储那些能让应用更易于使用的内容
• 不要保存敏感信息（例如身份验证令牌或个人数据）。
• 为用户提供在需要时重置偏好设置的方法。
• 如果经常使用，请使用小包装纸或定制钩针。

就是这样

这虽然不是什么大功能，但它能让你的应用运行更流畅。用户在体验流畅时甚至感觉不到它的存在——他们只是不再感到恼火而已。

如果你开发的是人们会多次使用的产品，这一点就很重要了。

除了本地存储之外，你还用它保存了哪些能提升用户体验的内容？欢迎在下方分享你的经验。我一直很好奇其他人都在做什么。