2016 前端技术发展回顾(上)

1,300 阅读7分钟
原文链接: mp.weixin.qq.com

2016年是所有前端开发者为之振奋的一年,这一年中涌现出了很多新的技术和思路,前端技术栈能够覆盖的范围也得到了极大的扩展。同时,新的技术规范也在马不停蹄地提出和落地,不断地吸收着来自其他语言的优秀特性。今天就由笔者带领一起来回顾一下,2016年,那些令人激动的时刻和赞叹的技术,并且对于明年可能的变化进行一些小小的展望。在第一部分,我们主要对网络技术和 web 软件环境进行回顾。

网络技术

HTTP/2 技术在今年得到了持续的普及,几乎所有的现代浏览器都已经支持了 HTTP/2,移动端通过降级为 SPDY 来覆盖几乎所有平台,通过 service workerserver push 等新特性的支持,浏览器性能将会得到巨大的飞跃 ( www.youtube.com/watch?v=RWL… )。同时基于 TLS 实现的 HTTP/2 也会使你的站点更加安全,Google 一直致力于发展更为安全的 web 站点,因此也计划最终将所有的 HTTP 页面标记为不安全的。2017 年应该有越来越多的站点开始支持 HTTP/2,当然支持 HTTP/2 的过程并不是非常简单,除了必要的服务端和前端打包方式的变化外,需要同时支持 HTTP/1.1 和 HTTP/2 的过程也需要不断的踩坑。

软件环境

Internet Explorer 8

在几年前,作为前端开发者一项很重要的技术就是编写兼容 IE6 的前端代码,随着 windows 宣布不再支持 XP 和 IE 6,很多网站将支持的版本提升到了 IE8。但 IE8 ~ 11 仍然是前端开发者的噩梦,规范实施的不准确和不完全,使得我们不得不编写很多兼容代码,由此衍生出很多 hack 的写法。

