## 项目简介
解忧树冻屋是一个温馨治愈的匿名发帖小程序，为用户提供一个安全的倾诉空间。在这里，用户可以匿名分享自己的心声，释放压力，获得温暖。项目采用纯前端技术栈实现，无需后端服务器，所有数据存储在浏览器本地，充分保护用户隐私。
应用包含三大分类：疑难杂症、吐槽、树洞。每个分类都有独特的主题色和图标，用户可以根据心情选择合适的板块发布内容。特别是树洞分类，还支持私密功能，用户可以选择"仅个人可见"，让秘密只有自己能看到。
界面设计采用紫色渐变主题，配合玻璃拟态效果，营造出温馨舒适的视觉体验。响应式设计确保在PC和移动设备上都有良好的使用体验。
## 使用到的 iFlow CLI 功能
在开发此项目过程中，使用了以下 iFlow CLI 功能：
- **write_file** - 创建项目的 HTML、CSS 和 JS 文件，包括 index.html、app.js、展示页面.html 等核心文件
- **read_file** - 读取文件内容，检查代码结构和实现逻辑
- **replace** - 修改代码中的特定部分，实现功能迭代和Bug修复
- **todo_write** - 管理开发任务列表，跟踪开发进度，确保功能完整性
- **todo_read** - 查看当前任务状态，了解开发进展
- **search_file_content** - 搜索代码中的关键内容，快速定位功能实现位置
- **task** - 调用专用代理（如 frontend-tester）进行功能验证和UI测试
- **run_shell_command** - 执行命令行操作，启动Python HTTP服务器，后台运行服务
- **ReadCommandOutput** - 查看后台任务输出，监控服务器状态
## 实现过程
### 1. 基础功能开发
创建HTML页面，设计响应式布局，引入Bootstrap 5.3.0和Material Icons图标库。实现匿名发帖功能，包括字符计数（10-500字）、内容验证、时间戳记录和保存到localStorage。设计三大分类：疑难杂症（蓝色主题）、吐槽（黄色主题）、树洞（绿色主题）。实现点赞互动、评论展开/收起、分享功能等核心交互。
### 2. 首页重新设计
根据用户需求优化，将原始设计（所有帖子在一个页面显示，使用筛选按钮切换分类）改为三个大卡片设计。点击卡片进入对应分类页面，分类页面只显示该分类的帖子，并添加返回首页按钮。实现卡片玻璃拟态效果、渐变背景、悬停动画和实时统计帖子数量功能。
### 3. 私密功能开发
为树洞分类添加专属私密功能。实现发帖选项：匿名发送（默认勾选，显示"匿名"标识）和仅个人可见（私密帖子只对作者可见）。实现评论选项：私密评论（仅评论发布者可见，显示"仅个人可见"徽章）。通过用户ID管理实现可见性控制，首次访问生成唯一用户ID并保存到localStorage。
### 4. 性能优化
发现页面加载缓慢、动画效果导致卡顿、DOM操作频繁等问题。采取优化措施：简化动画，移除复杂的贝塞尔曲线，减少动画持续时间，移除入场动画；优化CSS，使用will-change属性，只对必要属性进行动画，减少过渡效果；优化JavaScript，使用事件委托，减少DOM操作次数，批量处理更新。
### 5. Bug修复
修复数据清除bug（loadPosts()函数每次都清除数据，导致用户数据丢失）和页面空白问题（JavaScript错误导致页面无法渲染，CDN资源加载问题）。移除localStorage.removeItem()调用，添加错误处理机制，创建测试页面验证功能。
## 项目特色
- **温馨治愈主题**：紫色渐变主题，配合玻璃拟态效果，营造温馨舒适的视觉体验
- **匿名发帖**：无需注册登录，完全匿名发布帖子，保护用户隐私
- **三大分类**：疑难杂症、吐槽、树洞，每个分类都有独特的主题色和图标
- **私密功能**：树洞分类支持"仅个人可见"的帖子和评论，让秘密只有自己能看到
- **数据本地存储**：使用localStorage保存数据，无需后端服务器
- **响应式设计**：完美支持桌面端和移动端，自动适配不同屏幕尺寸
- **流畅动画**：精心设计的动画效果，提升用户体验
- **实时统计**：首页实时显示各分类帖子数量
- **丰富交互**：支持点赞、评论、分享等多种互动方式
## 功能说明
### 匿名发帖
1. 选择分类卡片（疑难杂症、吐槽、树洞）
2. 在输入框中输入内容（10-500字）
3. 树洞分类可选择匿名发送和仅个人可见选项
4. 点击发布按钮，帖子即刻保存并显示
### 分类浏览
1. 首页显示三个分类卡片，点击进入对应分类
2. 分类页面只显示该分类的帖子
3. 点击返回首页按钮回到首页
### 互动功能
- **点赞**：点击爱心图标点赞或取消点赞
- **评论**：点击评论图标展开评论区域，发表匿名评论
- **分享**：点击分享图标，支持原生分享或复制到剪贴板
### 私密功能（树洞专属）
1. 发帖时勾选"仅个人可见"，帖子只对自己可见
2. 发表评论时可选择"私密评论"，评论只对自己可见
3. 私密内容带有"仅个人可见"标识，其他用户完全看不到
### 启动方式
1. 双击运行 start.bat 文件
2. 在浏览器中打开 http://localhost:8000
3. 开始你的匿名发帖之旅
-–
*项目版本：v1.0.0*
*开发时间：2026年新春创造营*
