作者简介

人人视频之所以考虑 SSR 方案,首先是因为和百度的合作项目。

基于对搜索引擎爬虫的友好度考虑,也就是 SEO 优化,页面必须尽量保持是直出,方便蜘蛛爬取;其次,合作方要求用户 1.5 秒内必须能打开页面,所以技术侧必须保证用户打开页面的首开时间。另一方面,此次项目从立项到落地要求两周内上线,之前在客户端渲染方面,我们通过埋点观察过用户数据,觉得可能在短时间内既保障功能开发又能花大精力去磨这个优化可能不太现实,所以直接敲定了 SSR 方案。

我们公司目前技术团队分为大前端和大后端,公司将不同业务线分别独立运作。贯穿大前端和大后端不同的开发同学进行跨部门或跨业务线协作,大前端负责偏用户侧移动端的产品体验,大后端侧重于服务稳定以及数据侧深耕。技术栈方面后端业务基于 Java 生态以及 Python 大法,大前端比较「五花八门」,移动侧基于原生 object-c/swiftjava/kotlin,Web 侧基于 Vue 全家桶Node生态phptypescript 等等,以及跨平台技术 Flutter 的相关引进。前端同学借助后端常规业务接口,通过 node 进行拼装过滤,或者独立开发一些业务类接口(常见的 BFF 玩法)。

因为团队项目主要是在 Vue 生态内折腾,所以首先想到了现在大家都在使用的Nuxt 框架。其次还有之前刷知乎了解到的 Egg 团队推出的 Egg Vue SSR方案,我们大致对比了一下,觉得都值得尝试。但是考虑到当时项目上线时间紧迫以及文档或者覆盖度问题,比如遇到问题能快速自主通过搜索查阅解决的可能性,我们最终还是先行在这个项目上选择了 Nuxt 框架。

另一方面,考虑完开发问题后,部署和监控也是一个重点,起初我们是以 pm2 方式去守护,另外在 CVM 层面打入探针去监控 node 进程以及性能相关数据,这方面对开发是一种考验,对运维侧也是一种负担,总体来说付出的心智成本感觉还是蛮高些,然后这时候想到了从上线之初就开始使用的云函数 SCF,以及去年在腾讯开发者大会上接触到的 Serverless Framework,通过官方文档查到了腾讯云 Serverless 团队最近支持了 Nuxt,便马上咨询腾讯云 Serverless 团队相关细节,决定将运维侧弹性伸缩业务保障这块能力交由更专业的团队去管理,解放这边的开发重心。

总体来说,这次项目业务结构还是蛮简单的,业务组件还是使用 vue 搭建开发,或者复用之前内部供给于移动端的 Web 组件库,依托于 Nuxt 框架实现 SSR 渲染,然后对不同组件进行了相关业务埋点,以及性能埋点,尤其是播放相关数据和 CDN 指标重点做了监控和主备方案。后面二期项目会对播放器模块做一次定制开发,以及防盗链方案做一次优化,顺便会对用户特征,对转码和 CDN 部署做一次重新梳理。

任何新技术的落地不可能是一帆风顺,SSR 也是如此。

首先就是对 SSR 性能我们自身能做到啥程度的一种顾虑,所以我们开始正式开发前先去拿某米的一个和我们业务比较像的 SSR 页面做了对比测试,因为平时也比较喜欢数码产品,经常围观这些网站,也观察这些科技大厂的技术栈迭代,所以找了个之前留意过的一个 SSR 项目页面,同时考虑到可能同样是 Nuxt,俺们第一次写出来的万一没那味,性能可能不如大厂成熟的经过好几轮优化的 SSR 页面项目,所以我们就拿 Nuxt 开始对着对方业务裸写,然后发布到线上,然后真实对比性能,找到差异再去分析对方的优化策略,直到和对方页面性能差不多的时候,我们开始上手真实写业务,也算是站在巨人的肩膀上前行吧。

后面甚至团队同学在项目上线后,自己通过压测和对比观察页面线上性能,最后 LRU 兜底了一层服务端页面,页面 QPS 大涨 20 倍,反向超越了一下前辈,可见后面着重发力一下 serverless 层,或者借助云自身的生态,这块还有进一步大的提升空间。

其次遇到的最大的问题就是各个手机厂商的浏览器对 video 的实现更加五花八门,也有不少厂商直接 hook 替换为原生播放器的,这边后面花了大量时间做适配;以及各家对 CDN 文件的缓存实现不一致,我们接口用了一层 cdn 去落地,最后实测发现有些厂商的浏览器缓存甚至会写入 SD 存储里,即使卸载重装浏览器缓存依然存在,对这种情况处理的也比较繁琐,最后严格控制了每个文件的 CDN 缓存时间。

另一个点是发版测试或者是灰度方面,起初使用腾讯云 serverless 的时候,我们是新建两个服务,一个用于测试,一个是正式生产环境,然后通过 API 网关绑定,能用是能用,就是感觉不太方便。在开发到后期的时候,腾讯云团队告知我们,他们灰度流量的方案上线了,通过控制流量比来实现新老版逐步切换,方便及时感知问题,甚至蓝绿测试那种方式来帮我们去优化掉这方面的使用体验,点个赞

