2017前端技术大盘点!

2018-05-14 17:16:58 浏览数 (1)

前言

临近2017的尾声,总是希望来盘点一下这一年中前端的发展。这一年,有一些新技术和新东西产生,同时,前端技术也慢慢的趋于稳固,自成一套体系。如果你喜欢我的文章,欢迎评论,欢迎关注我的github博客~

正文

我们何处说起?自然是离不开那三驾马车。

三驾马车

自从2015年,react的问世,开始了三驾马车时代的先河。同时,jQuery也逐渐让出了其霸主的地位。后续的,angular开始了大型的改版,似乎想要追逐react的步伐。两种完全不同思路的体现,在前端开发的技术栈中发光发亮。同时,Vue就像一匹黑马一样,一路披荆斩棘,快速地进步着。

因此,从2017年开始,3架马车可以说是并驾齐驱。似乎需要看些对比数据,来表示它们目前的现状。(来自国外的数据)

可以看到react的深紫色是最多的,表示用户对于react还是十分满意的。虽然,早前的React收到了协议的影响,但是,这似乎并不影响它在开发者心目当中的地位。另外,react如此受欢迎的另一个重要原因就应该是React Native了吧。今年以来,React Native一直以两周一次的小版本更迭周期,迅速发展着。或许,2018年将会迎来最重大的正式版本1.0。(这个还是值得期待的。)

对于大多数开发者而言,学习了React的时候,对于它们学习React Native是有直接性质的帮助的,所以一般的国外开发者不会拒绝学习React这个框架的。

介绍完,React的情况,我们或许可以回望一下Angular的情况吧。

Angular可以说是一个最早问世的MVVM的框架。2009年,angular像一枚重磅炸弹一样,震撼了前端的开发者们。当时,W3C似乎还未推出正式的Web Component标准。React和Vue也还在襁褓之中安眠。可想而知,之后的几年Angular一直影响着后续前端的发展。但是,Angular有着许许多多的问题,也使得它在后续的框架之争中,处于下风。2016年9月正式推出的angular2,将angular引领向了另一种形式——以HTML为中心的框架。一套完整的体现,其中加入了TypeScript RxJS等组合,可想而知,一套内容的学习成本相当之高,与React以JS为中心的思想完全不同。不过似乎这一次Google将框架的定位目标换成了企业,国内外在使用这套框架的往往是银行、证券类企业。不过,它的发展还是被看好的,毕竟它的背后可都是一群Google的顶尖开发工程师呢!!

最后,我们来了解一下三驾马车中的黑马——Vue。

从第一张图中,虽然React一直处于领导地位,但是,Vue2的使用,也将于其他两个框架持平快了。毕竟,在国内的前端环境中,Vue可以说是非常受欢迎的。(据说印度开发前端,会用Angular,中国人开发前端,会用Vue)不得不说的是,Vue与Weex的结合,虽然体验不及RN,但是有着阿里的技术支持,也将有希望突破吧。

PWA

如果在国外,你今年听到的热词一定会有PWA这个东西。前不久,Safari已经开始支持PWA了,那么也就意味着PWA的时代不会太远了。当然,国内实践PWA的公司也不占少数,例如饿了么、阿里等。从去年开始,对其有所耳闻,到今年Google开发者大会上的现场演示,相信更多的开发者对于这门技术的狂热。对于国内开发者而言,唯一不好的优势应该就是文档了。因为目前来说,大部分的文档都是以英文的形式存在于GitHub或者国外书籍中的。翻译过来的书,也不会这么快的速度问世,所以目前研究PWA的中文资料少之又少。

不过相信,它的发展在之后的一两年的是强而有力的。

国内的小程序

今年,在国内会被称为“小程序年”。从1月份开始,微信正式将公测了小程序。继而在7月份开始,支付宝也推出了相应的小程序。在国内,这样子的重大消息是不容忽视的。两大巨头之争,推动的是无与伦比的流量红利。基于小程序的开发,也将成为国内的前端的一大重点。将原用的整体化的内容,逐步分割成一个个小的模块,将至放入到微信这个大环境中去分享,最后起到一个引流的效果。回到技术的成面,小程序或许会有着与PWA一样的思想,将之前在移动端难以为继的Web端,放入到自家应用中,来确保它的长久与稳定。更多的是说,这两者起到了异曲同工的效果。同样的,这项技术,将在2018年持续发展下去,同时,也会有更多的前端投入到这项开发中去。

styled-components

这项技术,也是从上半年开始有所耳闻的。主要是作为react库的衍生物的形式出现的。它将css部分的代码以js的形式展现在代码中,那么之后只需要开发js就可以完成整个应用的开发了。同时,它还有一个好处,它的样式是基于组件的,所以可以做到复用,同时,往往js的变量在css中去使用时,是一个令人头疼的问题。而styled-components很好的解决了这个问题,因为它本身就是在组件中开发样式,js的变量依然可以被使用在css的部分代码中。这项技术也是可期的,因为越来越多的人在自己的react项目中开始了这项技术的尝试。

Rollup

这是啥?没错,又有一个模块打包工具来了。或许,大家熟知的更多的是webpack这个模块打包工具。今年的4月份,React做了一个大动作——在React的主分支上合并了一个PR,将当时的构建工具换成了Rollup。可想而知,这个东西将会是多么的重要。好奇的是,它与其他的不同之处吧!它是一款基于ES2015模块进行打包的打包器。在过去的打包工具(包括webpack在内)中,都是基于CommonJS的规范去进行模块的打包的,所以,过去很多库的前面总是会有一大堆webpack等自家的逻辑填充在开头。Rollup不同,他是后天生的,出生的基准点就表明它的高度将不限于此。但是,相对于巨头webpack来说,它或许在今年并未体现出它的优势,但是相信它会厚积薄发的。

建议:在开发应用时,使用webpack,在开发库时,可以考虑Rollup。

GraphQL

这个东西,或许在国内鲜有闻之。但是,它仍是一项不错的技术,同时在调查中,也体现出不俗的潜力,如图:

它是有Facebook开发的一款API查询语言,或将替代Rest在后端的地位。虽然,目前来说,其性能并不是特别的优秀,也会bug不断。但是,2018年或将是GraphQL的一年。那么,和前端又有什么关系呢?别忘了,我们手里还有一个利器NodeJS呢!能够用好它,对于你开发nodeJS,或许使用便利。

TypeScript

这一项由微软老大开发的语言,处处在弥补着JavaScript的缺陷。一出生,就打着“取代JavaScript”的旗号,发展的速度也是惊人的。当然了,W3C也在努力的推进着JavaScript的进步,之后的几年,应该会是着两门语言并驾齐驱的发展吧。因为开发人口众多,不可能走到谁取代谁的地步。

最后,贴出一张Stackoverflow上面的一项数据统计表吧!

图片来源:I just asked 23,000 developers what they think of JavaScript. Here’s what I learned.

总结

我们盘点了一年以来前端的发展,有着新技术不断被推出着,相信前端会发展的越来越好。因为在JSConf大会上,有人发言说,之后将会发展成“前端 云端”的组合。那么,也并不存在全栈类开发的说法了。前端开发的小伙伴加油吧!!我们共勉


本文作者:laizimo

原文链接:https://github.com/laizimo/zimo-article/issues/48

0 人点赞