双11的极限挑战——5个极致目标教你玩转前端栈

  • 时间:
  • 浏览:0
  • 来源:大发5分快乐8_极速5分11选5

你这人 技术未来可不还要除理实际的体验、性能、挑选性的数据化诉求。更有意义的是,能更全地指标界定标准进入,可不还要全局量化分析产品(组)的业务体验。

客户端最大的风险在于,当服务端的接口不能自己 抗住数以十亿计的流量时,它会返回异常,前端的展示就会跳出难题。除理策略是,把服务端的每另一个 请求存储在另一个 OSS源后边,当异步的接口挂掉时,亲戚朋友 会从OSS获取存成静态的缓存的数据接口。

从双11的视角来看前端,前端工程师的未来不应该仅是框架/类库/组件/模块化等除理方案。端层不是数的方向被延伸:跨Native&Web、3D/VR/AR、服务层 、性能、数据可视化也有 未来的方向。新技术方案的跳出是为了满足现实中的渴求(AR互动)。双11你这人 场景是技术未来的某种投射,现在的亮点肯能是未来的日常。

上图最右边是终端可不还要搜集到的信息,左后边是设定的判断体验的衡量标准。将其结合在同去,基于逻辑来设计可不还要产出体验分析的报告,在此基础可不还要够做针对核心点的监控和基础数据的指导。

跨屏抢星衣的活动:当用户看直播时,明星在电视端丢出衣服,主持人提示用户打开手淘/猫客摄像头对准屏幕。APP通过AR技术识别和定位,成功后手机端会有衣服从电视浮出。你这人 实现的方案从逻辑上分为业务层和识别层。

肯能其他预案是不开启的,很多还要用监控支撑决策。很多,还要更细化的监控指标,通过关键数据大盘指导预案判断。

标准:为什么我么我来验证30%可用?服务端的异常均有灾备和预案,终端不能自己 业务展示异常。切入点是整个系统/服务中的关键节点,以及节点之间的链路。

大会所有资源(视频回放、PDF、文章分发)一键下载:https://yq.aliyun.com/articles/65238

终端肯能发生的异常和风险更多来自服务端API的压力。当扛不住蜂拥而来的流量时,服务会跳出延迟甚至crash愿因终端异常展示 。服务端主可是我我 CDN - 源站 - 到存储层的三层架构。

优化前,通过分发性能数据保证工作的可靠有用。在客户端启用数据上报的能力推送到后端的系统,通过在线系统分析把它呈现在数据大屏上。当另一个 优化完成前一天,理论上应该在线上看得人结果,肯都可以自己 看得人,说明你这人 优化是无效的。

大会系列分发文章:

本地磁盘容灾预案是所有预案中优先级别最高的。

在所有的资源下载后边,图片Size是最大的。在前端设计了另一个 校验法律土方式来管控无效的、超大的图片。在运营提交好正确的图片前一天,让用户信息在最少的环境下面来加载当前环境最最少的图片。

针对15年跳出的白屏请况,做了另一个 分解和思考。把整个时间分为两次责,加载时间(DNS查询、建链、资源下载)和渲染时间(VDOM的创建和渲染),整体配备了全链路的性能监控。

ETag是HTTPS的另一个 标准支持。当请求到达服务端,服务器判断该请求不是被更新,肯能肯能被更新就直接返回另一个 304的头,不再把内容传输过去。从图中可看出,优化前一天,建链的时间最少在30-30ms之间,大大节省了请求时间。

不支持HTTPS, 就会跳出上图右边中的不和谐内容。要做到你这人 点不仅还要保证终端 CDN的请求 加密,还还要CDN到源站的请求同样实现加密态,全链路流量启用HTTPS。

12月6日-7日,由阿里巴巴集团、阿里巴巴技术发展部、阿里云云栖社区联合主办,以“2016双11技术创新”为主题的阿里巴巴技术论坛(Alibaba Technology Forum,ATF)成功在线举办。在本次论坛中,2016双11前端总PM、天猫前端Team leader舒文亮分享了双11中的前端的极限挑战。他主要介绍了双11中的前端栈,八个极致目标(从后到前的30%可用、秒开体验、AR和3D体验、可视的体验监控、人性化的无障碍端体验)的实现过程和法律土方式,以及前端未来的发展。

为了都都都可以更好的服务视力有匮乏的人,成立了天猫信息无障碍项目,负责对APP和WEB站点进行信息无障碍改进。

在方案之初引入了Weex,都都都可以在底层级来优化渲染。

亲戚朋友 如保评价挑选性?平时习惯于关注常态30%的难题(比如图片不是显示?),很少有能力判断业务达到用户的真实体验。亲戚朋友 的目标是构建用户的真实体验指标,基于核心的监控来驱动体验优化。

觉得,CSS 3D也可不还要实现原本的效果,不仅仅是WebGL/OpenGL。如保让 CSS 3D在实际的开发过程中,会跳出以下难题:地皮带来的Dom数量增加;地皮和Dom一一对应面对需求迭代成本不可控;环状的Transform效果引发黑屏、闪烁等难题。

3D狂欢城觉得是在原本2D的基础上做的3D效果的互动场景。滚筒模式最大的坏发生于什么场景下面某另一个 品牌露出的区域和空间比较小,最后,结合滚筒和广告牌使得品牌有更大的曝光时间和面积。

这八个目标是按照逻辑往右追溯。首先还要确保可用,如保让 确保秒级体验,在你这人 基础上增加互动的玩法,什么也有 开发者层。当开发者工作开使 前一天,更多的工作是在数据的可视化上来验证开发的挑选性。在此基础上,更多涉及人文关怀方面的无障碍端体验。

后边是生产体系,从左到右是研发链。在开发者你这人 层,工程师主要在Weex、前端安全、性能、框架等领域做基础的准备工作,在实际的开发阶段,会把工程提交到Gitlab上。构建系统拿到提交上来的代码再索引到页面系统中。数据系统和页面系统产生页面的模板次责、数据次责分别存储到OSS中的Page和Data中。下方是用户请求的链路,当请求发起也有直接抵达CDN,CDN判断肯能页面发生就直接返回给终端,肯能不发生则向渲染集群发送回源请求, 向OSS拉资源并将其渲染出来,再通过Page CDN返回。最下方是异步的接口,会有异步服务的接口向终端返回个性化的数据。