跟着互联网家当的爆炸式增加，与之伴生的网站设计Web前端手艺也在历经洗礼和演变。特殊是近几年跟着挪动终端的生长，越来越多的人开端投身或转行至新范畴，这更加现今的IT家当注入了新的活气。虽然Web前端手艺降生至今光阴其实不长，但跟着Web手艺的逐渐深切，从此将会在以下几方面发力。
1.Web挪动终端开辟。
2.JavaScript的兄弟们。
3.百花齐放的类库和框架。
4.工程化的Web前端开辟标准。
Web挪动终端开辟
PhoneGap：一个开源的开辟框架，利用HTML、CSS和JavaScript来构建跨平台的挪动运用法式。它使开辟者可以行使iPhone、Android、Palm、Symbian、BlackBerry、WindowsPhone和Bada等智能手机的中间功用，包括地舆定位、加快器、接洽人、声响和振动等。除在当地编译运用以外，还可以利用PhoneGap供应的云端Build工具截至运用编译。也就是说，只需要将用HTML5写好的运用上传到PhoneGap的云端办事器，PhoneGapBuild便可将其编译成适合分歧平台的运用。
前端常识图谱
SenchaTouch：说到这里，就不能不提一些面向挪动端的WebUI库，究竟PhoneGap是一个工具，要想基于Web手艺构建完好的App，必需挑选一些适用的挪动UI库。而最值得一提的是SenchaTouch，它可以让WebApp看起来像NativeApp。鲜艳的用户界面组件和丰硕的数据治理，所有基于最新的HTML5和CSS3的Web标准，全面兼容Android和iOS装备。PhoneGap明示着一种开辟趋向，即App也可以利用Web前端手艺来完成。而作为开辟者最经常使用的UI工具箱，SenchaTouch又进一步加快了这类趋向，今朝在淘宝已有少量的项目采纳这类思绪来搭建，即在内置运用的外壳加上自界说的基于挪动Web的UI库。信任在未来这类情必将会越来越风行。
Sencha Touch：说到这里，就不能不提一些面向挪动端的WebUI库，究竟PhoneGap是一个工具，要想基于Web手艺构建完好的App，必需挑选一些适 用的挪动UI库。而最值得一提的是Sencha Touch，它可以让Web App看起来像Native App。鲜艳的用户界面组件和丰硕的数据治理，所有基于最新的HTML5和CSS3的Web标准，全面兼容Android和iOS装备。PhoneGap 明示着一种开辟趋向，即App也可以利用Web前端手艺来完成。而作为开辟者最经常使用的UI工具箱，Sencha Touch又进一步加快了这类趋向，今朝在淘宝已有少量的项目采纳这类思绪来搭建，即在内置运用的外壳加上自界说的基于挪动Web的UI库。信任在未来这 种情必将会越来越风行。
Media Queries：在CSS2时期，假如你曾为网站设计过打印版CSS，那末就会清晰明明CSS3 Media Queries的感化。不外，CSS3的Media Queries比CSS2的Media Queries可以猎取这些数据：浏览器窗口的宽和高、装备的宽和高、装备的手持偏向(横向仍是竖向)和分辨率等。也就是说，Media Queries供应了一种基于分歧的平台写CSS的手艺。这项手艺在2011年头被推行开来，至今已很是炽热，特殊是在Web页面仍占互联网流量大大都的 本日，这类兼容手艺能很快让网站兼容挪动装备，包管产品完成最快的跨平台的兼容性和多平台的可用性。
Zepto.js：一个专为 Mobile WebKit浏览器(如Safari和Chrome)而开辟的JavaScript框架。它标榜自己繁复的开辟理念可以赞助开辟职员简略、疾速地完成开辟 托付义务。更重要的是这个JavaScript框架是超轻量级的，只需5KB。Zepto.js的语法鉴戒且兼容jQuery。今朝已有很多网站开端基于 Zepto.js做运用，由于在丢弃了IE浏览器的兼容性题目后，Web开辟会变得越来越纯洁，体积更轻盈，编码也加倍愉悦。不行否定，跟着挪动终端开辟 越来越风行，Zepto.js在未来将会有加倍广漠的运用场景和空间。
Bootstrap: Twitter推出的一个开源的用于前端开辟的工具包。它由Mark Otto和Jacob Thornton合作开辟，是一个CSS/HTML框架。Bootstrap供应了文雅的HTML和CSS标准，由静态CSS说话LESS写成，与CSS 框架Blueprint存在良多相似之处。Bootstrap一经推出便颇受欢送，一向是GitHub上的热点开源项目，NASA和MSNBC的 Breaking News都利用了该项目。2012年第二季度，Bootstrap公布了2.0版，Bootstrap 2.0的一个严重改良是增加了相应设计特征，在1.0中，这是让良多开辟职员诉苦的处所。而且为了供应更好的针对挪动装备的相应式设计方 案，Bootstrap 2.0采纳了更加矫捷的12栏网格结构。别的，它还更新了一些进度栏及可定制的图片缩略图，并增加了一些新款式。值得存眷的是，Bootstrap是一个 很是轻量级的框架，2.0在紧缩后只需10KB。Bootstrap为我们的网站疾速搭建供应了不错的工具和思绪，这个工具集将具有更旺盛的生命力。
JavaScript的兄弟们
CoffeeScript是一个鉴戒Ruby编写的新编程说话，创立者JeremyAshkenas戏称它是JavaScript的低调的小兄弟，由于CoffeeScript会将Ruby编译成JavaScript，而且大局部结构都相似。但分歧的是，CoffeeScript具有更严酷的语法。它的最大功劳就是将JavaScript硬绑的C/Java语法丢弃了，改成采纳相似Ruby/Python的语法。Ruby/Python原本就是深受Lisp影响的，与JavaScript算是同门师兄，它们的语法经由了实际磨练，很是适合函数式编程。这类文雅的说话独具魅力，行将面世的2013版的淘宝首页即采纳了CoffeeScript完成。
TypeScript是微软开辟的JavaScript的超集，TypeScript兼容JavaScript，可以载入JavaScript代码然后运转。与JavaScript比拟，TypeScript进步的处所在于：插足正文，让编译器清晰明明所撑持的工具和函数，编译器会移除正文，不会增加开消；增加一个完好的类结构，使之更像是传统的面向工具说话。由于JavaScript只是一个剧本说话，其实不是用于开辟大型Web运用，以是没有供应类和模块的观念。而TypeScript扩展了JavaScript完成了这些特征，能更好地撑持大规模JavaScript运用开辟，接受了不开辟者。但要留意，虽然TypeScript有微软做后台看起来很有包管，但今朝供应的只是初期的预览版本，TypeScript其实不像它的网站看起来那样优美，终极版本可以会在一年后ECMAScript6公布会肯定，目下现今的版本只是个开辟预览版。是以，TypeScript从此生长若何，还需要进一步观测。
别的，在办事器端，Node.js越来越风行。现在Node.js不只作为处置惩罚高并发恳求的中间层办理计划，还因其矫捷的语法和丰硕的底层API，越来越多的人开端用它来写工具，特殊是之前基于Ant或Java的一些工具现在都有了Node.js的版本。
如斯看来，Node.js在饬令行工具范畴有着加倍广漠的运用场景，以至可以取代Perl或Ruby这些传统的静态说话。在淘宝Node.js已有很是多的运用场景，比方在数据部分，Node.js被用作处置惩罚高并发场景下的容池，特地接受高并发的恳求，以至可以连结和客户端的长链接，而这在之前则需要花消很奋发的本钱，比方Comet手艺等。别的，淘宝的开源前端类库KISSY也可以间接运转于Node.js情形，如许就可以在饬令行运转KISSY代码，良多前端代码就有机缘采纳自动化测试等，进步临盆效力。再者，淘宝外部的开辟工具链也已大局部采纳Node.js来构建了。
百花齐放的类库和框架
SeaJS是由付出宝前端初级手艺专家王保平(玉伯)开辟的一个服从CMD标准的模块加载框架，可用来轻松愉悦地加载肆意JavaScript模块和CSS模块。SeaJS很是玲珑，玲珑在于其紧缩后体积只需4KB，而且接口和方式也很是少。SeaJS有两个中间：模块的界说和模块的加载。SeaJS可以加载肆意JavaScript模块和CSS模块，能包管你在利用一个模块时，已将所依靠的其他模块载入剧本运转情形中。SeaJS可以让你享用写代码的兴趣，不消去管那些加载的题目。究竟目下现今网页的可维护性和机能题目一样严峻，体目下现今：文件太多，不利于维护，前端后端都一样；HTTP恳求过量，固然这个可以经由过程归并办理，但假如没有后端间接归并，那末野生本钱会很是大。用SeaJS就能很是好地办理这些题目。SeaJS服从CMD标准，是以可以很便利地誊写模块。今朝已有越来越多的人采纳CMD标准来开辟项目了。
比来微软已正式公布了Windows8操纵零碎，Windows操纵零碎的气概已完整酿成了磁贴状的MetroUI。对微软来说，这是一个严重的转变，而且所有微软的平台包括桌面、平板、挪动端及其网站都利用这个UI气概。
MetroUICSS是一个很是完好的创立Metro气概的网站框架。它自成系统，但也可以与其他框架一同利用。利用LESS创立，而且具有网格零碎、排版款式、表格、按钮和图片。同时也具有内建的JavaScript组件，赞助你天生片状、菜单、边栏、进度条和提示等，是一个很是好用的框架。跟着Windows8的进一步风行，这类气概的CSS类库必定会成为一种趋向。
Hype是一个玲珑的工具，是MacAppStore新上架的一个HTML5创作工具，其优点是可以在网页上做出悦目的动画成效，不必Flash插件。开辟该运用的公司Tumult由两个前苹果工程师创立，并获得了YCombinator的投资。由于公司的结合创始人之一JonathanDeutsch曾担任Mail.app后端的手艺主管，是以他在接受PaulHontz的TheStartupFoundry访谈时，谈到公司创始是为懂得决HTML5创作工具缺少的题目。可以说，Hype是第一个可用的创作HTML5产品的可视化工具，具有里程碑式的意义。跟着硬件机能提拔，HTML5的运用法式加倍偏向于被工具天生，而不像传统意义上由工程师“切”出来。是以工具化是一个偏向，不论HTML5是否是真的能在挪动终端扎下脚根，这类偏向是值得对峙的。究竟，HTML5的运用开辟目下现今还处于原始社会。
iScroll.js是利用原生JavaScript编写的一个摹拟转动成效的小类库，不依靠于任何JavaScript框架。旨在办理挪动WebKit系浏览器的地域转动题目，兼容MobileSafari、Android默许浏览器、Safari、Chrome、Firefox5+、Opera11+、IE9+及其他WebKit中间浏览器。最新版本为iScroll4。这个小库一问世就备受存眷，由于它不只可以在PC端完美摹拟转动成效，在挪动终端里对触屏事宜的撑持也堪称完美。
iScroll4是2011年末问世的，2012年在挪动终端产品开辟中大放异彩，在淘宝的诸多产品中都用到了这个JavaScript库。iScroll是小而精的经典作品，名字也带着苹果范儿。但美中缺少的是，只能利用ID挪用。不外这个小特征不是甚么大题目，可以经由过程二次封装来办理。等候iScroll4在挪动终端里有更多出色的显露。
前端MVC在2011年是对照火的话题，跟着越来越多的人开端测验考试利用诸如JavaScriptMVC和Backbone.js这些MVC类库，更多的产品也看起来更像“软件”而非“网页”。但由于前端情形的庞杂性，我们也逐渐创造“这类”MVC其实不是完美，只能运用于“基于数据驱动”的场景，而对“基于事宜驱动”的场景却没有太好的办理法子。今朝，淘宝有良多产品在测验考试利用“无穷自动机”来补充MVC在这方面的缺少。是以，新场景下的MVC还需要更深切的提炼。
工程化的Web前端开辟标准
2012年，关于前端开辟编码标准的议论越来越多。外洋和海内的顶尖开辟者简直同时对编码标准产生了很大兴趣，前Yahoo!首页首席前端工程师N.C.Zakas在他那本《高可维护的JavaScript》书中也提到标准在团队合作过程中的重要性。而以下这两个方面，是值得我们商量和沉思的。
AMD与CMD标准之争，
品牌网站改版，跟着CommonJS的进一步提高，CommonJS标准在标准的模块开辟范畴阐扬着越来越重要的感化，而CommonJS在浏览器端的难以完成却为这份标准增加了一丝变数。本质上讲，CommonJS是一种用于同步加载JavaScript代码的API标准，很是简略文雅。为了在浏览器端完成这类机制，则不能不插足了一层异步回调，这即是AMD(Modules/Asynchronous-Definition)。RequireJS完成了这个标准，而Dojo也将即速完整撑持(Dojo1.6)。标准自己很是简略，以至只包括了一个API。玉伯在开辟SeaJS的过程中，更多地连结了CommonJSModules标准的气概，即CMD(CommonModuleDefinition)。较之AMD，CMD没有采纳单一的API来适用于多个功用，而是依据分歧功用界说分歧的API。我觉得，二者在完整性上是根基同等的，但在社区理念和编程气概上有所差别，开辟者可以依据自己的偏好来挑选利用AMD仍是CMD编程气概。
Java说话编码标准对前端开辟编程标准有很是大的影响。在Zakas的《高可维护性JavaScript》一书中提到了五种JavaScript编程标准，都和Java说话编码标准有着相似的渊源：Crockford编程标准、jQuery中间气概指南、SproutCore编程气概指南、Google的JavaScript气概指南和Dojo编程气概指南。不论是哪种标准，都夸大了编码气概同等的重要性，这也可看出，前端团队开辟越来越注重标准，JavaScript的矫捷性需要某种程度的限制。
总之，经由过程下面的论述，我们可以看到前端手艺的不息进步和推陈出新，也可以领会到项目过程的工程化，办理计划的轻量化，库和框架的多元化，常识结构的系统化，这类趋向在从此会变得越来越明明，也明示着前端手艺的生长偏向。
说到前端手艺常识结构的系统化扶植，这是我这些年来一向都在做的工作，在2011年也画了一张图来阐明我的观念——前端手艺系统的扶植是一项恒久的义务。究竟前端老手艺新常识层见叠出，对经典的常识结构的整顿也很有挑战性，但这项工作究竟需要有人去做，为新入道的人指出一个大抵的偏向。对前端工程师的生长题目，我也写过一篇长文“前端开辟十日谈”，赞助新人们解惑。