掌阅网页版

2024-06-01

角色:前端核心开发

重构旧版书城,打造现代化在线阅读平台。从0到1完成开发并上线,使用 Nuxt2 实现服务端渲染。

项目介绍

重构旧版书城,打造现代化在线阅读平台。从0到1完成开发并上线,涵盖书架管理、书籍上传、阅读器、登录认证等核心功能。

核心功能

  • 书架模块:使用掌阅App书架数据结构,成功迁移到网页版,实现排序、分组、虚拟滚动、封面图阿里云授权等功能
  • 上传模块:集成阿里云上传授权,根据书籍大小分别使用普通上传或分片上传,确保大文件上传稳定性
  • 阅读器:支持掌阅内部书籍、用户本地书的epub、pdf、txt多种格式阅读
  • 登录模块:支持掌阅App扫码登录,实现多端账号同步
  • 防爬虫:Node端做Unicode处理,浏览器端使用特殊字体渲染,有效防止爬虫

技术亮点

  1. 服务端渲染:使用 Nuxt2 实现SSR,提升首屏加载速度和SEO优化
  2. 阅读器支持:调研并集成 EPUB.js 和 PDF.js,支持多种电子书格式
  3. 性能优化:通过虚拟滚动等技术,确保大量书籍数据下的流畅体验
  4. 数据复用:直接使用掌阅App数据结构,大大减少后期维护成本
  5. 安全防护:多层次的防爬虫方案,保护版权内容

项目成果

  • 成功从0到1上线,用户体验显著提升
  • LCP、FCP保持在优秀水平
  • 支持多种电子书格式,满足不同用户需求