WeTest 导读

天天P图”军装照”活动交出了一份10亿浏览量的答卷,一时间刷屏朋友圈,看到这幕,是不是特别想复制一个如此成功的H5?不过本文不教你如何做一个爆款H5,而是介绍天天P图在“军装照”活动过程中,如何面对10亿流量时的后台承载。

一、10亿浏览量,“军装照”火了

这两天,相信 “军装照”活动已经刷爆了朋友圈,这个活动是由人民日报客户端策划出品并主导开发,腾讯天天P图提供图像处理支持的一款H5产品。

天天P图智能换脸

这款H5于7月29日晚一经推出,浏览量就迅猛攀升。7月30日24时,浏览次数突破6000万,在7月30日23:03时,H5迎来了这次活动的最高峰值,图片生成请求达到每分钟117万次,8月1日13时突破5亿。截至8月2日17时,“军装照”H5的浏览次数累计8.2亿,独立访客累计1.27亿,一分钟访问人数峰值高达41万。

后台数据截图

一般来说,一个H5产品浏览次数能超过500万就很不错了,超过1亿的十分罕见。如果以1亿为标准,这款H5产品能够申请10次世界纪录。

创纪录的浏览量背后,自然需要坚强的后盾,腾讯云与腾讯WeTest帮助天天P图对图片上传下载,存储,智能分析、融合处理以及压力测试等服务提供技术支持,让“军装照”活动可以顺利延续影响力,保证用户的良好体验。

二、一个刷屏级的H5有多难?

在见证了一个个精妙的H5活动后,我们渐渐意识到,制作一个刷屏级的H5越来越难了。

面对H5,用户越来越“丧失耐心”

腾讯大数据2016年的《移动页面用户行为报告》中表示如果页面加载超过5秒就会有74%的用户离开页面。

页面加载超过5s就会有74%的用户离开页面

(图片来源:腾讯大数据《移动页面用户行为报告》)

这样的数据是符合交易响应时间的“2-5-8原则”的,也就是:

1、 当用户能够在2秒以内得到响应时,会感觉系统的响应很快;

2、 当用户在2-5秒之间得到响应时,会感觉系统的响应速度还可以;

3、 当用户在5-8秒以内得到响应时,会感觉系统的响应速度很慢,但是还可以接受;

4、 当用户在超过8秒后仍然无法得到响应时,会感觉系统糟透了,或者认为系统已经失去响应,而选择离开这个Web站点,或者发起第二次请求。

从腾讯大数据的数据来看,用户对于H5的容忍程度显然更低,在5-6秒的时候,已经开始无法忍受了,因此根据这样的现实情况,对于移动页面,我们更应该关注一个全新的“1-2-5原则“

1、 当用户能够在1-2秒内打开H5页面,看到信息的展示,或者能够开始进行下一步的操作,用户会感觉速度还好,可以接受;

2、 页面如果在2-5秒后才进入可用的状态,用户的耐心会逐渐丧失;

3、 如果一个界面超过5秒甚至更久才能显示出来,这对用户来说基本是无法忍受的,也许有一部分用户会退出重新进入,但更多的用户会直接放弃使用。

举个例子:

2016年11月24日晚上九点半,一个名为《薛之谦2个月没写段子,结果憋了个大招》的腾讯动漫的H5引爆了朋友圈,仅仅三个小时就已经突破120W的PV,而第二天早上的PV大概是270W左右。

该H5采用长图文+视频的形式,在屏幕划到某一个位置,自动播放准备好的Mp4文件,起初,这个时长2分51秒的视频大小是34.5MB,,如果在网络环境较好的情况,用户可以很流畅的观看,没有卡顿和延迟,但是为了提升用户的体验感受,H5进行了全面的优化,整体大小被下降到了24.3MB。

腾讯动漫的H5整体大小从40MB左右优化到了24.3MB

(图片来源:《深度解析!薛之谦的二次元H5为什么又翻天了!》)