马晓:Serverless SSR 在人人视频的落地探索相关推荐

  1. @开发者,第二届马栏山杯国际音视频算法大赛高分攻略请查收,心动大奖等你来战!...

    一秒让墙上的广告消失,保留完整墙面:户外大屏幕显示LOGO被擦除后,背景毫不违和-- 欢迎来到魔法世界-- 停!这其实并不是什么魔法,而是由弗吉尼亚理工大学提出的基于流的视频补全算法FGVC的一项应用 ...

  2. @开发者,第二届“马栏山”杯国际音视频算法大赛高分攻略请查收,心动大奖等你来战!...

    一秒让墙上的广告消失,保留完整墙面:户外大屏幕显示LOGO被擦除后,背景毫不违和-- 欢迎来到魔法世界-- 停!这其实并不是什么魔法,而是由弗吉尼亚理工大学提出的基于流的视频补全算法FGVC的一项应用 ...

  3. @开发者,第二届“马栏山杯”国际音视频算法大赛高分攻略请查收,心动大奖等你来战!...

    一秒让墙上的广告消失,保留完整墙面:户外大屏幕显示LOGO被擦除后,背景毫不违和-- 欢迎来到魔法世界-- 停!这其实并不是什么魔法,而是由弗吉尼亚理工大学提出的基于流的视频补全算法FGVC的一项应用 ...

  4. 第二届“马栏山”杯国际音视频算法大赛高分攻略

    一秒让墙上的广告消失,保留完整墙面: 户外大屏幕显示LOGO被擦除后,背景毫不违和-- 欢迎来到魔法世界-- 停!这其实并不是什么魔法,而是由弗吉尼亚理工大学提出的基于流的视频补全算法FGVC的一项应 ...

  5. “人人视频”下架整改冲上热搜;鸿蒙系统升级用户一周破千万;滴滴招股书:1300万司机去年赚了1174亿元 | 架构视点...

    点击上方 "编程技术圈"关注, 星标或置顶一起成长 后台回复"大礼包"有惊喜礼包! 每日英文 You may be out of my sight, but n ...

  6. 优矩互动冲刺港交所上市:毛利率逐年下滑,马晓辉持股90%

    4月12日,在线营销服务商优矩互动(UJU HOLDING LIMITED)在港交所递交招股书,准备在港交所主板上市.据贝多财经了解,该公司由前唯品会副总裁马晓辉创立. 资料显示,马晓辉曾担任新浪总监 ...

  7. 优矩互动在港挂牌上市:三个高度集中,马晓辉身价接近30亿元

    11月8日,短视频营销公司优矩互动(UJU HOLDING LIMITED,HK:01948)在港交所上市,发行价为6.7港元/股.按发行价计算,优矩互动此次赴港上市的募资净额为7.49亿港元(不考虑 ...

  8. 《王者荣耀》等“爆款”游戏是如何诞生的?| 马晓轶青腾大学演讲

    硅谷Live / 实地探访 / 热点探秘 / 深度探讨 注册用户超2亿,成为全球用户数最多的MOBA(多人在线战术竞技游戏)手游,腾讯的现象级手游<王者荣耀>成绩辉煌. 作为腾讯互娱娱乐事 ...

  9. 【python 爬虫】人人视频 API 接口解析

    需要的包 from lxml import etree import re import json import requests <神盾局特工 第七季>资源突然没了,请将17578替换成 ...

最新文章

  1. 程序员的量化交易之路(35)--Lean之DataFeed数据槽3
  2. 【SRH】------常见的HTTP状态码
  3. Open vSwitch系列实验(一):Open vSwitch使用案例扩展实验
  4. 【操作系统复习】操作系统的发展与分类
  5. 手把手·从零开始撸Docker 系列一
  6. Asterisk目录结构如下
  7. ubuntu下使用vi退出终端出现乱码的解决方案
  8. 独立游戏大电影观后感
  9. 文档图纸加密解决方案
  10. dirent struct_file属性读取 Struct dirent struct stat
  11. 论文推介:CaTT-KWS—基于级联Transducer-Transformer的多阶段自定义关键词识别框架
  12. python显示gif图片_利用Python制作GIF图片
  13. 七个好用且免费的在线代码编辑器,你喜欢哪个?
  14. “no source“: Error: command-line: #564: cannot open embedded assembler outpu
  15. 想再考一个教师资格证,相同的科目需要重考笔试吗?
  16. 各种设计模式应用场景
  17. 电脑里文件消失了,存储内存还占用着,怎么办?
  18. 334. 递增的三元子序列(中等 贪心 数组)
  19. x3650服务器硬盘指示灯,IBM X3500服务器故障|前面板指示灯解释
  20. 你了解网站在线客服系统吗?

热门文章

  1. Python_第六篇 第三方安装包(1)_fancyimpute介绍及使用
  2. 植物神经紊乱的影响,你知道有哪些吗?
  3. mysql的基本内容介绍简书_MySQL 基本内容
  4. 分析自动化测试收益_分析自动化测试结果
  5. 启智平台git使用指引
  6. 诱骗芯片PD+QC协议XSP06应用案例,支持5V9V12V15V20V
  7. python哥德巴赫猜想证明要求其中一个素数最小_第4-4章“哥德巴赫猜想”的验证(20分),浙大,版,Python,程序设计,题目,集第...
  8. 【松岩盘前视点】2019-9-11
  9. 2018网站优化人员不同阶段在做哪些事
  10. seo网站优化小技巧