写点什么

2021 年前端发展预测

  • 2021 年 2 月 21 日
  • 本文字数:2184 字

    阅读完需:约 7 分钟

2021年前端发展预测

2018 年、2019 年、2020 年我们都做了前端发展预测,本文是 2021 年前端发展预测。

React 框架终于成熟了


React 在 MVC 中经常被称为“V”,它既受益又受困于缺乏固执己见的框架。多年过去了,我们还没有看到这个行业在一个堆栈、体系结构或工具链上联合起来。尽管这种灵活性无疑有助于其普及,但 2021 年可能是我们最终看到此类框架走向成熟的一年。


在过去的一年里,Vercel 公司继续在 React 领域占据主导地位,不断完善其框架,Next.js 以及他们自成一套的服务,同时推出了一个电子商务初学者工具包和一个分析工具


并举办了他们最大的虚拟会议。虽然 Next 已经出现了很长一段时间,造好轮子并经过了很久的实践,但功能大而全的方式并不适用于所有人(译者注,原文 batteries-included,这个词语源自 Python 语言,指官方发行版 CPython 自带了相当齐全的软件库,拿来就可以直接写程序,一般不需要再去安装额外的库,类似买一个电动玩具里面自带了电池一样,拆开后简单装配即可使用),但是去年最终发布的 v10,稳定性出人意料,最终采用了子路径路由



Vercel 公司正努力通过他们最新的主题演讲来宣传产品,包括“drops”。


今年,新的闭源 React 框架 Remix 悄无声息地推出了“支持者预览版”。Remix 由社区中的两位大牛 Jackson 和 Florence 创建,他们成名于 React Router,采取了不同于 Next 的方法——既有商业模式(每年收取一笔不多的许可费)也有体系概念(Remix 是一个产品,而不是一个平台)。Remix 承诺将利用更传统的技术,比如积极的 Http 缓存,重新关注基本网页,而不是倾向于静态页面生成。


现在还为时过早——Remix 要到明年才能正式推出——而且不太可能实现像 Ember 这样的一体化工具。尽管如此,在这个长期停滞不前的领域看到事态发展还是让人耳目一新。

DOM 容器查询


(译者注,这里的容器是页面 DOM 容器,不是另一个完全不相干的 docker 容器)对容器查询的需求已经达到了狂热的程度。随着谷歌最终宣布他们的原型计划,2021 年可能是我们第一次看到。


与此同时,越来越多地采用固有的网页设计,结合 CSS 的 min/max/clamp 和 JS 的 ResiveObserver 等 API,提供了更好的“伪装”方法。这类实现越来越多(甚至可能是危险的?)在过去的几个月里,很难想象这种趋势会在明年停止。


译者注,ResiveObserver 是一个试验特性,类似 document.onresize,ResiveObserver 可以监听到 Element 的内容区域或 SVGElement 的边界框改变。避免了在自身回调中调整大小,从而触发无限回调和循环依赖。仅通过在后续帧中处理 DOM 中更深层次的元素来实现这一点。


我希望我们能看到更聪明的方法来接近容器的第一个设计,如 Mathias 的 Raven 和 Heydon 的 Watched Box。

WASM 爆炸


WebAssembly 的发展很缓慢,这在很大程度上是因为它太专业了(“如果需要它,你会知道的”)。然而,到 2021 年,我们可能会看到这种转变。



随着前端开发人员的角色逐渐向“全栈”领域发展,我们开始看到更多的工程师采用较低级别的系统语言,比如 Rust,尽管 Mozilla 裁员后出现了最初的不确定性,但 Rust 目前正受到空前的热捧。


因此,我们看到了基于 WASM 的解决方案,如 Yew 和 Seed.rs 进入前端框架。得益于 Rust 提供的性能和安全性,2021 年很可能是 WASM 出现大规模繁荣的一年。


我们离这些大公司关注的热点还有很长一段路,但我相信 2021 年采用率会激增。

快要达成一致了


(译者注,原文 monolith,巨石,单一庞大的组织,这里是前端采用的技术栈可以达成一致)业界对分布式服务和精心划分责任的热爱仍在继续,已经超越了后端(比如微服务 ),并在 2019 年达到了顶峰,推出了微前端(同样受到诟病和喜爱的)。Unix 哲学的体系结构方法继续受到限制,至少在技术报告和媒体文章领域是如此。


在过去的几年中,微服务的广泛使用使得诸如 Backend For Frontend 之类的模式成为必要,它在每个客户机和为其提供服务的 API 之间引入了一个中介。



-BFF 充当“粘合剂”,是客户端的单一联系点。这允许使用该服务的客户端变得一致(并且非常适合)。