对于一个H5的产品,功能无疑很重要,但是性能同样是用户体验中不可或缺的一环。原本H5的渲染性能就不及native的app,所以,H5的性能是一个绕不开的话题。

三、腾讯云+WeTest “军装照”H5攻克最后技术难关

为了保证“军装照”H5能够被用户顺利的访问,,天天P图与腾讯WeTest压测大师合作,对H5的主要接口进行了多次压力测试。

1、制定测试目标

根据之前多次H5活动经验,天天P图对活动流量通常都有一个稳定的预期。天天P图的技术团队将H5的压测目标制定如下:

事务成功率: 99.9%

响应时间: 500ms

TPS: 10000qps

网络流量: 15G

压测人数配置(示例)

2、确认压测场景

对于“军装照”H5活动,最为重要的一个接口就是用户上传图片到天天P图“人脸融合”后台的接口,通过完成接口地址的配置,天天P图技术团队完成了压测的配置。

接口地址配置(示例)

天天P图团队不断的通过压测大师测试接口,获取实时的承载数据,对服务器进行持续优化,从而实现一个最为稳定的状态。

压测数据结果(demo数据)

在完成了服务器架构的最佳优化之后,天天P图在“军装照”活动爆红之后,依赖腾讯云海量处理能力和灵活扩展性,天天P图团队紧急在腾讯云调动服务器,进行弹性扩容,从一开始的400台,再到800台,最终在最高峰动态部署了4000台腾讯云服务器。此外腾讯云还采用了智能分流、柔性策略等办法,确保稳定应对海量用户的请求。这样的弹性扩展因而支撑了“军装H5”10亿次的浏览。

H5技术的兴起,注定着这款重要的网络语言将要承载越来越多的内容,为了满足用户越来越“不耐心”的响应时间要求,未来的H5以及Web页面针对性能势必进行更多的测试以及优化,保证用户在越来越多的场景下可以体验到最好的效果。


腾讯WeTest压测大师运用了沉淀十多年的内部实践经验总结,服务了包括王者荣耀、龙之谷手游、轩辕传奇手游、火影忍者等多款高星级手游,也包括天天P图、NOW直播等明星产品,通过基于真实业务场景和用户行为进行压力测试,帮助开发者发现服务器端的性能瓶颈,进行针对性的性能调优,降低服务器采购和维护成本。

为了让外部更多产品能够享受到简单易用的压测产品,腾讯WeTest决定将这份服务器测试能力产品化,以产品”压测大师“的形式,正式对外开放。目前更有10元10000VUM的压测优惠,欢迎大家的使用!

体验地址:http://wetest.qq.com/activity/paygaps0808

如果对使用当中有任何疑问,欢迎联系腾讯WeTest企业qq:800024531

