如何“渐进”地使用MVVM框架
1. 现状
产品形态:美篇文章页
- APP/H5/PC多端复用
- 文字/图片/音乐/视频多元内容
- 一篇文章多种模板
- 音乐/投票/赞赏等多种功能
产品特点1:16个独立组件
- 下载
- 文章元数据
- 正文
- 音乐
- 投票
- 赞赏
- 点赞
- 举报
- 分享
- 专栏入口
- 评论
- 推荐文章
- 二维码
- 商业广告
- 红包
- 微信配置
产品特点2:100+ 模板
产品特点3:高并发
- 23,083,724 pv/天
- 1.38亿 MUV
2. 目前采用的架构:后端渲染
3. 业界常用优化思路:MVVM 框架
4. 上述两种方式的优缺点
5. 落地方案:结合,取长补短
文章元数据
- 标题
- 作者
- 时间
- 封面图
- 阅读量
- 文章正文
上述两种类型的数据使用后端渲染
- 下载
- 音乐
- 投票
- 赞赏
- 点赞
- 举报
- 分享
- 专栏入口
- 评论
- 推荐文章
- 二维码
- 商业广告
- 红包
- 微信配置
剩余类型的数据可以充分发挥MVVM框架的特点,抽象成组件,便于维护
核心流程图
6. 未来迭代方向
- 拆分vendor.js,更好地利用浏览器缓存
- 后端服务化,逐步拆分出业务接口,进一步解耦不同模块
- 浏览器 → Node中间层(SSR) → 后端服务