2天时间,聊今年最热的 Agent、上下文工程、AI 产品创新等话题。2025 年最后一场~ 了解详情
写点什么

跳出前端看前端,才能跟别人平等对话

  • 2020-02-06
  • 本文字数:2935 字

    阅读完需:约 10 分钟

跳出前端看前端,才能跟别人平等对话


对于很多前端同学来说,如何在工作中掌握更多的话语权,甚至主导解决方案,是他们当前很关注的问题。在这方面应该怎么做呢?在 GMTC 全球大前端技术大会(深圳站)2019 现场,InfoQ 记者采访了阿里巴巴高级前端专家,ICBU (阿里巴巴国际事业部)性能架构师易晓峰,请教这个问题。作为无线前端和工程团队的负责人,他认为现在前端越来越复杂,很多问题需要多方协同解决,所以要跳出前端再去看前端。如果只盯着前端自己的领域,很难去跟别人平等对话。前端需要保持一个空杯心态,多向后端、客户端同学学习。


InfoQ:请您介绍一下您在阿里巴巴的经历以及您团队的基本情况。


易晓峰:我是 2015 年加入的阿里巴巴,一直在阿里巴巴的国际事业部,也就是 ICBU,我们是一个面向全球用户的国际化团队。我加入后就进入了刚刚组建的无线前端团队,算是见证了整个阿里巴巴国际站无线化的发展。目前我主要负责无线前端以及工程团队,今年团队主要是在跨端和性能两个方向上。


InfoQ:对于一个面向全球用户的大型电商网站,它在性能优化上要重点考虑哪些因素?


易晓峰:性能优化我觉得通常会存在一个“不可能三角”,什么叫“不可能三角”呢?就是性能、规模、成本这三者你只可取其二,很难三者兼得。对我们来说,能通过哪些方式朝向三者兼得的目标去突破是我们的重点。


所以我们做性能优化基本上会考虑这几个方面:第一,我们的方案对于整体性能能够提升多少;第二,我们的方案是不是能够规模化;第三,我们要考虑这个方案的成本。


对于阿里巴巴这么大一个网站,不可能像一个小网站一样通过整体重构去提升性能。做一个 Case 的性能极致很容易,但是如果我们要在低成本规模化下达到性能极致,这是相当难的,我把它叫性能的工业化生产,如果一个性能方案做不到工业化生产,它可能就不是一个特别好的方案。


还有一个重点就是要考虑到国际化的特殊性,包括地区的差异性、物理距离、用户分散等复杂的问题。这些特殊性会给我们的性能优化带来很多挑战,有些行之有效的方案可能需要调优才能工作得好,有些大家认为完全不会是问题的可能会成为问题。


InfoQ:具体到阿里巴巴,在性能优化上我们是怎么做的?


易晓峰:我们主要围绕两个方向 。第一个方向是减少资源的响应时间;第二个方向是降低执行运算的复杂程度。但跟传统的前端性能优化不太一样的是:我们会从网、云、端整个链路去看性能的优化。


在网络层面,我们会有如 BBR 加速、动态加速、边缘流式渲染等;在云端,我们会做 SSR、API 优化、链接复用等;在端上,会有各种缓存策略、API 加载等性能的优化。此外我们对数据也非常重视,会花很大精力做数据的度量、数据的采集,因为数据不只是可以让我们的优化成果得以呈现,还能够指导我们去做优化。打个比方,全球网络最差地区,跟网络最快地区,可能相差 70 倍,这么高的一个网速的差别,用户硬件设备在体验上的差别也会很大。所以我们会基于数据去做分层,了解整个链路中的每个环节时间的消耗。例如一个用户它可能是从 Facebook 跳过来的,经历了很多次跳转到你这边来,性能可能就会比较差;但如果说用户直接打开网页,性能就会好一些。不同的设备,不同的网络,性能到底阻塞在哪里,我们都要通过数据去发现问题,然后去寻找解决方案。


