资讯频道 → Web前端
阅读更多

0顶
0踩

Web前端

转载新闻 2017 年值得一瞥的 JavaScript 相关技术趋势

2017-01-03 17:11 by 副主编 jihong10102006 评论(1) 有12894人浏览
javascript 编程
跨年前两天，Dan Abramov在Twitter上提了一个问题：

JS社区毫不犹豫的抛出了它们对于新技术的预期与期待，本文内容也是总结自Twitter的回复，按照流行度降序排列。有一个尚未确定的小点是既然函数式编程已不再是少数派，是否要把它踢出红毯呢？

WebAssembly

去年笔者就表示过了对于WebAssembly的期待，WebAssembly就是面向Web平台的底层代码。其初衷是希望能够使所有语言都能够编译运行到Web平台，这一点对于很多函数式编程、响应式编程的粉丝充满吸引力。特别是随着这几年JavaScript社区的突飞猛进，很多开发者并不能跟得上这门语言衍化的速度，因此他们也非常希望能够直接用自己习惯的语言而不是要去重头学一门从入门到直接放弃的语言。不过JavaScript目前还处于明显的上升势头，暂时还没人唱衰它。并且WebAssembly仍处于襁褓中，才进入到预览阶段，离真正的发布还有很长的距离。总结而言，笔者建议我们都应该对WebAssembly保持一定的关注，毕竟它会对未来的JavaScript造成极大的影响。

Elm
引用
笔者个人不太意愿使用Elm，不过其特性还是很有借鉴价值


2016年不少的开发者参与到Elm的开发中，Elm不仅仅是JavaScript的扩展库，而是一门可以编译到JavaScript的编程语言，对于很多热衷于函数式编程的开发者是个不错的选择。参考Elm 入门介绍，Elm提供了如下特性：
  • 并不会存在运行时错误，没有null，没有undefined is not a funtion。
  • 非常友好的错误提示信息能够辅助你开发。
  • 比较严格的代码规范与项目架构，保证了你的应用在快速迭代中依然保持着最佳实践。
  • 自动为所有的Elm包添加语义版本描述。

总而言之，Elm为我们提供了优秀的工具来保证编写干净、简单与碎片化的代码，并且因为Elm是可以编译到JavaScript，因此很多JavaScript开发者都可以保持下关注或者尝试下。

babili(babel-minify)
Babili最早于2016年8月份发布，它是基于Babel工具链上的支持原生ES6语法的压缩工具。Henry Zhu在这篇文章中称述了为什么我们需要另一个压缩工具，关键点如下：
目前大部分压缩工具只能够处理ES5代码，因此在压缩之前需要先进性编译，而Babili能够支持直接输入ES2015+。随着浏览器性能的提升，越来越多的浏览器支持直接运行ES2015的代码，因此我们不需要再进行转换编译。另外Babili也可以作为Babel preset引入到现有的Babel配置中，也可以作为直接使用的命令行工具。

这里举个简单的例子，我们编写了如下的ES6类:

之前，利用传统的Babel进行编译与压缩，会得到如下代码:

而Babili的效果如下:

OCaml
OCaml本身和JS没啥关系，不过列表接下来的两项都是基于OCaml，因此还是要先介绍下。如果你关注了近两年来的函数式编程崛起之路，你或许听过Haskell。而得益于OCaml能够编译到就S，其以后来居上的姿态凌驾于Haskell。Facebook的不少开发者都是OCaml的粉丝，他们的Hack、Flow以及Infer都是基于OCaml构建的。

BuckleScript
是基于OCaml实现的服务端框架，由著名的Bloomberg团队创造而来。Duane Johnson对他们的解释如下：
BuckleScript或者bsc，是个基于OCaml编译器的相对较新的JavaScript服务端框架。换言之，你可以使用优秀的函数式、自带类型的OCaml语言，同时也能继续背靠基于npm包管理器的Web生态系统。

我们来简要的看下BuckleScript代码风格，譬如用BuckleScript实现简单的服务端：

编译输出为:

