canvas教程

近几年前端技术盘点以及 2016 年技术发展方向

字号+ 作者:H5之家 来源:H5之家 2017-05-08 11:00 我要评论( )

Web 发展了几十个春秋,风起云涌,千变万化。我很庆幸自己没有完整地经历过这些年头,而是站在前人的肩膀上行走。Web 技术发展的速度让人感觉那几乎不是继承式的

前端技术 技术发展方向 前端发展 技术前瞻

Web 发展了几十个春秋,风起云涌,千变万化。我很庆幸自己没有完整地经历过这些年头,而是站在前人的肩膀上行走。Web 技术发展的速度让人感觉那几乎不是继承式的迭代,而是一次又一次的变革,一次又一次的创造。这几年的前端,更为之甚!

我从 12 年底开始接触前端,12 年之前的前端发展情况只能从上一辈的笔触中领会。本文会盘点从 09 年开始到 15 年间前端技术的革新,同时也会从多个角度,解读近几年前端技术发展的潜在因素,其中穿插了若干对前端演进的拙见,难免会有错误和疏漏,望读者可以补充和斧正。

那些年,一度追捧,一度放弃

下面,花一些篇幅简单回顾下 09 年到 15 年前端的发展历程(感谢@法海 师兄对文章部分内容的校稿,很多技术出现的时间有所偏差,但不影响阅读)。

09 年,基础类库完善,寻求突破

09 年之前,JavaScript 还处于对自身语言的完善过程中,而到了 09 年,JavaScript 类库已经颇为成熟,jQuery/Prototype//Dojo 等都已经发布了好几个 stable 版本,各大类库也是相互吸收优点,不断完善并提高自身性能,然而功能上已经没有太多增加的势头。部分框架开始了思想上的转变,更加注重前端开发的组织和结构,条理性强了很多,如 YUI 等。

从 ECMAScript 规范的争执,开启了浏览器引擎大战,各大厂商也趁机瓜分 IE 份额,Chrome 和 Firefox 在这场战役中取得大胜,V8 也敲响了前端的大门。为了迎合市场的激烈竞争,IE 开始了升级之旅,09 年初发布 IE8,全面兼容 CSS2.1。

而此时,Node.js 和 3G Mobile 这两只巨兽开始浮出水面,Web 标准也开始向 HTML5、ECMAScript5.0 靠拢。

10 年,看齐标准,关注 Web 性能

毫无疑问,这一年,各大巨头都看清了 HTML5 是 web 发展的未来,在保留原来前端技术的状态下,都簇拥着拉扯 HTML5 的裙摆。富客户端应用也在这一年蓬勃生长,ExtJS/Dojo 摇身变为企业级框架,各类组件化概念和产品如约而至。

延续着 09 年的变化,10 年的前端显得颇为沉寂,然而在标准的运用和推动上,各大厂商也是十分卖力。IE 9 出来了预览第三版,iPhone 的 Safari 已经能够支持众多 HTML5 内容:Canvas/Video/Audio/Geolocation/Storage/Application Cache/Web SQL Database 等。

W3C 宣布成立 Web 性能工作组,Google 和 Mozilla 纷纷推出应用商店,浏览器调试工具也丰富了起来,人们开始更多地关注开发体验和性能问题。

11 年,HTML5 扛大旗,Flash 堪忧

2011 年 HTML5 的技术发展和推广都向前迈进了一大步,语义明确的标签体系、简洁明了的富媒体支持、本地数据的储存技术、canvas 等等各类技术被广泛应用。这一年,很多 web 开发者也面临一项技术的抉择,HTML5 or Flash?从 Flash Player 11.1 开始,Adobe 不再继续开发面向移动设备浏览器的 Flash 插件,积极投身于 HTML5,这意味着 Flash 技术的凋零。

这一年,HTML5 游戏火爆到了一个高潮,移动端开发工具和调试工具也日益成熟。jQuery 已经成为大小公司日常开发的标配,成千上万的 JQ 插件让网页开发变得尤为轻松,而随之而来的也是页面的臃肿和性能调优的深入探索。

