5分钟解锁B站经典界面：Bilibili-Old项目全面解析
5分钟解锁B站经典界面：Bilibili-Old项目全面解析
【免费下载链接】Bilibili-Old恢复旧版Bilibili页面，为了那些念旧的人。项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Old
你是否怀念B站那个简洁直观的旧版界面？是否对新版页面的复杂操作感到不适应？Bilibili-Old项目正是为这些怀旧用户和技术爱好者打造的完美解决方案，通过浏览器扩展和用户脚本两种方式，让你重新体验经典B站的操作界面和功能布局。🎯
🤔 为什么我们需要旧版B站界面？
B站近年来进行了多次界面改版，虽然带来了更多功能，但也让许多老用户感到不适。新版界面操作复杂、加载缓慢，而经典的小电视播放器、直观的导航栏、简洁的评论区都已成为回忆。更关键的是，某些实用功能在新版中被移除或隐藏，让日常使用变得不那么便捷。
关键时间节点：从2019年12月开始，B站逐步弃用旧版av号、稍后再看、排行榜等核心功能，到2022年彻底告别旧版界面。这段历史记录在项目的B站更新摘记中，见证了经典界面的消失过程。
新旧界面对比分析
| 功能模块 | 旧版界面优势 | 新版界面变化 |
|---|---|---|
| 播放器设计 | 小电视经典样式，简洁直观 | 现代扁平化设计，功能繁杂 |
| 导航结构 | 分类清晰，快速跳转 | 信息流为主，导航隐藏 |
| 弹幕系统 | XML格式，兼容性好 | Protobuf格式，部分弹幕丢失 |
| 页面加载 | 快速响应，资源占用低 | 动画效果多，加载缓慢 |
| 操作习惯 | 符合老用户肌肉记忆 | 需要重新学习 |
🚀 两种安装方式：哪个更适合你？
方案一：浏览器扩展（推荐新手）
浏览器扩展方案提供了最直接的用户体验，安装后即可自动工作。你只需要几个简单步骤：
- 克隆项目仓库：
git clone https://gitcode.com/gh_mirrors/bi/Bilibili-Old - 打开Chrome扩展管理页面，启用"开发者模式"
- 点击"加载已解压的扩展程序"，选择项目中的
chrome文件夹
✨ 扩展版优势：
- 自动检测B站页面并应用旧版界面
- 无需额外配置，开箱即用
- 通过扩展图标可快速调整设置
- 支持Manifest V3，兼容最新Chrome
方案二：用户脚本（适合高级用户）
如果你已经使用Tampermonkey等脚本管理器，用户脚本版本提供了更高的自定义灵活性：
- 安装Tampermonkey脚本管理器
- 导入
tampermonkey/main.user.js脚本文件 - 在脚本管理器中调整运行规则和参数
🎯 脚本版特色：
- 可设置特定域名运行规则
- 支持定时启用/禁用
- 更精细的功能控制
- 便于与其他脚本协同工作
🏗️ 核心技术架构解析
Bilibili-Old项目采用了模块化设计，主要功能分布在src/core目录下，通过智能的页面重构技术实现旧版界面的完美恢复。
核心模块工作流程
用户访问B站页面 → 内容脚本注入 → 检测页面类型 → 加载对应恢复模块 → 重构DOM结构 → 注入自定义样式 → 恢复旧版功能关键文件路径说明
- 播放器恢复：
src/core/player.ts- 负责将新版播放器转换为经典小电视样式 - 弹幕处理：
src/core/danmaku.ts- 兼容新旧弹幕格式，支持protobuf解析 - 页面适配：
src/page/目录 - 针对不同页面类型的专门恢复逻辑 - 网络请求：
src/io/目录 - 处理B站API请求和数据转换
这张经典的90x90像素小电视加载动画，采用黑白极简风格，电视机图标内的表情符号为加载过程增添了趣味性，完美再现了B站早期的视觉语言风格。
🔧 你可能不知道的5个小技巧
1. 智能页面检测机制
项目会根据URL自动识别页面类型，并加载对应的恢复模块。这意味着你无需手动切换，系统会自动为视频页、主页、排行榜等不同页面应用最适合的旧版布局。
2. 弹幕格式双兼容
由于B站已将弹幕格式从XML迁移到protobuf，项目实现了两种格式的智能解析。你可以在设置中选择优先使用哪种格式，或者让系统自动选择最优方案。
3. 播放器编码切换
支持AVC、HEVC和AV1多种视频编码的自动切换，确保在不同网络环境下都能获得最佳播放体验。这在src/core/player.ts中通过智能检测算法实现。
4. 区域限制解除
通过替换UPOS服务器和智能路由，项目可以解除港澳台、APP专属等区域播放限制，让你观看原本无法访问的内容。
5. 自动化操作预设
在播放器设置中，你可以预设一系列自动化操作：自动展开弹幕列表、滚动到播放器位置、开启宽屏模式、关闭弹幕、自动播放等，大大提升使用效率。
⚡ 快速排查指南
遇到问题时，可以按照以下步骤快速排查：
问题：页面加载时出现短暂闪烁
原因：新版页面在恢复前短暂显示解决方案：清除浏览器缓存后强制刷新（Ctrl+Shift+R）
问题：某些功能无法正常使用
原因：B站API接口变更或功能维护解决方案：临时切换到新版页面完成操作，或检查项目更新
问题：扩展与其他脚本冲突
原因：多个B站相关扩展同时运行解决方案：暂时禁用其他扩展测试，或调整扩展加载顺序
问题：弹幕显示异常
原因：弹幕格式解析问题解决方案：在设置中切换弹幕格式，或启用本地弹幕加载功能
🎨 进阶定制化建议
个性化样式调整
项目支持自定义CSS注入，你可以在chrome/player/video.css中修改播放器样式，或在src/css/目录下调整各个页面的视觉表现。
功能模块选择性启用
如果你只需要部分旧版功能，可以通过修改src/core/中的模块导入逻辑，选择性启用播放器恢复、页面布局重构、弹幕系统等特定功能。
API接口自定义
高级用户可以在src/io/目录下修改API请求逻辑，替换为第三方接口或自定义数据处理流程，实现更个性化的功能扩展。
🔮 未来发展与维护
Bilibili-Old项目采用活跃的维护策略，密切关注B站前端更新。当B站进行重大改版时，项目团队会及时发布兼容性更新，确保旧版界面的持续可用性。
维护策略包括：
- 定期检查B站前端变更
- 及时适配新的API接口
- 修复已知的兼容性问题
- 社区驱动的功能改进
💡 实用建议与最佳实践
- 定期更新：建议启用扩展的自动更新，或定期检查项目更新
- 备份配置：导出你的个性化设置，便于重装时快速恢复
- 社区参与：遇到问题或有好想法时，可以参与项目讨论
- 适度怀旧：虽然旧版界面经典，但新版的一些实用功能也值得尝试
通过Bilibili-Old项目，你不仅能够重温经典的操作体验，还能深入了解现代Web扩展技术和页面重构技术。这个项目证明了，在技术快速迭代的时代，经典的用户体验依然具有不可替代的价值。✨
无论你是B站的老用户，还是对前端技术感兴趣的学习者，Bilibili-Old都值得你探索和尝试。现在就开始你的怀旧之旅吧！
【免费下载链接】Bilibili-Old恢复旧版Bilibili页面，为了那些念旧的人。项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Old
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考