OCaml最大的特性就是其函数式语言特性，我们再看下其对于不可变类型的支持，我们使用OCaml stdlib实现的不可变类型如下:

而如果要用Facebook Immutable实现的代码为:

性能评测下，二者的执行时间对比为：
  • BuckleScript: 1186ms
  • JavaScript: 3415ms
编译后的体积为：
  • BuckleScript (production): 899 Bytes
  • JavaScript: 55.3K Bytes
ReasonML
ReasonML与React师出同门，是基于OCamel设计的语法友好、编辑器支持程度高，并且有强大的编译工具支持的语言。建议阅读Sean Grove对ReasonML的介绍。本文简单介绍几个JavaScript与Reason的语法对比：

元类型| JavaScript | Reason |
333.14153.1415"Hello world!""Hello world!"'Hello world!'Strings must use “Characters are strings'a'truetrue[1,2,3][1,2,3]null()const x = y;let x = y;let x = y;reference cellsvar x = y;No equivalent (thankfully)[x, ...lst] (linear time)[x, ...lst] (constant time)[...lst, x] (linear time)Not supported{...obj, x: y}{...obj, x: y}

表达式| JavaScript | Reason |
login ? "hi" : "bye"login ? "hi" : "bye"let res = undefined;switch (thing) { case first: res = "first"; break; case second: res = "second"; break;};`let res = switch thing {first => "first"second => "second"}; `

Purescript
另一个强类型、高性能的能够编译到JavaScript的编程语言，其定位与Elm类似，主要特性为：
  • 没有运行时错误
  • 严格的，类似于JavaScript的计算
  • 支持JavaScript 对象语法
  • 提供相较于Hashkell更强大方便的类型系统
  • 更方便地JavaScript库集成
Webpack-blocks
Dan Abramov说过，Webpack的定位就是在相对底层，因此将配置以编程块的方式实现会更加完备。


GraphQL
GraphQL是个不错的REST替代查询语言，特别是对于那些拥有大量数据的公司。这个案例分析很好地阐述了从REST到GraphQL的转变之路。我能够想象2017年GraphQL会继续处于上升势头，不过要谈到真的大规模实施，还要到2018年吧。

React Storybook
相信大家对于React Storybook并不陌生了，你能够独立于应用而交互式的开发你的组件，就如下图所示：

jQuery 3.0
爷爷辈的jQuery仍然处于不断的迭代更新中，可能很多开发者忽略了2016年6月份发布的jQuery 3.0版本，可以参考这里获取更多信息。

Pixi.js
如果你打算在浏览器中实现精彩的2D效果，特别是对于使用WebGL的游戏开发者，Pixi.js是个值得一看的库，可以参考这里获取更多的Demo。

Preact与inferno
非常优秀的React的替代库。

Rust
Rust可以编译到JavaScript啦（通过emscripten）。

Custom Elements
Custom Elements（包括Shadow DOM）一直不被主流的开发者接受，不过看似2017这一点将会发生些许变化。变化的关键因素在于浏览器支持比例的改善。个人还是蛮期待Custom Elements的，可以关注SmashingMag或者Google’s关于Custom Elements的解释。

WebRTC
很难相信WebRTC已经五岁了，Facebook、Slack、Snapchat以及WhatsApp都在他们的服务中集成了WebRTC。可以预见WebRTC会在2017年被更多的公司采用，蒸蒸日上。

Next.js
Next.js是个基于React、Webpack与Babel构建的，支持服务端渲染的小框架，其来源于ZEIT团队，在React社区获得了不小的关注度。
  • 大小: 52.5 KB
  • 大小: 139.7 KB
  • 大小: 6.1 KB
  • 大小: 4.5 KB
  • 大小: 3.7 KB
  • 大小: 16.6 KB
  • 大小: 21.5 KB
  • 大小: 11.9 KB
  • 大小: 11.6 KB
  • 大小: 30.1 KB
  • 大小: 7.3 MB
