关于前端框架:华为云官网负责人明哥我们是如何做到门面不倒8个月挑战业界翘楚

117次阅读

共计 5240 个字符,预计需要花费 14 分钟才能阅读完成。

本文分享自华为云社区《华为云官网负责人明哥:咱们是如何做到门面不倒,8 个月挑战业界翘楚?》,原文作者:华为云社区精选。

4 月的一个周五黄昏,刚刚完结一场语音会议的明哥,拿起桌上的咖啡,一口灌了上来。同时,翻了翻摊在右手边的笔记本,思考行将抛给他的一些问题。

在华为曾经工作第 15 个年头的他,目前是华为云官网研发团队的技术负责人,看护着华为云对外的“门面”。

作为技术管理者,明哥有个小习惯,“每天给本人留一些静默工夫,在这段时间内,尽量不解决邮件、工作信息,可能做一些代码开发、review、技术钻研的工作。”

他还习惯把事务性的工作都安顿在前半周,后半周能有绝对残缺的工夫,和团队的架构师、设计师零碎探讨比拟大的技术计划。

在钻研技术这块,明哥喜爱往下走,去看它的底层运行机制,它的源码。他也是“一万个小时定律”的拥趸者,始终深信积攒足够的工夫和精力,肯定能在技术上有所建树,举一反三。

所以,他能和团队仅用半年多的工夫,实现一次简直不可能的挑战。

再难,官网“门面”不能倒

在华为南京研究所露天长梯的二层平台上,始终竖着一块海报板:二战中被打得像筛子一样、浑身弹孔累累的伊尔 2 飞机,仍然保持航行,终于平安返回。

两年前的下午,明哥双手环胸站在办公室的落地窗前,紧紧盯着这块海报,思路却停在十分钟前接到的工作上:他的团队须要在无限的工夫内,实现官网内容生产平台的全副自研重构,且达到业界当先的程度。

这是一次走出技术舒服圈的挑战,放弃他们十分相熟的技术架构,所有从头开始,好比明明有一条高速公路通往起点,然而你不能走,你得本人新建一条。

这期间,华为云官网团队既要保障日常业务的失常运行,循序渐进解决各种业务需要,又要抽调出足够的人手搭建新的内容平台,工夫紧、人手少、工作重。

在一直的技术研究,重写代码,验证测试后,我的项目的最小可用版本实现了 showcase,彼时大家都很有成就感,也感觉终于能缓一缓了。然而一个更紧急的工作再次抛向他们:为了疾速催熟产品,接下来的大促期间将间接应用自研零碎。

此时离大促还有两个月,开发团队除了要分出一部分兵力生产页面(为了确保用户体验,页面要全新设计),还要补齐高并发、高可用、平安可信等产品化所必须的能力。通常,这样的能力个别至多须要 3 到 6 个月,能力打磨欠缺的差不多。

明哥和团队只有破釜沉舟,那段时间里,工作板上写满了被拆分的工作细节,新的计划一直笼罩旧的版本,会议室里坐阵的技术专家走了一波,又新来一波……大家回绝斗争,一门心思埋头往前冲。

比方,为了保障生产进去的页面在任何状况下都不能丢,设计团队翻阅了大量材料,与平安、可用性、性能专家屡次探讨和原型验证,而后抉择了最‘冗余’的计划,最终胜利应答屡次突发状况,禁受住了大促的考验。

历时 8 个月,从我的项目启动到第一个基于自研的内容生产页面诞生,官网团队交出了一份丑陋的成绩单。

“挑战十分大,但咱们胜利了。”

与此同时,他们还“顺带”开发了一个PQP 页面品质平台,负责主动查看页面上线前的内容品质,包含页面的 404、敏感字词、中英文单词的拼写、图标的设计元素是否符合规范等等。

从接手华为云官网开始,品质就是悬在明哥头上的达摩克利斯之剑。用他的话说,“品质这个货色,不出问题的时候大家不会感觉多重要,凡是产生问题,就会成为人心所向,所谓善战之将无赫赫之功。”

如何保障页面品质稳固,这一点往往是不少前端技术人员漠视的。“咱们找征询公司,合作伙伴问了一圈,大家都没有这样的工具,更多的是靠流程保障,比方发现问题告诉 oncall,再逐层找到负责人。尽管管理手段可能运行上来,但效率太低了。”

所以,将这种“人拉肩扛”的问题解决形式,转化为工具能力,做成平台去赋能,再贯通到整个页面的公布流程,是一件成就感与挑战并存的事件。

以后,PQP 平台已在华为外部“开源”,包含华为官网在内的 80 多个网站都曾经接入,用于看护网站的内容品质。

谈及品质,不仅是页面内容的品质,还有官网稳定性的品质。试想,12306 的每一次解体,前面是多少用户的吐槽骂声。