考虑到目前对 JAMStack 的兴趣,这一点在 2021 年尤为重要,JAMStack(译者注,JAMStack 是新兴的技术概念,区别于以往服务器端渲染,而是采用 JS 脚本、API 服务接口、Markup 模版,通常直接使用 CDN 分发静态的页面,完全不需要渲染页面,网站的伸缩性、稳定性可以得到最大的保障。)最为复杂,受到服务依赖的影响。


有趣的问题,“如何组装我的 API”的答案是:构建一个。


2021 年会看到使用 BFF 技术的有所增加,但如果运气好的话,我们也可能会看到它逐渐回归到巨石阵,或者至少会以更大的“宏观服务”,或诸如城堡之类的妥协形式缓慢撤退


毫无疑问,Basecamp 的 DHH,这位“雄伟”巨石最有力的支持者(他最近推出了另一款传统的网络应用 Hey)将领导这次行动。

总结


有趣的是,前端最大的发展方向不太可能是通常的关注点。早在我们 2019 年的预测中,我们就注意到,前端开发人员的角色正日益向“全栈”转变,已证明这是事实。甚至我们的框架和工具的发展也表明了这一点,我们越来越关注数据获取、并发性、安全性和可伸缩性。


这是一个自然的交汇点,前端工程师面临着越来越多的“后端”问题,而工具和服务正变得足够复杂,以降低进入壁垒。这是一场完美的风暴,我希望它能持续到 2021 年。


原文链接:


https://www.browserlondon.com/blog/2021/01/04/front-end-predictions-2021/

2021 年 2 月 21 日 12:002870

评论 1 条评论

发布
用户头像
👍
2021 年 03 月 04 日 23:06
回复
没有更多了
发现更多内容

周小川:数字货币将是下一代货币研究工作的核心

CECBC

数字货币

区块链如何助力中小企业解决融资难题

CECBC

区块链

小鼎量化机器人系统开发详情介绍

系统开发咨询1357O98O718

2021年GitHub上爆火的999页Java面试宝典终开源

比伯

Java 编程 架构 面试 程序人生

redis+docker构建主从环境

小铨

redis Docker redis+docker 主从环境

【实战问题】-- 缓存穿透之布隆过滤器(1)

秦怀杂货店

缓存 布隆过滤器 java;

小鼎机器人系统开发功能及源码

系统开发咨询1357O98O718

Kubernetes 弃用 Docker 后如何切换到 Containerd

倪朋飞

Docker Kubernetes 微服务

上线几小时下载量破百万!无价的这份阿里并发编程图册就这么强势

Crud的程序员

Java 架构 并发编程

Python OpenCV 图像旋转,取经之旅第 11 天

梦想橡皮擦

3月日更

架构师知识笔记1

felix徐

架构实战营

区块链通证经济——资产流动性的变革

CECBC

资产流动性

如何实现一个简易版的 Spring - 如何实现 Setter 注入

mghio

spring 依赖注入

想要精通Redis?这篇文章不得不看,Redis之父带你实战实践

互联网架构师小马

Java 数据库 nosql redis 面试

AWS CDK的那些事

小铨

AWS AWS CDK

渣硕试水字节跳动,本以为简历都过不了,123+HR面直接拿到意向书

Java 编程 程序员 架构 面试

字节跳动5面喜提offer!分享给朋友们面试感受

Java架构之路

Java 程序员 架构 面试 编程语言

Java-技术专题-ConcurrentHashMap读操作分析

浩宇天尚

Java ConcurrentHashMap

mysql实现主主数据库(双机热备)

大奎

MySQL-技术专题-知识点介绍

浩宇天尚

MySQL

Kubernetes Ingress 可视化编辑器

倪朋飞

Kubernetes 网络

悖论和直觉

Anderson O.yang

蚂蚁金服三面Java面试题全解析,这也太难了吧

Java架构之路

Java 程序员 架构 面试 编程语言

爽啊,终于又见面了,字节跳动后端社招面试分享

Java架构之路

Java 程序员 架构 面试 编程语言

监控系统-zabbix快速入门

小铨

监控 zabbix

Java-技术专题-Synchronized和lock区别

浩宇天尚

Java

MySQL-技术专题-使用规范

浩宇天尚

MySQL

什么?你居然还不知道Docker是什么?看看京东首席架构师怎么说的

互联网架构师小马

Docker 容器

牛链NB系统开发案例源码

系统开发咨询1357O98O718

数据库与缓存的一致性方案演进

邱学喆

缓存 一致性

Vue3源码 | 如何挂载组件元素?

梁龙先森

源码分析 大前端 Vue3

React Native 核心原理及跨端选型思路

React Native 核心原理及跨端选型思路

2021年前端发展预测-InfoQ