来自: 王下邀月熊
0
顶
0
踩
评论 共 1 条 请登录后发表评论
1 楼 somkens 2017-01-08 12:46

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 2017值得一瞥的JavaScript相关技术趋势

    2017值得一瞥的JavaScript相关技术趋势从属于笔者的Web 前端入门与工程实践，推荐阅读2016-我的前端之路:工具化与工程化获得更多关于2016年前端总结。本文主要内容翻译自，笔者对于每个条目进行了些许完善。 　本文...

  • 程序员必须关注的技术趋势，内附PDF下载链接

    点击关注 InfoQ，置顶公众号接收程序员的技术早餐作者｜ThoughtWorks编辑｜小智ThoughtWorks 已于昨日发布了... 框架等四个方面，为你详解技术未来的趋势。写在前面 ThoughtWorks 中一群资深技术领导组成的 ThoughtW...

  • SegmentFault 2017 年第一季度 Top Writer

    一群卓越的开发者，他们分享知识...2017 年即将过去大半，SegmentFault 运营团队按照惯例筛选了 2017 年度第一季 Top Writer。这次的 Top Writer 来迟了，Sorry。 以下分别是第一季问答和文章的 Top Writer，以及他...

  • 2020年房价趋势_2020年的9种网页设计趋势

    2020年房价趋势 重点 (Top highlight)Many design trends posts act like art directors — practically guiding your hands on the mouse. This year, we’re doing trends different, by focusing on what ...

  • 洞见未来：21项热点编程趋势和21项趋冷技术

    但在技术界，严谨、科学、数理和精确统治时尚标准。 这其实不是说编程是一个没有趋势转变的职业。 不合之处在于编程趋势是由更高的效率、更高的定制和易用性驱动的。 交付的一项或多项新技术超出着上一代。 ...

  • 关于代码家(干货集中营)共享知识点汇总系列——前端

    关于代码家（干货集中营）共享的...[2016年10月12日发布] 收集了大量优质 JavaScript、CSS3、Canvas、SVG、Web 动画的 Demo 集合。 [2016年10月10日发布] 一款在IDEA中为微信小程序注入方法的插件 [2016年10月09日发布]

  • 微服务

    在过去几年中，“微服务架构”这一术语如雨后春笋般涌现出来，它描述了一种将软件应用程序设计为一组可独立部署的服务的特定方式。虽然这种架构风格没有明确的定义，但在组织、业务能力上有一些共同的特征：自动化...

  • 英语四级单词

    // ==UserScript== // @name 背单词 // @description 边上网边刷英语四级单词 // @namespace Xiaomaxin // @version 1.31 // @author Xiaomaxin // @include * // @require http://cdn.bootcss.com

  • 微语录（2011-03-14---2011-03-20）

    等内容，文章从2005年以来一直更新至今，值得收藏和仔细研读。 http://sinaurl.cn/hGY6AG #HTML5# 转发微博。 12:38 微天下 ：【欧航局卫星图像显示地震显著改变日本地貌】欧洲航天局公布了...

  • 垃圾邮件过滤技术-消除不需要的电子邮件的六种方法(zz)

    我不能确切地知道，在下个月的电子邮件中会包含什么，但过去的邮件已为以后的趋势提供了极好的线索。这听上去似乎很神秘，但我的意思是，我不希望把这些模式只限制于一些单词、短语和正则表达式等，这些也许能描述出...

  • origin和python有什么不同_python爬虫之git的使用（origin说明）

    2017 年值得一瞥的 JavaScript 相关技术趋势 跨年前两天,Dan Abramov在Twitter上提了一个问题: JS社区毫不犹豫的抛出了它们对于新技术的预期与期待,本文内容也是总结自Twitter的回复,按照流行度降序排列....

  • 【云周刊】第141期：阿里正式发布《Java开发手册》终极版！绝对珍藏！

    更多精彩技术资讯，尽在云周刊！本期头条阿里正式发布《Java开发手册》终极版！绝对珍藏！ 《阿里巴巴Java开发手册》系统性地从编程、数据库、异常日志、工程结构、安全、单元测试六大方面，总

  • 知我者谓我心忧 不知我者谓我何求

    12月27日 北京  冷喜欢冯小刚的电影，一看到葛优哪怕他不说话就是想乐的感觉。天下无贼的亮点多数还是在他的台词，一部分可以算是很经典的了。我本将心向明月，奈何明月照鸿沟，还有这句知我者谓我心忧 ，不知我者谓我何求。一种中国特有的原汁原味，一种古老而又现代幽默方式。是啊，知我者谓我心忧，不知我者谓我何求。昨晚看了那个所谓的月薪3k在北京如何生活之后，脑袋里只剩这句了。路漫漫其修远兮，吾将上下而求索

  • 手中的沙子

    10月30日 大连 晴 凉爽大连的秋天就是这么可爱，只要没有风，一切看起来都那么好。庆幸啊早上起来是6：45，不是7：45或是8：45......在大脑一片空白之后，想起来的就是穿衣服马上打车去开发区.....在经历了一路狂奔之后，终于在8：00的时候来到考试的楼下......已经顾不上司机黑掉我的八十大元...狂奔至考场...还好还好....刚刚开始不到三分钟的样子.....拿到卷子..浏览了一

  • 我是真的爱你

    1月27日 北京 阴郁湿冷的冬天=====================================我是真的爱你 词:李宗盛曲:李宗盛曾经自己像浮萍一样无依对爱情莫名的恐惧但是天让我遇见了你我初初见你人群中独自美丽你彷佛有一种魔力那一刻我竟然无法言语从此为爱受委屈不能再躲避於是你成为我生命中最美的记忆甜蜜的言语怎黱说也说不腻我整个世界已完全被你占据我想我是真的爱你我是真的爱你我全

  • 他一定很爱你

    12月26日 北京 晴我躲在车里 手握著香槟 想要给你生日的惊喜 你越走越近 有两个声音 我措手不及 只得楞在那里我应该在车底 不应该在车里 看到你们有多甜蜜 这样一来我也比较容易死心 给我离开的勇气他一定很爱你 别把我比下去 分手也只用了一分钟而已 他一定很爱你 比我会讨好你 不会像我这样孩子气为难着你我应该在车底 不应该在车里 看到你们有多甜蜜 这样一来我也 比较容易死心 给我离开的勇气 他一

  • 写给情人,写给情人节,写给即将开始的新一年

    2月13日  桓仁  东北特有的冬天假期总是过得有点懒散，过得总是很惬意，好像忘了时间的流逝。晚上和老爸老妈去照了我们家传统的一年一度的全家福，突然间回忆起来上次照全家福的情景，发现时间过得真的好快。终于有机会上网了，其实就是和她聊天，虽然网吧的键盘咯的我的手太疼，但是还是蛮幸福的感觉。无意间瞥到了那个我帮着做数据库作业的女孩手里拿着一朵红色的玫瑰上楼，才意识到了，原来明天

  • 大连,感觉我已经不属于他了

    1月8日 大连 贼冷终于回来了，尽管昨天晚上要走的时候突然间觉得不想走。刚下火车马上买了回去的票，只留给了大连五天时间，不，应该说只留给我自己五天时间。除了火车站感觉到大连特别的冷，前几年所没有的这种冷。宽宽的马路没有北京那么车水马龙，人群也没有那么熙熙攘攘，因为这里是大连。曾几何时，把这里作为归宿，把自己的一切一切都已经交付给这里，因为这里是那么的美，那么的安详，那么的惬意。但是也许是因为我天生

  • Be there or be square

    12月8日 北京 晴又看了一遍《不见不散》，有一次被葛优和冯小刚的配合所折服。让我感触更深的不是故事本身的幽默，而是那种对漂流生活的感悟。记得第一次看是来北京的火车上，通知我第二天带着证件来北京报道。于是乎抗上简单的用品和一大包子书，坐上了晚上大连到北京火车，在车厢里面第一次看这个。当时的心情完全和影片的气氛相吻合，虽然北京对我来说不是美国，但是那种心态完全一样。感觉都是年轻人为了追求自己喜爱的东

Global site tag (gtag.js) - Google Analytics