InfoQ:随着业务的发展,我们性能优化工作的重心发生过哪些变化?


易晓峰:我们性能优化这块可以分成三个阶段。第一阶段叫做蛮荒时代。什么叫蛮荒时代?就是纯靠体感进行优化。比如老板去国外,回来说我们网站太慢了;或者大家自己觉得最近我们这个网站太慢了;或者程序员良心发现,觉得太慢了,我们应该把它修一修。这个时候主要就是纯前端层面的优化,比如说 JS 大小,或者拿着雅虎前端优化的 35 条军规对一对,做一下优化;或者一些什么通用的优化方案,做一做看一看。


第二个阶段叫做工业化时代。我们建立了一个多维度全链路的度量分析体系,以及数据监测体系,同时我们在网、云、端做全方位优化。


第三个阶段很快就会到来,叫做精细化时代。为什么要精细化呢?因为我们现在性能优化已经进入了深水区,这时候就需要去精耕细作,用数据驱动的方式去做差异化的优化,根据不同用户客观环境(网络、用户设备)和主观环境(用户行为及动线)去做差异化优化。


InfoQ:您个人比较关注前端领域哪些技术发展趋势?


易晓峰:首先我比较关注跨端;其次比较关注性能;第三比较关注 D2C(Design to Code)。另外就是边缘计算,虽然到现在这个技术的基建还是非常薄弱,但是我觉得它未来是有无限可能的;除此之外,我们还很关注 Google 的技术,毕竟我们是一个国际化团队,像 Google 推出的 PWA、AMP,以及我们现在和 Google 合作的 TWA,都是我们关注的重点。


InfoQ:您的角色还挺神奇的,又负责前端,同时又是性能架构师,为什么会有一个这样复合的角色呢?此外对于希望从前端转向架构师的同学,您有何建议和忠告?


易晓峰:我觉得性能跟前端本身就比较相关,前端重体验,而性能又是体验的一部分。你服务器的性能好不好用户不一定能感知到,用户感知的都是跟前端相关的东西。其实我们在做性能优化的时候一直在提一个概念:“用户不是要真的快,他是要感知到快”。性能这个事情本身在前端的视角去看会更合适,或者准确来讲,它叫做用户视角,因为我们离用户更近,我们更有责任、也有义务去把这个事情做好。


建议和忠告不敢说,只能说一点浅见吧。现在前端面临的问题越来越复杂,很多问题我们需要结合多方一起解决,我们需要跳出前端看前端,如果只是盯着前端这个领域,很难平等对话及主导解决方案。现在要在前端领域做好,除了前端专业的知识,还需要很多的服务器、客户端、数据库、网络等多方面的累积。所以我们也需要保持空杯心态,多向后端、客户端学习。


InfoQ:2019 年在大前端领域,您觉得有哪几个技术发展是超过预期的?2020 年您对趋势的预判是什么?


易晓峰:第一个是跨端跨容器技术,2019 年我觉得跨端技术太繁荣了,百花齐放,比如 SwiftUI、Flutter,以及各种小程序的解决方案;另外就是 D2C,过去一年我们在这块儿发展还是挺好的。


我再说说 Serverless,2019 年大家都在讲 Serverless。Serverless 是云计算发展到一定阶段之后的一个比较有意思的产物,我觉得它会彻底改变前后端的协作模式。后端未来可能更专注于领域模型的建设,前端可能更专注于产品的建设。过去这个中间呢,其实有很多牵扯。大家都讲前后端分离,但是怎么去分离?大家本质上还是在组成一个东西。现在如果是基于 Serverless 这种方式,就是让前端拥有控制数据的能力,同时你又不用去担心这个服务器的运维问题,我觉得这个对于前端会带来很多变化。还有一个就是现在部署在 CDN 边缘结点上的 Serverless,这个会给前端带来非常多的可能。我们现在正在做的边缘流式渲染,就是利用了 CDN 边缘结点 Serverless 的能力。


