课程咨询 :186-8884-0703

深圳Web培训 > 达内新闻 > 【深圳WEB培训】Web前端技术历经的洗礼和蜕变(2)
  • 【深圳WEB培训】Web前端技术历经的洗礼和蜕变(2)

    发布:深圳达内      来源:深圳达内      时间:2015-11-20

  • 深圳WEB培训】Web前端技术历经的洗礼和蜕变(2)

    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培训】Web前端技术历经的洗礼和蜕变(2)

    工程化的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的灵活性需要某种程度的限制。

    总之,通过上面的阐述,我们可以看到前端技术的不断进步和推陈出新,也能够体会到项目过程的工程化,解决方案的轻量化,库和框架的多元化,知识结构的体系化,这种趋势在今后会变得越来越明显,也昭示着前端技术的发展方向。

    更多内容请点击:深圳WEB前端培训

上一篇:【深圳WEB培训】Web前端技术历经的洗礼和蜕变(1)

下一篇:【深圳WEB学堂】什么是web开发

最新开班日期  |  更多

WEB前端工程师--全日制班

WEB前端工程师--全日制班

开班日期:2月15日

WEB培训前端工程师--周末班

WEB培训前端工程师--周末班

开班日期:2月15日

WEB培训免费训练营一期

WEB培训免费训练营一期

开班日期:2月15日

WEB培训免费训练营二期

WEB培训免费训练营二期

开班日期:2月15日

  • 地址:深圳市福田区八卦四路华晟达(原南方苑)大厦4楼东—深圳WEB开发培训中心
  • 课程培训电话:186-8884-0703     全国服务监督电话:400-827-0010
  • 服务邮箱 ts@tedu.cn
  • 2001-2016 达内时代科技集团有限公司 版权所有 京ICP证8000853号-56