| # Logo优化指南 | |
| ## 当前Logo问题 | |
| - **文件大小**: 4MB (过大) | |
| - **分辨率**: 2048x2048像素 (对于UI显示过高) | |
| - **加载时间**: 可能导致UI颤动和缓慢加载 | |
| ## 优化建议 | |
| ### 方法1：使用在线工具 | |
| 1. 访问 [TinyPNG](https://tinypng.com/) | |
| 2. 上传你的logo.png文件 | |
| 3. 下载压缩后的文件 | |
| 4. 替换 `www/logo.png` | |
| ### 方法2：使用Photoshop/GIMP | |
| 1. 打开logo.png | |
| 2. 调整尺寸为200x50像素 | |
| 3. 导出为PNG-8格式 | |
| 4. 质量设置为80-90% | |
| 5. 保存并替换 `www/logo.png` | |
| ### 方法3：使用R代码优化 | |
| 如果你安装了图像处理包，可以使用R代码： | |
| ```r | |
| # 安装包 | |
| # install.packages("magick") | |
| library(magick) | |
| # 读取并优化logo | |
| logo <- image_read("www/logo.png") | |
| logo_resized <- image_scale(logo, "200x50") | |
| logo_compressed <- image_write(logo_resized, "www/logo_optimized.png", quality = 85) | |
| # 替换原文件 | |
| file.rename("www/logo_optimized.png", "www/logo.png") | |
| ``` | |
| ## 目标规格 | |
| - **文件大小**: <100KB | |
| - **尺寸**: 200x50像素 (或保持比例) | |
| - **格式**: PNG (透明背景) | |
| - **加载时间**: <1秒 | |
| ## 临时解决方案 | |
| 如果暂时无法优化logo文件，可以考虑： | |
| 1. **使用小尺寸版本**: | |
| ```bash | |
| # 如果有convert工具 (ImageMagick) | |
| convert www/logo.png -resize 200x50 www/logo_small.png | |
| mv www/logo_small.png www/logo.png | |
| ``` | |
| 2. **或使用备用方案**: | |
| - 暂时重命名logo文件，让应用显示DNA图标 | |
| - 等logo优化后再改回来 | |
| 现在应用有了以下改进： | |
| - ✅ 固定高度容器防止颤动 | |
| - ✅ 默认显示DNA图标，logo加载完成后替换 | |
| - ✅ 更好的错误处理 | |
| - ✅ CSS优化防止布局跳动 |