为了保护华为云官网的稳定性,他们也针对高可用做了多层保障,比方多正本的容灾备份,数据多活等等,在寰球 4 个地区的 6 个机房都安置了华为云官网的服务器,并且洽购了 4 家不同的 CDN 厂商躲避可能呈现的任何主客观危险。构建多个逃生通道,一键实现流量的疾速切换。就像剥洋葱一样,剥开一层外面仍然保障完好无缺。

“华为云官网是咱们的门面,控制台、后盾服务或者能够挂,但官网就像上甘岭的那面旗号,哪怕是个光杆司令,我也不能倒,肯定要竖在那里。”

云原生藏在业务里

门面不能倒,为了这个指标,华为云官网的架构以及生产公布流程也在一直优化欠缺中。

以前端框架为例,React 性能弱小且灵便,Angular 有丰盛的组件,Vue 简洁易构建,选起来颇有些乱花渐欲迷人眼。

明哥也曾陷入抉择何种技术框架的纠结中,团队通过一番探讨,抉择了一个折中的形式——他们和 web 能力核心定下准则:根底能力团队保护一套支流技术框架和组件库,各业务团队有本人的选择权,能够间接应用,也能够依据须要抉择其余技术栈,但 外围是听从对立的设计规范,达到即便不同技术栈生产的页面也能让用户无感知差别的成果。 正所谓好马配好鞍,让开发人员依据各自看护的业务个性找到最匹配的框架。

但问题随之而来,如何将这些新、老技术栈,以及不同技术框架生产的页面放在一起出现给用户?

华为云引入了 微前端框架,让各个小团队,不同的技术栈都能共生。微前端的目标是低耦合,它把各模块之间的影响降到最低,各模块能按需应用不同的技术栈,从而升高技术栈切换的老本,确保产品平滑过渡,防止一刀切带来的品质危险。

同时,所有的服务都部署在容器里的,所有皆代码。诸如应用程序、中间件、底层操作系统都被打包成规范的包,不论在什么环境,什么时候部署,模块都是一样的,不会呈现因为零碎、中间件版本、配置不统一引发的研发环境和生产环境状态不同的状况。这也是继续交付、疾速迭代的根底。

从人拉肩抗的低效率开发,到现在规范的页面公布流程,华为云官网的架构也进入到一个新的阶段:后盾采纳微服务架构,前端采纳微前端架构,页面上线恪守规范的 DevOps 流程,化繁为简,充分利用技术的个性,破除理论业务的瓶颈。

举个例子,以前的网站开发不论是页面性能,还是页面内容的变动,都绕不开发人员,网页上任何一个轻微的变动都得去批改 html 代码或者 CSS 脚本。这种状况下,轻易批改一个字,开发需要排下来,小半个月过来了。

为了让大家都能失去“解脱”,所以有了页面生产平台,能够让业务人员自助实现页面批改;有了可视化搭建,拖拽组件即可实现所见即所得的网页制作;有了零碎的内容品质检测平台,可能保障页面的平安上线。通过 IT 化,让所有上线动作都高效可控,买通官网内容 DevOps 的最初一环。

这也是明哥对于云原生的了解,“云原生自身并不能算一套架构,它更像是一个定义,一套方法论。关上来看,云原生无非这几个要害元素:微服务、DevOps、继续交付、容器化。”

目前,DevOps 方面,华为云有一套对立的公布流水线平台,所有服务均通过这个平台公布到生产环境;继续交付方面,华为云官网有 65% 左右的个性是通过按个性独立公布的,每周都会有几百个个性公布到生产环境上。

让子弹再飞一会儿

康威定律里曾提到,组织的架构决定了整体的技术架构。因为华为云的前端和后端组织绝对拆散,单方各司其职,技术沟通中难免会产生一些小的摩擦。不过,以后端技术浪潮汹涌而来之时,它也在试图用技术去弥合人为起因造成的各种沟通问题。

以 Node.js 为例,艰深点说它是运行在服务端的 JavaScript,能够让懂 JS 的前端人员写出简略的后端服务,实现一些接口的拼装。“通过 Node.js,如果一个程序员针对一个简略的需要,从前端到后端都由他本人来实现,因为省去沟通老本以及同步版本公布的动作,效率能晋升 30%。”

明哥示意,这就是咱们常说的“大前端”、“全栈开发者”。而全栈能力就是消解一些组织团队互相配合产生的损耗,缩小损耗,天然能够给开发效率、模式带来质的晋升。

谈到开发效率的晋升,时下大火的 Serverless 正在掀起一场云计算畛域的反动,这场风暴也波及到了前端,对于此,明哥显得审慎很多。

Serverless 勾画了一个不须要搭建环境、部署中间件,没有特定应用场景、业务类型,只需部署代码的世界。这是技术人员的“乌托邦”,但明哥认为以后的 Serverless 技术有肯定的局限性。开发团队不可能只应用一种技术或者组件,而 不少技术或者框架,是须要在中间件、操作系统层面进行剖析调优工作,Serverless 目前没有达到这个灵活性和适配性。

