本文译自 Scott Domes

Flex属性是一个复合属性，而大部分教程中都只设置一个值，但其实它包含了 flex-basis、flex-grow、flex-shrink. 让我们深入了解Flexbox - 以及如何利用它来构建适应性强和漂亮的布局.

Flexbox 的工作原理是怎样的，让我们通过彩色的动态图来了解。

Flexbox 承诺将我们从平庸的 css 中解救出来（比如垂直对齐）。

好吧，Flexbox 确实实现了这一目标。但是掌握它这种新模式是一个挑战。

所以，让我们做一些动图来看看 Flexbox 是如何工作的，以便我们可以用它来构建更好的布局。

Flexbox 的基本原理就是让布局灵活直观。

为了做到这一点，让容器自己决定如何平均分配子节点，包括子节点的大小和它们之间的间隔。

这些原理听起来不错。不过还是让我们来看看实践中是怎样的。

这篇文章中，我们将深入介绍 Flexbox 的 5 个最常见的基本属性。我们将探索它们做了什么，我们可以怎样使用，以及它们的真实表现。

js遍历Object对象可枚举属性、不可枚举属性、原型链属性和自身属性

利用hasOwnProperty、getOwnPropertyNames、Object.keys、for…in遍历对象的可枚举属性、不可枚举属性、原型链上的属性和自身属性。

比较instanceof与isPrototypeOf

在javascript中，instanceof 和 isPrototypeOf 都可以判断一个原型是否在另一个实例的原型链中，那他们有什么区别呢，为什么说 isPrototypeOf 可以替代 instanceof 。

javascript通过Vibration API实现手机振动反馈提高用户体验

目前大多数的移动设备均具备硬件能力支持振动，让软件代码通过使设备摇晃来向用户提供物理反馈。Vibration API 为 Web应用程序提供访问此硬件的能力。如果设备不支持，则不会产生任何效果。

由lodash引出数组Array的slice方法性能探究

lodash 源码中，发现数组截取操作并没有直接使用array的slice方法，而是写了个 baseSlice 方法，更重要的是 baseSlice 方法里，也并没有使用 slice 方法，而是使用循环索引的方式去实现。这让我陷入思考，难道原生Array的slice方法还不如循环快？

Debounce and Throttle 的可視化解釋

Debounce 和 Throttle是两个概念，我们可以在 JavaScript 中使用，以提高我们对执行功能的控制，在事件处理的时候特别有用。

使用 npm shrinkwrap 来管理项目依赖

管理依赖是一个复杂软件开发过程中必定会遇到的问题。

在Node.js项目开发的时候，我们也经常需要安装和升级对应的依赖。虽然 npm 以及语意化的版本号 (semantic versioning, semver) 让开发过程中依赖的获取和升级变得非常容易， 但不严格的版本号限制，也带来了版本号的不确定性。主要的问题可能有三个：

• npm 建议使用 semver 的应用程序版本，但这也完全依赖第三方包遵守这一规则。如果你依赖于的包不遵循 semver ，或者依赖的包的新版本有重大更改（而你使用了 ^ 的宽泛版本安装），这潜在可能是会导致问题的。
• 另一个问题的出现是由于 npm 安装依赖的机制。npm 的安装包是有层次结构的，手动控制要安装的软件包的版本号可以实现，但是你只能在 package.json 使用精确的版本号控制你的直接依赖包，但那些多层以上的依赖就没办法控制了；一个第三方包不严谨的版本依赖生命可能破坏你的依赖管理。
• 在开发阶段执行得到的版本，和后续部署时得到的可能是不一致的，更不可控的是，你依赖的第三方包也有这样的情况会导致潜在的上线风险。

如果要控制上线的风险，我们就必需要解决这个问题，这时候，就需要使用 npm shrinkwrap 这个命令来解决问题。

之前了解的自动化部署都是jekins这样集成化的成熟的工具。最近因为有朋友提交代码时，不想登陆服务器拉取代码，才了解到 git hooks。看来还是git使用不到位。之前一直都是本地开发并提交代码，测试时，人工登陆测试服务器去拉取最新代码。

webpack-sourcemap选项应该选哪个

使用 webpack 也有一段时间了，但是每次看到别的项目配置，还是会去浏览一遍。这次刚好看到一个 devtool: '#eval-source-map'，就有些好奇，之前都是默认使用 #source-map 并没有过多去注意它。google一下，发现这个 devtool 选项还不少，那我们到底选哪个呢，它们有哪些区别。