大前端 2020 年前瞻:有哪些你不能错过的技术趋势?

阅读数:3719 2019 年 12 月 18 日 06:00

大前端2020年前瞻:有哪些你不能错过的技术趋势?

提起大前端,总会有人抱怨“学不动”了,因为新东西实在太多。2019 年的大前端领域虽然并没有出现什么颠覆性技术,但是 Flutter、WebAssembly、Serverless 的火爆发展还是超乎我们预期,也让我们进一步看到大前端的融合趋势。在即将到来的 2020 年,大前端领域又有哪些你不能错过的技术趋势呢?正值 GMTC2019 全球大前端技术大会召开之际,我们采访了大会四位专题出品人:PayPal Senior Software Engineer 于航,腾讯前端技术专家 / 总监、IVWEB 团队负责人刘恒兵(河伯),腾讯 QQ 小程序前端负责人黄佳琳,阿里巴巴前端技术专家桑世龙(狼叔),请他们对 2020 年进行展望,同时也阐述 2020 年前端从业者可能将要面临的挑战。

大前端2020年前瞻:有哪些你不能错过的技术趋势?

InfoQ:2019 年即将过去,在今年大前端领域,您印象最深刻(或者认为最重要)的一件事情是什么?

于航:我印象最深的要属 WebAssembly 在 2019 年的飞速发展了。从 3 月份 Mozilla 提出 WASI (WebAssembly 系统接口,WebAssembly System Interface)的概念到后来成立 ByteCode Alliance 联盟(字节码联盟),再到最近 WebAssembly 进入 W3C 成为正式推荐标准,Wasm 在 “out-of-web” 领域的发展着实迅速。不仅如此,伴随着谷歌和 Mozilla 强有力的推广和在 Chrome 以及 Firefox 上对 MVP 标准的快速实现,Wasm 目前已经或者正准备逐渐取代 PNaCl、SIMD.js 甚至 ASM.js 等昔日的流行技术。

刘恒兵(河伯):2019 年我认为相对重要的是 TypeScript 的大规模普及和流行,至少在我们团队,TypeScript 已经跟 JavaScript 并行成为我们的重要选择了。当然选这个的原因还在于 TypeScript 的普及会反向推动 ES6(ECMAScript 6.0)的进步和发展。我们知道在最近 Node.js 13.2.0 版本中,正式支持了 ECMAScript modules,这些新特性的逐渐支持其实也源于社区内先行者们的探索和实践,正因为这样的努力才最后推动了 JavaScript 的进一步发展。

黄佳琳:2019 年印象最深的是小程序的发展,以及各大主流 App 纷纷推出小程序平台。小程序发展至今,热度不断攀升,目前小程序平台越来越多,这也促使各种跨平台的小程序框架不断涌现。已有的框架在性能和兼容性方面也在持续优化(例如 taro 和 uni-app 都会在本次 GMTC 大会上有相关的分享),同时也出现了像 kbone 这样的新思路。结合小程序云的开发能力,越来越低的开发门槛将持续刺激小程序的发展。

InfoQ:在今年年初您对大前端领域的趋势预测中,如今看来跟您预测最相符的一个技术趋势是什么?最超乎您预期的一个技术趋势是什么?

桑世龙(狼叔):在我看来,今年大前端增速放缓,并没有出现很多颠覆性的技术,反而在细分领域厮杀得非常厉害,我想这是好事,意味着前端正在走向成熟。这点从框架、语言,甚至是前后端分工上都有体现。比如 Flutter ,跨端能力进一步增强;比如小程序,不断涌现出各种转译实现,例如 Wepy、Taro 等, ReactReconciler 出现之后,出现了 Remax 框架,通过 Remax 把生成的「虚拟 DOM」渲染到视图层,从而做到了使用真正的 React 去构建小程序;比如 React,能讲的新特性并不多,在 Create-React-App 火爆之后,类似的支付宝的 Umi 框架也正在悄然兴起,尤其值得一提的是 Umi UI,在可视化辅助编程领域可谓一个新的突破。但无论怎么看,这些都不算是颠覆性的变革,而是在深度上更精进一步。

