共计 5133 个字符，预计需要花费 13 分钟才能阅读完成。
摘要: 从自研内容生产平台、云原生实际，智能化到沉迷式、无码化，带你走进华为云官网开发团队，看华为云的前端大佬解读前端畛域新技术？
本文分享自华为云社区《华为云官网负责人明哥：咱们是如何做到门面不倒，8 个月挑战业界 Top 1?》，原文作者：华为云社区精选。
4 月的一个周五黄昏，刚刚完结一场语音会议的明哥，拿起桌上的咖啡，一口灌了上来。同时，翻了翻摊在右手边的笔记本，可能在思考行将抛给他的一些问题。
在华为曾经工作第 15 个年头的他，目前是华为云官网研发团队的技术负责人，看护着华为云对外的“门面”。
作为技术管理者，有个小习惯，“每天给本人留一些静默工夫，在这段时间内，尽量不解决邮件、工作信息，可能做一些代码开发、review、技术钻研的工作。”
他还习惯把事务性的工作都安顿在前半周，后半周能有绝对残缺的工夫，和团队的架构师、设计师零碎探讨比拟大的技术计划。
在钻研技术这块，明哥喜爱往下走，去看它的底层运行机制，它的源码。他也是“一万个小时定律”的拥趸者，始终深信积攒足够的工夫和精力，肯定能在技术上有所建树，举一反三。
所以，他能和团队仅用半年多的工夫，实现一次简直不可能的挑战。
再难，官网“门面”不能倒
在华为南京研究所露天长梯的二层平台上，始终竖着一块海报板：二战中被打得像筛子一样、浑身弹孔累累的伊尔 2 飞机，仍然保持航行，终于平安返回。
两年前的那个下午，明哥双手环胸站在办公室的落地窗前，紧紧盯着这块海报，思路却停在十分钟前接到的工作上：他的团队须要在无限的工夫内，实现官网内容生产平台的全副自研重构，且达到业界 Top1 的程度。
这是一次走出技术舒服圈的挑战，放弃他们十分相熟的技术架构，所有从头开始，好比明明有一条高速公路通往起点，然而你不能走，你得本人新建一条。
这期间，华为云官网团队既要保障日常业务的失常运行，循序渐进解决各种业务需要，又要抽调出足够的人手搭建新的内容平台，工夫紧、人手少、工作重。
在一直的技术研究，重写代码，验证测试后，我的项目的最小可用版本实现了 showcase，彼时大家都很有成就感，也感觉终于能缓一缓了。然而一个更紧急的工作再次抛向他们：为了疾速催熟产品，接下来的大促期间将间接应用自研零碎。
此时离大促还有两个月，开发团队除了要分出一部分兵力生产页面（为了确保用户体验，页面要全新设计），还要补齐高并发、高可用、平安可信等产品化所必须的能力。通常，这样的能力个别须要 3 到 6 个月，能力打磨欠缺。
明哥和团队只有破釜沉舟，那段时间里，工作板上写满了被拆分的工作细节，新的计划一直笼罩旧的版本，会议室里坐阵的技术专家走了一波，又新来一波……大家回绝斗争，一门心思埋头往前冲。
比方，为了保障生产进去的页面在任何状况下都不能丢，设计团队翻阅了大量材料，与平安、可用性、性能专家屡次探讨和原型验证，而后抉择了最‘冗余’的计划：
- 页面内容采纳多正本的形式备份到多个不同服务、物理介质上；
- 页面拜访的所有环节采纳多厂商、多节点的形式防止单点故障；
- 构建多个逃生通道，通过一键切换能力，实现流量的疾速切换。
最终这套计划胜利应答了屡次突发状况，禁受住了大促的考验。
历时 8 个月，从我的项目启动到第一个基于自研的内容生产页面诞生，官网团队交出了一份丑陋的成绩单。
“挑战十分大，但咱们胜利了。”
与此同时，他们“顺带”开发了一个PQP 页面品质平台，负责主动查看页面上线前的内容品质，包含页面的 404、敏感字词、中英文单词的拼写、图标的设计元素是否符合规范等等。
从接手华为云官网开始，品质就是悬在明哥头上的达摩克利斯之剑。用他的话说，“品质这个货色，不出问题的时候大家不会感觉多重要，凡是产生问题，就会成为人心所向，所谓善战之将无赫赫之功。”
如何保障页面品质稳固，这一点往往是不少前端技术人员漠视的。“咱们找征询公司，合作伙伴问了一圈，大家都没有这样的工具，更多的是靠流程保障，比方发现问题告诉 oncall，再逐层找到负责人。尽管管理手段可能运行上来，但效率太低了。”
所以，将这种“人拉肩扛”的问题解决形式，转化为工具能力，做成平台去赋能，再贯通到整个页面的公布流程，是一件成就感与挑战并存的事件。
以后，PQP 平台已在华为外部“开源”，包含华为官网在内的 80 多个网站都曾经接入，用于看护网站的内容品质。
谈及品质，不仅是页面内容的品质，还有官网稳定性的品质。试想，12306 的每一次解体，前面是多少用户的吐槽骂声。
为了保护华为云官网的稳定性，他们也针对高可用做了多层保障，比方多正本的容灾备份，数据多活等等，在寰球 4 个地区的 6 个机房都安置了华为云官网的服务器，并且洽购了 4 家不同的 CDN 厂商确保可能呈现的任何主客观危险，保障零中断。就像剥洋葱一样，剥开一层外面仍然保障完好无缺。
“华为云官网是咱们的门面，控制台、后盾服务或者能够挂，但官网就像上甘岭的那面旗号，哪怕是个光杆司令，我也不能倒，肯定要竖在那里。”
云原生藏在业务里
门面不能倒，为了这个指标，华为云官网的架构以及生产公布流程也在一直优化欠缺中。
以前端框架为例，React 性能弱小且灵便，Angular 有丰盛的组件，Vue 简洁易构建，选起来颇有些乱花渐欲迷人眼。
明哥也曾陷入抉择何种技术框架的纠结中，团队通过一番探讨，抉择了一个折中的形式——他们和 web 能力核心定下准则：根底能力团队保护一套支流技术框架和组件库，各业务团队有本人的选择权，能够间接应用，也能够依据须要抉择其余技术栈，但外围是听从对立的设计规范，达到即便不同技术栈生产的页面也能让用户无感知差别的成果。
正所谓好马配好鞍，让开发人员依据各自看护的业务个性找到最匹配的框架。
那么，如何将这些新、老技术栈，以及不同技术框架生产的页面放在一起出现给用户？
华为云 引入了微前端框架，让各个小团队，不同的技术栈都能共生。 微前端的目标是低耦合，它把各模块之间的影响降到最低，各模块能按需应用不同的技术栈，从而升高技术栈切换的老本，确保产品平滑过渡，防止一刀切带来的品质危险。
同时，所有的服务都部署在容器里的，所有皆代码。诸如应用程序、中间件、底层操作系统都被打包成规范的包，不论在什么环境，什么时候部署，模块都是一样的，不会呈现因为零碎、中间件的版本、配置不统一导致研发环境和生产环境状态不同的状况。这也是继续交付、疾速迭代的根底。
大的框架问题解决了，再往前走，还有很多至关重要的细节。
过后网站开发有个很典型的特点：不论是页面性能，还是页面内容的变动，都绕不开发人员，网页上任何一个轻微的变动都得去批改 html 代码或者 CSS 脚本。这种状况下，轻易批改一个字，开发需要排下来，小半个月过来了。
那么，怎样才能把开发人员从这些工作里释放出来呢？
所以有了页面生产平台，能够让业务人员自助实现页面批改；有了可视化搭建，拖拽组件即可实现所见即所得的网页制作；有了零碎的内容品质检测平台，可能保障页面的平安上线……
从人拉肩抗的低效率开发，到现在规范的页面公布流程，华为云官网的架构也进入到一个新的阶段：后盾采纳微服务架构，前端采纳微前端架构，页面上线恪守规范的 DevOps 流程，化繁为简，充分利用技术的个性，破除理论业务的瓶颈。
这也是明哥对于云原生的了解，“云原生自身并不能算一套架构，它更像是一个定义，一套方法论。 关上来看，云原生无非这几个要害元素：微服务、DevOps、继续交付、容器化。”
目前，DevOps 方面，华为云有一套对立的公布流水线平台，所有服务均通过这个平台公布到生产环境；继续交付方面，华为云官网有 65% 左右的个性是通过按个性独立公布的，每周都会有几百个个性公布到生产环境上。
让子弹再飞一会儿
康威定律里曾提到，组织的架构决定了整体的技术架构。因为华为云的前端和后端组织绝对拆散，单方各司其职，技术沟通中难免会产生一些小的摩擦。
不过，以后端技术浪潮汹涌而来之时，它也在试图用技术去弥合人为起因造成的各种沟通问题。
以 Node.js 为例，艰深点说它是运行在服务端的 JavaScript，让懂 JS 的前端人员写出简略的后端服务，实现一些接口的拼装。
“通过 Node.js，如果一个程序员针对一个简略的需要，从前端到后端都由他本人来实现，因为省去沟通老本以及同步版本公布的动作，效率能晋升 30%。”
这就是咱们常说的“大前端”、“全栈开发者”。而全栈能力就是消解一些组织团队互相配合产生的损耗，缩小损耗，天然能够给开发效率、模式带来质的晋升。
谈到开发效率的晋升，时下大火的 Serverless 正在掀起一场云计算畛域的反动，这场风暴也波及到了前端，对于此，明哥显得审慎很多。
Serverless 勾画了一个不须要搭建环境、部署中间件，没有特定应用场景、业务类型，只需部署代码的世界。
这是技术人员的“乌托邦”，但明哥认为以后的 Serverless 技术有肯定的局限性。开发团队不可能只应用一种技术或者组件，而不少技术或者框架，是须要在中间件、操作系统层面进行剖析调优工作，Serverless 目前没有达到这个灵活性和适配性。
“咱们也尝试过利用 Serverless 进步开发效率，比方把一些后盾执行不敏感、可用性较低的服务部署下来，再通过定时器触发，也能达到肯定成果。然而一旦波及到了全场景，尤其是多部件的解决方案，咱们就不会思考首选 Serverless 服务。”
“可能我比拟审慎，有先进或者新的技术，习惯性察看一阵子，让子弹再飞一会，技术成熟稳固后再跟上，那个时候也不晚。”
“咱们在技术栈抉择这条路上也走过不少弯路，前端团队抉择技术栈肯定要结合实际业务需要，再去察看技术栈的生态是不是继续演进中，随声附和、好高骛远不可取，如果没有适合的，宁愿自研也好过斗争。”
冲破技术标签，视线决定高度
回望前端技术的迭代，能够说是瞬息万变，新的框架、组件库层出不穷，新的编程语言一波波袭来……
涉猎不同技术栈的明哥始终在考虑，技术的目标是什么？在建设华为云官网的过程中，他仿佛找到了答案。
以 JAVA 为首的后端技术栈，在几十年的迭代中，无论是技术语言，还是框架都趋于稳定。相较之下，前端还朝着技术成熟曲线的峰顶狂奔中，将来也会逐步 从百花齐放过渡到一两个成熟稳固框架一统江山，一步步补全整个生态的阶段。
目前一些支流框架实质上也是大同小异，抉择一个畛域或者技术栈深耕，愈往下探，愈会发现其中的一致性法则。
大浪淘沙中，明哥认为比拟有后劲和摸索空间的三个技术方向是 沉迷式、智能化以及无码化。
首先是沉迷式的成果，所见即所得的前端正在谋求更丰盛的展示和互动模式。比方工业制作畛域的仿真模仿，能够对孪生的数字模型进行各种测试验证。同样，在前端畛域，也能把产品可视化地出现在网站上，让用户直观地感知解决方案的运作模式。
说到这里，他在空气中比划了一下，“你设想 把后盾看不见摸不着的一些组网解决方案搬到前台，很神奇，但也十分考验后端数据和前端渲染能力的联合，不过咱们正在致力。”
第二个是智能化，华为云官网更多是面向 ToB 的场景，无论是数据量，还是用户量都绝对较小，所以他们的指标是 在小数据量的状况下，达到精准的千人千面智能化举荐，晋升用户的注册转化率。同时，在适合的机会，尝试智能生产广告图或页面。
第三个方向是无码化，当初少数业务人员能够自主生产简略的页面，波及一些简单页面才有开发人员染指。当前，无论是面向经营人员，还是最终用户，越来越多的页面、接口、流程都会通过无码化的形式实现。
前端新技术的呈现，最终目标还是为了可能响应业务，疾速地解决生产、经营的需要，这也是所有技术都在摸索的方向。
到了这个阶段，大前端的领域也在裁减，明哥也更习惯站在架构师的角度去看背后出现的这些网页，察看它们背地的一系列逻辑。“凡是波及到用户可感知的内容，其实都是大前端要关注的，对于前端人员来说，前端不仅是一个技术，它更像是一个目标。”
最开始，前端这个概念在业界比拟含糊，前端人员都自嘲“切图仔”，也没有当初风行的三大框架，混沌初开，大家都摸着石头过河。
这个时代曾经一去不复还，现在的前端人员，技术是根底，在此之上的思维和视线则决定了技术的高度。
“一个很有意思的景象：大家经常在论坛上为哪个编程语言最好而争得面红耳赤。其实，囿于一个技术的优劣，就是在给本人贴标签。”
“就像有的前端人员会纠结技术路线，认为写页面看不到倒退空间，这是把本人困在“前端”的标签里。如果定位是一个简略的开发，一项技能足矣。但想要成长，得学会跳出那个圈子，换种思路，比方以进步用户体验为指标，能够学的技术就不只是某一个框架或语言。在此过程中，将本身的技术能力和定位从开发人员向架构师，乃至 CTO 的规范去晋升。”
心中有教堂，月亮和六便士，都能够领有。
点击关注，第一工夫理解华为云陈腐技术~