华为云官网团队也尝试过利用 Serverless 进步开发效率,比方把一些后盾执行不敏感、可用性要求较低的服务部署下来,再通过定时器触发,也能达到肯定成果。然而只有波及到全场景,尤其是多部件的解决方案,就不会思考首选 Serverless 服务。

“可能我比拟审慎,有先进或者新的技术,习惯性察看一阵子,让子弹再飞一会,技术成熟稳固后再跟上,那个时候也不晚。”

明哥在技术栈抉择这条路上也走过不少弯路,他认为,前端团队抉择技术栈肯定要结合实际业务需要,再去察看技术栈的生态是不是继续演进中,随声附和、好高骛远不可取,如果没有适合的,宁愿自研也好过斗争。

冲破技术标签,视线决定高度

回望前端技术的迭代,能够说是瞬息万变,新的框架、组件库层出不穷,新的编程语言一波波袭来……

涉猎不同技术栈的明哥始终在考虑,技术的目标是什么?在建设华为云官网的过程中,他仿佛找到了答案。

以 JAVA 为首的后端技术栈,在几十年的迭代中,无论是技术语言,还是框架都趋于稳定。相较之下,前端还朝着技术成熟曲线的峰顶狂奔中,将来也会逐步 从百花齐放过渡到一两个成熟稳固框架一统江山,一步步补全整个生态的阶段。

目前一些支流框架实质上也是大同小异,抉择一个畛域或者技术栈深耕,愈往下探,愈会发现其中的一致性法则。

大浪淘沙中,明哥认为比拟有后劲和摸索空间的三个技术方向是 沉迷式、智能化以及低码化。

首先是沉迷式的成果,所见即所得的前端正在谋求更丰盛的展示和互动模式。比方工业制作畛域的仿真模仿,能够对孪生的数字模型进行各种测试验证。同样,在前端畛域,也能把产品可视化地出现在网站上,让用户直观地感知解决方案的运作模式。

说到这里,他在空气中比划了一下,“你设想 把后盾看不见摸不着的一些组网解决方案搬到前台,计划中的流程、数据流动都是能够看失去的,很神奇,但也十分考验后端数据和前端渲染能力的联合,不过咱们正在致力。”

第二个是智能化,一方面华为云官网团队会在搜寻和举荐中进一步优化智能算法和策略,达到精准的千人千面智能化举荐,晋升用户的注册转化率;另一方面,团队会在内容的智能生产方面,包含文章、图片、广告等,做出更多的摸索,帮助经营人员、业务人员生产出更高质量的内容。

第三个方向是低码化,当初少数业务人员能够自主生产简略的页面,波及一些简单页面才有开发人员染指。当前,无论是面向经营人员,还是最终用户,越来越多的页面、接口、流程都会通过低码化或者无码化的形式实现。

前端新技术的呈现,最终目标还是为了可能响应业务,疾速地解决生产、经营的需要,这也是所有技术都在摸索的方向。

到了这个阶段,大前端的领域也在裁减,明哥也更习惯站在架构师的角度去看背后出现的这些网页,察看它们背地的一系列逻辑。“凡是波及到用户可感知的内容,其实都是大前端要关注的,对于前端人员来说,前端不仅是一个技术,它更像是一个目标。”

最开始,前端这个概念在业界比拟含糊,前端人员都自嘲“切图仔”,也没有当初风行的三大框架,混沌初开,大家都摸着石头过河。

这个时代曾经一去不复还,现在的前端人员,技术是根底,在此之上的思维和视线则决定了技术的高度。

“比方大家经常在论坛上为哪个编程语言最好而争得面红耳赤。其实,囿于一个技术的优劣,就是在给本人贴标签。就像有的前端人员会纠结技术路线,认为写页面看不到倒退空间,这是把本人困在‘前端’的标签里。”

“如果你的定位是一个简略的开发,一项技能足矣。但想要成长,得学会跳出那个圈子,换种思路,比方以进步用户体验为指标,能够学的技术就不只是某一个框架或语言。在此过程中,将本身的技术能力和定位从开发人员向架构师,乃至 CTO 的规范去晋升。”

心中有教堂,月亮和六便士,都能够领有。

福利工夫到:

欢送大家到原文(https://bbs.huaweicloud.com/b…

福利一: 看完华为云官网的业务实际,以及明哥对前端技术的思考,如果你也有业务或者技术上的纳闷,在评论区留言,明哥将空降评论区,现场答疑解惑。

福利二: 分享本文到朋友圈,截图私信【华为云社区精选】,小编将按点赞数抉择前 3 位赠送前端大礼包,内含首次公开的华为云官网内部资料,以及明哥举荐书籍《畛域驱动设计》一套。

点击关注,第一工夫理解华为云陈腐技术~

正文完
 0