在 Node.js 领域,今年新东西也不多。最新已经发布到 v13,lts 是 v12,Egg.js 的生态持续完善,进度也不如前两年,成熟之后的创新就少了。在很多框架上加入 TypeScript 似乎已经大致正确,比如自身是基于 TypeScript 的 Nest 框架,比如阿里也开源了基于 Egg 生态的 Midway 框架。另外,GraphQL 也有很强的应用落地场景,尤其是 Apollo 项目带来的改变最大,极大地降低了落地成本。已经用 Rust 重写的 Deno 在稳步发展中,没有火起来,但也有很高的关注度,它不会替代 Node.js,而会是基于 Node 之上的一种更好的尝试。

大家可能会感觉 Node.js 热度不够,但事实上很多做 Node.js 的人已经投身到研发模式升级上了。对于今天的 Node.js 来说,会用很容易,但用好很难,比如高可用、性能调优,这些还是非常有挑战的。我们可以假想一下,流量打网关,网关根据流量来实例化容器,加载 FaaS 运行时环境,然后执行对应函数提供服务。在整个过程中,不许关心服务器和运维工作,不用担心高可用问题,是不是前端可以更加轻松地接入 Node.js?这其实就是当前大厂在前端做的基于 Serverless 的实践,比如基于 FaaS 如何做服务编排、页面渲染、网关等。接入 Serverless 不是目的,目的是让前端能够借助 Serverless 创造更多业务价值。

于航:最相符的可能就是 WebAssembly 将会在 2020 年底成为 Web 新技术浪潮的主角,不过现在来看这个时间可能要提前了。Wasm 技术自 2015 年被提出后经过四年多的发展,现在逐渐从规范制定转向到了技术实施的层面。但实际上相较于规范制定所花费的时间,今年以来,技术实施的进度是以肉眼可见的速度在发展。因此伴随着各类基础设施的完善和落地,相信 Wasm 被真正应用到各类实际项目中的日子并不会太遥远。

刘恒兵(河伯):相对符合我的预测的技术趋势应该是工程提效。提效对于企业研发来说非常重要,因此大前端领域建设中如何更好地提效也是最值得关注的重点之一。无论是 React Native 还是 Flutter,其实都是在提效(大前端跨端研发)的基础之上兼顾性能。另外,同构、组件、智能研发、 Serverless 等等都离不开企业提效。

让人惊喜的大前端领域的技术趋势应该就是 Wasm 逐渐看到了商业化的可能,我们目前在播放器场景下通过 Wasm 来解决浏览器不支持 H.265 编解码的问题。可以看到随着浏览器逐渐完善其基础能力,大前端的空间也越来越大。

黄佳琳:与我预测相符的是 Flutter 的爆炸性发展和 Flutter for Web 的发布。此外,小程序平台也在尝试和 Flutter 技术结合,提升小程序的渲染性能。

最超乎我预期的一个技术趋势是 Docker 在前端领域的快速发展。Docker 在过去一年里改变了我们团队的构建方式和部署方式,在效率提升上十分明显。

InfoQ:预测 2020 年的大前端领域,您认为最值得关注的技术趋势是什么?

于航:伴随着 WebAssembly Post-MVP 标准的逐渐完善,Wasm 在 Web 领域能够擦出怎样的火花?这是我比较关注的事情。Wasm 能否真正享受到与 JavaScript 一样的浏览器控制能力?是否能够直接操纵 DOM 进而以更低的成本来操作和构建前端 UI 组件 / 页面?

谷歌和 Mozilla 对 WebAssembly 的大力推广可见其对该技术的重视程度,但在此之前 Wasm 真正落地的项目其实并不多,因此 2020 年可能会是一个 Wasm 应用百花齐放的年份。不仅如此,在构建 AI 以及区块链应用上,基于 WebAssembly 技术构建的 SSVM 虚拟机可能也将会在 2020 年得到大规模使用,此举将会把 Wasm 技术的应用场景拓宽到更多领域。

刘恒兵(河伯):我基于 2019 年大前端技术趋势的发展再进行一下延展,我认为企业效率以及大前端性能可能会是 2020 年最值得关注的大前端趋势。针对企业提效这点,未来 Serverless、基于 AI 的智能研发、高效的全链路监控等都能在大前端中扮演更多的角色和戏份;在性能方面,除了浏览器逐渐提升基础能力之外,跨端研发这样能让大前端更为一体的技术,将会逐渐被更多团队所选择。

