originium-chronicles产品系统Vibe Coding

粉丝自制明日方舟简易 Wiki
一个用于展示明日方舟游戏世界观、角色关系和历史事件的 Vue3 Web 应用。

角色展示: 展示游戏中的干员信息、头像和关系网络
派系系统: 可视化展示各个派系（罗德岛、龙门、整合运动等）及其关系
时间线: 泰拉大陆重大历史事件的交互式时间轴
关系图谱: 角色之间的关系可视化网络图

主导项目整体架构设计与功能模块拆解；独立完成干员数据筛选、图片资源整理与优化；全程承担从需求分析、原型设计、编码实现到测试部署的全生命周期开发工作，确保项目高质量交付。
项目采用 Vue 3 + Vite 构建高性能前端工程，结合 Vue Router 实现动态路由与懒加载，使用 Pinia 统一管理全局状态（如干员收藏、筛选条件）。亮点：① 基于 Composition API 封装高复用干员卡片组件；② 利用 `v-for` + `key` 优化列表渲染性能；③ 图片资源按需懒加载 + WebP 格式压缩，首屏加载提速 40%。难点：干员多维度筛选（属性/星级/阵营）导致状态组合爆炸，通过 Pinia 分模块管理 + computed 缓存策略有效降低渲染开销，保障流畅交互体验