1.按需引入Vant,快速搭建注册、登录、推荐、推荐详情、歌曲列表、歌手列表、搜索、播放列表,并使用rem进行响应式布局
2.将Vant组件二次封装,使之更符合业务需求
3.对axios进行二次封装,支持取消请求、请求超时、拦截、loading等功能
4.使用Vue全家桶进行开发,并使用Pinia作为状态管理工具
5.对歌曲及歌手的长列表进行优化,使用虚拟滚动
6.为了减少请求,搜索时使用防抖优化
7.封装音乐播放器组件,实现歌曲播放,歌曲切换,进度条,歌词保持同步,唱片旋转功能
8.通过浏览器本地存储和Pinia实现歌曲详情数据持久化
9.使用vue-lazyload对歌手图片进行懒加载、路由懒加载、防抖节流,减少数据请求的发送、CDN加速,gzip压缩减少文件的打包体积,优化网页首屏加载速度