黄佳琳:2020 年的大前端领域,随着跨平台框架、Serverless 等技术的不断成熟,端的边界会变得越来越模糊,大前端将进一步走向融合。在小程序方面,我认为值得关注的是小程序的工程化趋势。Web 项目的工程化在 2019 年日趋规范,而小程序项目的工程化目前还不够完善,我们在这方面则做出了尝试,提供了官方的 CI 构建方案。随着小程序项目的复杂化,小程序工程化方面的更新值得大家在 2020 年去重点关注。

InfoQ:您认为对于前端从业者来说,2020 年可能面临的最大挑战是什么?

于航:前端技术逐渐开始不再局限于 Web,或者说不再局限于我们所熟知的 JavaScript + CSS + HTML 这三种技术了。随着前端应用体积的逐渐增大,更多用于提高应用性能、解决大型应用工程化构建问题的解决方案开始逐渐涌现。

不仅如此,近年来,依赖于 Node.js、Chromium 等前端相关的成熟技术或底层基础设施,Electron/NW.js 也让我们可以将前端技术应用在本地桌面构建领域,类似的还有 React Native 在移动应用开发领域所占有的一席之地。

除了应用开发领域,基于 Serverless 的 BFF 层也开始将后端的“部分控制权”移交到了前端开发者的手中。而 2020 年,我相信随着 WebAssembly 技术及其相关基础组件的逐渐成熟和完善,其在“ on-web ”和“ out-of-web ”这两个领域内,都会开始不断涌现出更多的、在各类新技术领域和场景下的尝试,Web 技术逐渐开始向多领域融合。再借助 WebAssembly 本身的高性能、高可移植性以及可大量复用历史代码库等特性,相信类似 Chrome OS 的“浏览器操作系统”又会席卷而来。

为了迎接前端技术的快速发展,前端开发者需要不断学习、快速横向扩展所了解的知识领域,这样才能够在遇到问题时找到最合适的解决方案,然后再进行对该知识领域纵向而深入地了解。

刘恒兵(河伯):我认为 2020 年最大的挑战是前端技能模型的扩展(无边界化)。以前做前端,懂 HTML+JS+CSS 就好了,但现在不同,Serverless 的发展让前端更多参与到中后台建设中,如果要做得更专业,就要掌握更多的 Server 知识。在端上也如此,React Native、小程序、Flutter 等跨端技术要求我们更多地去掌握 Native 上的技能知识。所以如何快速适应变化和发展、快速普及知识 / 能力模型变得尤为重要。

黄佳琳:如果说 2020 年大前端融合是趋势所在,那么对前端从业者来说既是机遇,也是挑战。机遇在于前端开发的天花板越来越高,想象空间越来越大;挑战在于对优秀前端开发人员的要求越来越高。前端发展方向趋于多元化,而真正的全能型人才比较稀缺,我们要在关注领域动态、扩大知识面的同时,找准自己专精的方向去钻研,忌浅尝辄止。

桑世龙(狼叔):不可否认,这依然是大前端最好的时代。对于前端从业者来说,证明自己的最好办法不是看你获得多少资源,而是看你可以创造多少业务价值。虽然在垂直领域的深耕可以让我们有更多生存空间,但我更愿意认为 Serverless 可以带来前端研发模式上的颠覆,只有简化前后端开发的难度,才能更好地放大前端的业务价值。最后,引用我常说的一句话送给大家:”少抱怨,多思考,未来更美好。“

活动推荐:
前端技术的发展日新月异,Flutter、WebAssembly、Serverless 等框架技术的热度也是只增不减,在即将到来的 GMTC 全球大前端技术大会上,你将看到由 PayPal Senior Software Engineer 于航、腾讯 IVWEB 团队负责人刘恒兵、腾讯 QQ 小程序前端负责人黄佳琳、阿里巴巴前端技术专家桑世龙带来的难点解析和一线大厂优秀案例分享。

除了上述分享之外,本次 GMTC 还设置了小程序挑战与应对、音视频技术、Serverless 实践、前端测试与安全、大前端工程化、Flutter 实战、新兴编程语言、团队建设与管理等热门技术专场。目前大会 9 折购票,点击「阅读原文」了解大会日程。有任何问题欢迎联系票务鱼丸:13269078023(微信同号)。

评论

发布