前端周刊第54期:Prepack 引发社区小高潮

技术动态

Chrome Headless 终于来了

Headless Chrome 在 Chrome 59 中已经可用,把 Chrome 的强大能力带到了命令行中,搞浏览器端持续集成和功能测试的同学可以上手玩玩了?这篇文章作为入门。稍微解释下 Headless 的概念,只需要通过命令行去访问,不需要用户界面的工具都可称之为 Headless,早期的 PhantomJS 就属于这种。

Facebook 开源 JS 代码优化工具 Prepack

Facebook 近两月在开源领域动作频频,最近又开源了 Prepack:优化 JS 源代码的工具,实际上它是通过部分求值器(Partial Evaluator)在编译时执行原本在运行时的计算过程,并通过代码重写来提其执行效率。该怎么看待 Prepack?知乎上不少同学从不同角度发表了看法。

文章教程

如何更好的组织 React 项目的代码?

项目代码的组织方式在很大程度上决定了新手上手项目的速度,项目后期的维护成本,基于代码角色(比如 component、container、action、reducer)的代码组织方式被很多人使用,也出现在很多脚手架工具中,那么这种组织方式到底适不适合项目的长远发展呢?从个人经验来说,基于业务领域的顶层组织可能更适合长远的可维护性。这篇文章给出了可行的代码组织建议。

给 Node.js 新手:提高效率必备的工具和库

不少刚入门 Node.js 的同学可能都会问这个问题,新手该如何利用社区中的工具和库最大程度的提高自己的效率呢?JS 语言基础当然是不可少,因为如果你没有提高效率的基础知识,效率自然无从谈起。接下来就是工具和库的选择,要做到尽量少的浪费时间,这篇文章做了梳理,包括编辑器、代码库、命令行工具等几大类。

关于监控的几个基础问题

如果你觉得系统监控跟前端没啥关系,那就认识太局限了。页面的加载速度、JS 报错的数量趋势都是前端工程师应该负责的范畴,但是具体到监控,很多时候,做了跟没做一样,有时甚至都没做。介绍监控的常识问题,非常值得你阅读。

开发工具

pkg:把 Node.js 应用打包成可执行文件

zeit.co 出品的命令行工具,帮你把 Node.js 应用打包成可执行文件,可以直接部署到任何环境,支持跨平台,没有 Node.js 运行时也是没问题的。基于他你把 Node.js 应用打包成安装包分发给客户。国内貌似阿里有实践,但是没有系统的开源出来。

codecopy:让你成为更好的代码摘抄员

或多或少,我们都会从网页粘贴代码到自己的项目中,codecopy 是一款加速你代码摘抄过程的浏览器插件,在页面所有疑似代码片段的地方增加复制按钮,目前支持 Chrome、Firefox,支持的网站基本包括了所有程序员常去的网站,比如 GitHub、GitLab、Medium、NPM 等。

create-next-app:快速开始 React + Next.js 项目

create-next-app 看名字就很像 create-react-app,能够快速的帮你开始一个 React + Next.js 的项目,Next.js 不多解释了。该命令行工具简化项目初始化之外,还提供了超过 10 个项目模板供你选择,比如你可以选择性的加入 Redux 或者 Mobx 等 React 全家桶玩具。

代码框架

rn-splash-screen:用 JS 控制的 APP 闪屏组件

APP 闪屏是 iOS 中率先使用的提高用户感知速度的设计,后来部分 APP 拓展了这个设计的外延,在启动的时候展示或者播放广告,在 React Native 中也是可以实现的,这个库同时支持 iOS 和 Android。

react-native-masonry:灵活的砖块布局组件

砖块布局(Masonry Layout)常用来展示多列的多图页面,在 WEB 端和 APP 端都比较常见,react-native-masonry 给你提供了可以直接在 react-native 中使用的组件,支持动态列、图片渐进加载以及事件绑定。

视频教程

egghead.io:20 分钟掌握 async/await

async/await 能让 JS 的可读性再上一个台阶,但实际使用中你可能还是会碰到不少问题,比如如何和匿名函数、箭头函数结合使用?多个 async 如何排列性能最好?花 20 分钟学习下这里的课程,或许你能发现自己之前的不正确用法。

精彩问答

Git 如何提交只改了文件名大小写的变更?

在对文件命名大小写不敏感的文件系统中,如果你改了文件名(只是大小写变化),Git 默认模式是识别不了这种变化的,自然就无法提交,那该怎么做呢?有不少方法,看看 StackOverflow 的讨论。当然绕过这个问题的办法是约定所有的文件名小写。

如何知道仓库的代码行数?

有句话,可能很多人忽略,但是却是个不争的事实:没有 BUG 的代码就是没有代码。优秀的工程师是能用更短小、简洁的代码写出相同的功能的,即使第一次没有写出来这种代码,他通过后续的重构也能达到,那么怎么跟别人证明重构能让代码变少呢?你需要一个计算代码行数的工具。

想看更多类似内容?