当然在我看来无论是跨端技术,还是 Serverless、D2C、边缘计算,我都很看好他们在 2020 年的发展前景。


嘉宾介绍:


易晓峰,阿里巴巴高级前端专家,ICBU (阿里巴巴国际贸易)性能架构师,负责无线前端 &工程团队。2018 年主要负责性能优化,从网、云、端全方位优化三端性能,让海外用户的性能得到了极大幅度的提升,同时还建立起用户视角的国际化性能监测及度量体系。欢迎对国际化事业有兴趣的前端朋友们加入我们:微信:wvv8oo。


2020-02-06 16:103066

评论 1 条评论

发布
用户头像
lol
2020-02-07 16:32
回复
没有更多了
发现更多内容

MyCat:第四章:Mycat中的概念,linux内核编译教程

Java 程序员 后端

MySQL数据库--几种数据迁移的方法详解都在这了!看完必懂

Java 程序员 后端

Netty权威指南:I-O-多路复用技术,java技术点总结

Java 程序员 后端

Netty案例介绍-群聊案例实现,java架构师教程百度云

Java 程序员 后端

Netty相关面试题汇总,java从入门到精通第五版电子书下载微盘

Java 程序员 后端

P8级大佬整理在Github上45K+star手册,吃透消化,java算法面试题及答案pdf

Java 程序员 后端

MySQL 5,java架构师成长直通车

Java 程序员 后端

MySql数据引擎简介与选择方法,和字节跳动大佬的技术面谈

Java 程序员 后端

OpenFaaS实战之二:函数入门,mysql集群数据同步原理

Java 程序员 后端

Oracle最新的Sql笔试题及答案,Java面试真题解析火爆全网

Java 程序员 后端

MySQL 千万数据量深分页优化,mybatis从入门到精通pdf

Java 程序员 后端

MySQL:第一次看到有人把MYSQL主从复制讲解的这么清楚,mysql教程菜鸟

Java 程序员 后端

Netty中序列化框架MessagePack的简单实现,java技术面试完了复试

Java 程序员 后端

Netty学习之旅------图说Netty线程模型,java项目面试难点

Java 程序员 后端

Netty进阶:手把手教你如何编写一个NIO服务端,java集合容器面试

Java 程序员 后端

Nginx配置反向代理和负载均衡,疯狂java讲义pdf百度云

Java 程序员 后端

RabbitMQ不讲武德,发个消息也这么多花招,nginx实现负载均衡原理

Java 程序员 后端

MySQL 事务隔离级别,java面试常问的设计模式

Java 程序员 后端

MySQL 数据库开发入门(四),java高薪训练营百度网盘

Java 程序员 后端

Navicat for MySQL 执行sql文件过程分析(导入数据),中软国际Java笔试题

Java 程序员 后端

Netty进阶:手把手教你如何编写一个NIO服务端(1),Java笔试常见编程题

Java 程序员 后端

Peter-Java 8中的Lambda表达式,java领域的相关技术领域

Java 程序员 后端

【架构实战营】模块三

衣谷

架构实战营

MyCat教程【分库分表】,java教程pdf百度网盘

Java 程序员 后端

MySQL最全整理(面试题+笔记,华为算法工程师面试经历汇总

Java 程序员 后端

new-Object()到底占用几个字节,看完这篇彻底明白了!,springboot微服务架构书籍

Java 程序员 后端

OpenYurt v0,linuxshell学习

Java 程序员 后端

MySQL入门篇,java三层架构登录功能实现

Java 程序员 后端

Netty入门教程——认识Netty,今年最新整理的《高频Java面试题集合》

Java 程序员 后端

Nginx + Tomcat 搭建负载均衡,大牛带你直击优秀开源框架灵魂

Java 程序员 后端

Nginx服务不行了怎么办,网商银行java面试

Java 程序员 后端

跳出前端看前端,才能跟别人平等对话_大前端_张晓楠_InfoQ精选文章