前端技术周刊20180330

大家好&＃xff0c;广受大家喜爱的前端快爆主编 &＃64;过气网红一丝 在昨天某女神问题中躺枪被 &＃64;草依山 爆出惊天大料之后&＃xff0c;今已无颜面对粉丝&＃xff0c;所以本期的小编由打杂实习生暂代。格调不够&＃xff0c;图片来凑。

前端快爆

• D3.js 发布其第五个大版本更新。异步文件加载接口调整为了Promise&＃xff0c;支持了地图生成轮廓算法和密度等高线图&＃xff0c;调整了色彩系统的实现。?

• Chrome Canary 67.0.3378.0&＃43; 版本支持 Windows触摸板支持了。?
• 本周末的 AmsterdamJS 大会值得期待&＃xff0c;比如字面意义上执行 console.log(brain) ?

• Node.js 2018 年 3 月的安全发布&＃xff0c;修复了之前公告中宣布的问题。?
• Chrome 66 开始正式部分支持 CSS Typed Object Model&＃xff08;Typed OM&＃xff09;&＃xff0c;该规范是 Houdini 工作的一部分&＃xff0c;可以看做是 CSSOM 的升级版&＃xff0c;新规范带来了更好的可编程性和性能提升。?
• LG 发布了 webOS 开源版本&＃xff0c;现已向公众开放。?

• 调试一个未知&＃xff08;他人&＃xff09; bug 的时候&＃xff0c;我们总是很抓狂&＃xff1a;这个变量到底在哪儿被改成这样了&＃xff01;break-on-access 利用Object.defineProperty 解决了这个问题。

• 几个你不可不知的超级酷炫的 Chrome DevTools 使用技巧&＃xff1a;在发送 ajax 请求时触发断点、在控制台输入多行命令、给指定元素截图…… ?

优秀 Demo

• 灯泡开关

• 太阳系探索

专题

可自动化的页面重构

页面重构是前端最开始作为一个职位的主要工作&＃xff0c;然而相关过程总是显得那么原始&＃xff0c;那么刀耕火种。在这个自动化工具已经规模化的时代&＃xff0c;不止一个团队尝试过了自动化生成页面和动画的方案&＃xff0c;在本次专题中&＃xff0c;我们整理了相关的文章。

交互稿到代码

• 动画&＃xff1a;从 AE 到 Web

主要介绍了如何手工把 AE 稿件实现成一个简单的 CSS 动画&＃xff1a;提取动画参数&＃xff0c;生成运动贝塞尔曲线&＃xff0c;形成补间动画。

• 最全最好用的动效落地方法、都帮你总结好了 - 前端篇

变化、时长和曲线是动画的三个基本元素。Lottie、Keyframe 类开源库&＃xff0c;可以将 AE 导出的动画资源直接在项目中应用&＃xff0c;通过 gka 一类工具&＃xff0c;能让我们更轻松地制作关键帧动画

• 设计稿自动生成可用页面的展望

从 Sketch 直接生成简单的原型代码&＃xff0c;到 React-Sketch 从代码到设计的反向思考&＃xff0c;再到自建可视化页面搭建平台的历程&＃xff0c;对于设计稿到页面的全面探索与思考。

• 用深度学习自动生成HTML代码

期盼这一天正式到来&＃xff0c;又怕来得太快。

基础自动化

• 关于雪碧图预处理和后处理方案的讨论
• PostCSS Deep Dive

编辑&＃xff1a;&＃64;池冰 & 审阅&＃xff1a;&＃64;humphry
题图&＃xff1a;https://www.letsnurture.com/services/web/conversion/psd-to-wordpress.html