2018-06-29

前端快爆

• ECMAScript 2018 规范正式发布，细节已经定稿， 2018 版更新包括异步迭代方法 for..await..of、rest 和 sPRead 操作符 ...、正则表达式一系列更新（命名分组、 unicode 属性转义、点匹配所有字符的模式、逆向断言）和 Promise.prototyPE.finally()。新版规范的细节，可以查阅 Dr. Axel 的这篇文献。

  __点评：__新功能有点少？不急，后面还有 50 多个提案等着排队呢。

• Node.js v10.5.0 发布，新版支持了一个实验特性：--experimental-worker 以支持多线程。????

  点评：实验性功能，可能随时会有改动。

• 紧随 Firefox 其后，Chrome 69 也实现了 Element.toggleAttribute()方法，用来切换 HTML 中的布尔属性。????

  __点评：__喜大普奔，Edge 浏览器开发者也表示愿意实现该方法，详细介绍可以看看本专栏的文章。

• Airbnb 历时 2 年写了 12 万行的 React Native 技术栈的代码，最终仍然要放弃 React Native 了，两年里，RN 为 Airbnb 带来了跨平台、高迭代速率和较快的性能，也带来了工业强度不够的 JavaScript、较大的应用体积和难以解决的崩溃问题。????
• Firefox 63 支持了 CSS Media Queries Level 4 中的 >,<,>=,<= 符号，也就是说 (min-width: 375px) 可以更直观的书写为 (width >= 375px)。????

@H_360_47@

> __点评：__妈妈再也不用担心我分不清 min- 和 max-  的意思了。

• 最近在北京 GMTC 大前端大会上，GOOGLE Flutter 高级工程师于潇宣布 Flutter Release Preview 1发布，并宣布与阿里巴巴闲鱼团队在 Flutter 上合作，这标志着 Flutter 进入了一个新阶段。????

• Firefox 63 在 CSS flexbox 中支持了 row-gap 和 column-gap属性，至此我们可以更加方便的控制 Flex 元素的间距。该属性的别名 grid-row-gap 和 grid-column-gap 在 Flexbox 中同样适用。????

  __点评：__该功能在使用 Flexbox 作列表布局的时候非常实用。

优秀 Demo

• 卡片切换轮播点击预览

• 按钮动画点击预览

专题：可视化算法

本期专题由深耕前端数据可视化领域的释剑带来的可视化算法专题。可视化是一个相对而言入门门槛很高的领域，这里面有相当多的算法值得我们了解，说不定下次业务就能用上呢。

图形算法

• 2D 地理学算法集合 ：投射、交叉、三点画圆、多边形内外的相关算法 DEMO
• 面积填充相关算法：多边形交叉算法 & 自相交多边形的内外判断 & canvas中的非0环绕
• 随机生成指定面积单连通区域
• 分形绘图
• 贝塞尔曲线入门教程

排版算法

• 类似Graphviz的工具如何实现自动排版：简单介绍了流程图绘制中常见的分层绘图模型、力场绘图模型和形状为先的绘图模型
• JS 自动布局有向无环图：介绍了分层绘图模型 dagre 算法 & Dagre 算法细节
• 树状数据排版算法：D3 实现的树状数据算法集合

其他算法

• 插值算法简介：主要用来做折线图的平滑算法
• JavaScript 算法与数据结构：非常详尽而系统的的介绍了各类算法与数据结构，所有算法皆有 JavaScript DEMO。

本期编辑：@壹丝，审阅：@承虎，专题供稿：@释剑。
题图来源：https://www.videoblocks.com/video/flight-through-futuristic-tunnel---loopable-ap7dlse