今年1月29日,微软正式宣布停止对于除 IE11 以外的所有低版本 IE 浏览器的技术支持 ( www.microsoft.com/en-us/Windo… ),这意味着这些浏览器将暴露在更多的安全风险下 今年1月14日,jQuery 发布了 3.0 beta 版 ( blog.jquery.com/2016/01/14/… ),放弃了对于 IE8 的支持,并且即将停止对于支持 IE8 的jQuery Compact 的维护。无独有偶,今年3月7日,React 发布了 v15 rc1 版本 ( facebook.github.io/react/blog/… ),明确表示将消极支持 IE8,即不会再对只影响到 IE8 的问题进行任何修复的尝试 ( facebook.github.io/react/blog/… 2 今年也正式发布,将 IE8 从支持列表中划出 ( angular.io/features.ht… )。

无论使用何种技术,继续支持 IE8,意味着要放弃所有新的功能和技术支持。我们今年看到了 IE8 正在加快脚步离我们远去,这对于所有前端开发者都无疑是个好消息。随着 IE 低版本浏览器的占有率逐渐下降以及和现代浏览器性能上的差距越来越大,2017年,相信会有更多的低版本 IE 从我们的支持列表中消失。

Electron/NW.js

Electron ( electron.atom.io/ ) 和 NW.js ( nwjs.io/ )  通过集成 V8 引擎,将  web 开发技术引入到了桌面端 APP 当中。跨平台、自动升级、原生菜单和通知、崩溃报告和调试工具这些开发桌面 APP 的功能都集成在这些开发框架中,使得开发一个跨平台(Window/Linux/Mac)的应用变得可及和简单。2016 年越来越多的桌面端 APP 选择使用 Electron、NW 开发(Atom、Slack、钉钉、网易云音乐等),web 开发工程师也成为了桌面端开发者的一部分。

Mobile Native App


Facebook 是一家积极致力于用 web 技术开发 App 的公司,之前也曾将整个 facebook app 完全使用 h5 技术实现(最终以失败告终)。React Native 是 Facebook 试图使用 web 技术解决传统移动 App 更新限于发版,传统 H5 页面受制于性能的新解决方案。由于确实地解决痛点,加上 React 框架的火爆,RN 一经推出便得到了开源社区的热烈响应。今年,RN 正式支持双端,越来越多的团队开始在生产环境当中使用 RN,并且在技术博客中分享自己的实践经验。同样地,阿里巴巴在今年 4 月开源了自己在这方面探索的解决方案 Weex ( github.com/alibaba/wee… ),与 RN 不同,Weex 在形式上更加靠近 Vue 和 Web Component 规范。通过 JavaScript 开发 Native App 的开源项目还不止上面这两个,同样托管在 Github 上的 NativeScript ( github.com/NativeScrip… ) 也获得 9000+ star 的关注度。前景一片大好的情况下,也不得不承认目前仍有很多问题需要解决:

  • Native API 调用仍然具有很多限制和兼容性问题。
  • 性能相对于 H5 并没有革命性的提升,一些长列表渲染上的性能瓶颈仍然存在。
  • 在手机外设和操作系统的不断革新的背景下,和 H5 开发的性能差距在缩小。
  • 开发调试和测试缺乏成熟工具,比起原生开发有差距。

2016 年,各家在这方面的工作还大都停留在将这种技术部署到客户端上,还缺乏广泛持久的实践,但这种尝试确实给移动开发带来了全新的思路,相信和其他 JS 跨界解决方案一样,不仅是 JS 开发者的福音,同样也会为整个开发圈子带来更多灵感。17 年初,微信公布了新的内嵌微应用解决方案,微信小程序,也是基于类似的思考方式,这也从一方面说明这种开发模式正在被越来越多的开发者所认可。

Node


2016 年同样也是 Node 经历了大发展的一年,从刚发布时的被扬言颠覆传统服务端开发,到饱受各方质疑,风雨中已经走过 6 年 ( blog.risingstack.com/history-of-… ) ,褪去浮华,Node 也在平淡中逐渐发展壮大,如今所有的行业的主流公司都在开始使用 Node,NPM 成为了世界上最大的包管理工具。除了服务端的开发,Node 作为开发工具上的用途也越来越重要。Nodejs 在今年连续发布 v6、v7 版本,不断跟进最新的 v8 引擎,ECMAScript 的新特性越来越多地得到支持,今年 4 月,v8 版本也将会发布,届时更多的新特性,新的 koa,将会使 JS 成为服务端开发中越来越强大的一股力量。

WebVR

2016 年被称作虚拟现实(VR)元年,HTC Vive、PS VR、Oculus 这些商用 VR 设备都在今年成功发布,使得 VR 不再是电影动漫的科幻作品里的幻想,而是越来越多地融入到你我的生活当中。同样、以全息投影为代表的增强现实(AR)技术,任天堂的「Pokemon Go」,支付宝的 AR 红包今年都成功引发了社会现象,而作为最有潜力的 AR 头戴设备,微软的 Hololens 也在今年发售,大家都看到了 VR/AR 的巨大潜力并且对其投入重资,而对于 Web 开发来说,WebVR 也毫无疑问将会成为未来一个重要的战场,目前在技术层面,无论是 API 规范还是实现都处于初级阶段。WebVR API 规范提供了专门访问 VR 硬件的接口,让开发者能构建舒适的 VR 体验,目前仍处于草案阶段,可以在安装了 Firefox nightly 的 Oculus Rift、Chrome 的实验性版本和 Samsung Gear VR 的浏览器中试用,当然你也可以使用 WebVR-Polyfill ( github.com/borismus/we… ) 在移动端浏览器中提前体验。

小结

在这一部分当中,我们主要针对大的开发环境角度进行了回顾和展望。
在第二部分当中,我们会进入一些更加细化的领域,针对「ECMAScript 规范、编写和超集」「其他的 Web 规范」「框架和工具之争」「性能和体验优化」 四个部分对 2016 年的 web 开发技术进行回顾。