“军装照”背后——天天P图如何应对10亿流量的后台承载。的更多相关文章

  1. 你知道军装照H5浏览了多少次吗? 10亿

    7月29日,由人民日报客户端推出的<快看呐!这是我的军装照>(以下简称<军装照>)H5页面,由它所引发的全民晒“军装照”现象级事件,据统计,截至8月18日,<军装照> ...

  2. TOP100summit:【分享实录-QQ空间】10亿级直播背后的技术优化

    本篇文章内容来自2016年TOP100summit QQ空间客户端研发总监王辉的案例分享.编辑:Cynthia 王辉:腾讯SNG社交平台部研发总监.腾讯QQ空间移动客户端技术负责人高级工程师.09年起 ...

  3. 高性能kv存储之Redis、Redis Cluster、Pika:如何应对4000亿的日访问量?

    一.背景介绍 随着360公司业务发展,业务使用kv存储的需求越来越大.为了应对kv存储需求爆发式的增长和多使用场景的需求,360web平台部致力于打造一个全方位,适用于多场景需求的kv解决方案.目前, ...

  4. 故障复盘究竟怎么做?美图SRE结合10年经验做了三大总结(附模板)

    美图崇尚的故障文化是 "拥抱故障,卓越运维",倡导的基准是 No-Blame, 即「不指责,重改进」.今年 9 月 TakinTalks 社区曾经分享过美图的三段式故障治理方法(美 ...

  5. QQ亿级日活跃业务后台核心技术揭秘

    http://ms.csdn.net/geek/75478 引言 作为本次技术开放日后台架构专场的出品人我今天给大家带来<构造高可靠海量用户服务-SNG数亿级日活跃业务后台核心技术揭秘>, ...

  6. (转)从P1到P7——我在淘宝这7年

    (一) 2011-12-08 [原文链接] 今天有同事恭喜我,我才知道自己在淘宝已经七周年了.很多人第一句话就是七年痒不痒,老实说,也曾经痒过,但往往都是一痒而过,又投入到水深火热的工作中去.回家之后 ...

  7. 从P1到P7——我在淘宝这7年(转)

    作者: 赵超  发布时间: 2012-02-25 14:47  阅读: 114607 次  推荐: 153   [收藏] (一) 2011-12-08 [原文链接] 今天有同事恭喜我,我才知道自己在淘 ...

  8. 从P1到P7——我在淘宝这7年 - 子柳撰写

    http://kb.cnblogs.com/page/132752/来自博客园的整理版本,作者是子柳,博客地址:http://blog.sina.com.cn/calvinzhaoc (一) 2011 ...

  9. 深度揭秘腾讯云TSF日调用量超万亿次背后技术架构

    腾讯云TSF是整合外部开源框架和腾讯内部历经多年锤炼的PaaS平台打造而成的企业级分布式应用服务开发与托管平台,本文重点对TSF中负责服务托管的PaaS平台进行揭秘,从技术角度解析TSF 平台是如何每 ...

随机推荐

  1. crontab中引入环境变量(比如需要执行tomcat的关闭启动)

    起因 crontab中的定时任务,执行到关闭tomcat时,报环境变量找不到 解决方案 1.使用 . /etc/profile 引入环境变量 ###推荐, 实测ubuntu12 成功 2.使用 sou ...

  2. [leetcode-543-Diameter of Binary Tree]

    Given a binary tree, you need to compute the length of the diameter of the tree. The diameter of a b ...

  3. 【Android Developers Training】 99. 获取联系人详细信息

    注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...

  4. 【Android Developers Training】 40. 序言:通过NFC共享文件

    注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...

  5. Python系列教程(一):简介

    Python发展历史 起源 Python的作者,Guido von Rossum,荷兰人.1982年,Guido从阿姆斯特丹大学获得了数学和计算机硕士学位.然而,尽管他算得上是一位数学家,但他更加享受 ...

  6. Python对象类型及其运算

    Python对象类型及其运算 基本要点: 程序中储存的所有数据都是对象(可变对象:值可以修改 不可变对象:值不可修改) 每个对象都有一个身份.一个类型.一个值 例: >>> a1 = ...

  7. 【Python3之多进程】

    一.进程和线程的简单解释 进程(process)和线程(thread)是操作系统的基本概念,但是它们比较抽象,不容易掌握. 用生活举例: (转自阮一峰网络日志) 1.计算机的核心是CPU,它承担了所有 ...

  8. 基于springmvc的hessian调用原理浅析

    一.客户端 1.构造(初始化) 由客户端的配置文件随容器的启动而进行初始化,配置文件如下: <?xml version="1.0" encoding="UTF-8& ...

  9. ArrayList源码浅析(jdk1.8)

    ArrayList的实质就是动态数组.所以可以通过下标准确的找到目标元素,因此查找的效率高.但是添加或删除元素会涉及到大量元素的位置移动,所以效率低. 一.构造方法 ArrayList提供了3个构造方 ...

  10. 集合用法笔记-Map用法

    一.Map遍历 Map<String, String> map = new HashMap<String, String>(); map.put("1", ...