# 加载体验优化与带宽节省方案

我将分两步实施您的需求，重点解决宽带占用问题和优化加载反馈。

### 第一步：宽带占用优化（核心：实现请求中止）
**目标**：当用户在歌曲列表中切换或确认选歌时，强制切断之前正在进行的预览音频下载，将带宽瞬间释放给当前操作。

**涉及文件**：`abstractfile.js`, `loader.js`, `songselect.js`

1.  **改造底层请求 (`abstractfile.js`, `loader.js`)**：
    *   修改 `RemoteFile` 类，使其能够持有并控制底层的 `XMLHttpRequest` 对象。
    *   实现 `abort()` 方法：当调用时，直接触发 `xhr.abort()` 中断网络连接。
    *   优化 `loader.ajax`：确保请求被中止（Abort）时，Promise 能够被正确处理，不会在控制台抛出无关的错误报错。

2.  **选歌逻辑拦截 (`songselect.js`)**：
    *   在 `SongSelect` 类中引入机制来追踪当前正在下载的预览音频。
    *   **关键动作**：每当用户移动光标（`moveToSong`）或按下确认键（`confirm`）时，**立即调用**上一首歌曲文件的 `abort()` 方法。
    *   这将确保“非加载用户所选”的进程被立刻停止，实现您要求的“转而加载用户加载的歌曲”。

### 第二步：加载界面升级（百分比与超时提醒）
**目标**：让用户直观看到加载进度，并在卡死时提供解决方案。

**涉及文件**：`loadsong.js`, `loadsong.html`, `loadsong.css`

1.  **UI 界面改造 (`loadsong.html`, `loadsong.css`)**：
    *   在加载界面的小咚动画下方添加一个明显的百分比数字显示（例如 `0%` -> `100%`）。
    *   调整 CSS 样式，确保文字清晰、美观，且不遮挡原有动画。

2.  **进度与超时逻辑 (`loadsong.js`)**：
    *   **进度计算**：统计本次选歌需要加载的文件总数（音频、谱面、背景图等）。每完成一个文件的加载，实时更新界面上的百分比数值。
    *   **超时救援**：设置一个 **30秒** 的安全计时器。
        *   如果 30秒 后游戏仍未开始，将“加载中...”的提示修改为“加载超时，建议刷新网页”，并提供显眼的刷新操作指引。
        *   这能有效解决用户看着 0% 不知道是卡死还是慢的问题。

### 第三步：验证
*   通过网络面板确认快速切歌时旧请求变为 `cancelled` 状态。
*   验证加载界面的百分比数字跳动流畅。
*   模拟超时情况，确认提示信息正确显示。