Node.js 已经悄然崛起,在 github 上的访问量已经超过了 Rails,国内的云应用开始尝试使用 Node.js,Node.js 相关工具也纷纷出来。

12 年,响应式开发,工程化推进

随着硬件技术的发展,各手机厂商又开始骚动起来,为了占有更多的市场,不断提高产品的性价比,体验也得到了不断的优化。借着先前两年 HTML5 刮起的东风,移动端上的 web 开发也颤抖了起来。移动端的开发挑战不亚于 PC 上对多个浏览器的支持,这一年,萌生了众多移动端框架,如 Sencha Touch/Zepto.js/JQ Mobile 等,相对 PC 端框架,它们更加轻便。

而移动端的崛起,带来了许多终端开发难题:多终端适配,多分辨率适配,远程调试等等,而随着这些难题一个个被解决,移动端生长的势头变得更加强盛。此时 Twitter 也推出了 Bootstrap, 这个前端开发工具包不仅方便了前端,也方便了后端同学,它的出现让快速建站更加简单。

编程思想的切换,迎来了 CoffeeScript 和 TypeScript,这两个预处理语言的出现又为 JavaScript 引来了不少其他方向转型过来的开发者。JavaScript 的兄弟 Node.js,也在命令行领域开拓了一片不小的疆域,甚至有动摇 Perl 和 Ruby 地位的趋势。

在前端工程化上,几个派系相互争斗,产出了 AMD、CMD、UMD 等规范,也衍生了 SeaJS、RequireJS 等模块化工具。前端在这一年很有跳跃感。

13 年,爆发式增长,百花齐放

规范和标准上有不少产出。Web Components 的出现给前端开发开辟了新思路;WebDriver 规范的出来推动了自动化测试的进程,ECMAScript 6 的规范草案落地,Webapp 工作小组在这一年也是相当活跃。

Chrome 浏览器在这一年也有了很大的突破,开始支持 SPDY,使用 Blink 取代 webkit 作为 Chromium 的新渲染引擎,Chrome DevTools 的调试体验大幅度提升。这一年中,Chrome 连同其他浏览器厂商快速推动了各项草案规范的实现。

语言能力上依旧在增强,并且从 JS 开始扩散到 CSS,LESS、SASS 和 Stylus 等 CSS 预处理语言开始走俏,Web 开发变得更加紧凑。

而在无线端,应用不再局限于 Webapp,由于流畅度、性能等方面不能满足用户体验的需求,各大公司开始转向 Native 方向的研究,进而出现了 Hybrid 和 PhoneGap 的繁荣,它们为 JS 调用了提供更多的设备 API。

Node.js 大放异彩,很多公司在生产环境中使用 Node.js,同时也出现了诸如 Express、Meteor 等小巧的快速搭建 Node.js Server 的应用框架。

各浏览器的调试也是种类繁多、功能丰富,PhantomJS 在自动化测试上开始取代 Selenium,出现了众多的远程调试方案和工具。

前端工程化开始普及,各公司开始推出自己的前端集成开发解决方案。

14 年,移动端的崛起,HTML5 和 ES6 落地

HTML5 正式定稿,这意味着,web page 正式演变为 web application。ES6 华丽丽走进前端,走的很稳重,它的 Module/Class 等特性已经完全让这门语言具备了开发大型应用的能力。

大而厚的基础库难以满足灵活场景,Mobile 要求极致体验,MV* 库铺卷而来,如 vue/angular/knockout 等。

Web Components 跨终端组件快速发展,移动端开发迎来一次升华。Node.js 前后端分离的流行,中间层的出现改变了前后端的合作模式。2014 是颠覆式的一年,前端发展在这一年开始形成了一个短暂的稳定格局。

15 年,观念的转变,步入前端工业化生产

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Mysql To Charts(4)

    Mysql To Charts(4)

    2016-04-08 10:00

  • 前端技术 / HTML5

    前端技术 / HTML5

    2015-11-19 11:49

  • jquery 卡通实现循环执行

    jquery 卡通实现循环执行

    2015-11-11 09:05

  • html5canvas学习记录

    html5canvas学习记录

    2015-10-07 19:16

网友点评
'