blog

作为一个前端开发者我总是寻找一些可以使得反馈路径尽可能短的工具，而我相信 linting 会是其中一个。当然，有了 IDE 与文本编辑器的集成你一定用过它们。另一方面，还有那些云端代码质量工具，比如像是 CodeClimate 等一些工具，又或者是你自定义的 CI 工具，因而你大概也有用到。不过在这两者之间有一个小小的夹缝。 想象以下情形：你向代码仓库提交了一个 PR， 里面包含了一些类似检查启用与一些快速提交的代码。几分钟之后，在你已经进入另一个任务状态中的时候，你突然收到一份邮件说 CI 步骤失败了，而且很有可能是因为忘记了分号！切换任务，修复它，提交，等待 CI 通过…… “我希望我可以在提交改动到代码仓库 以前 lint 这份代码 ” - 我无数次这样想到。 但很可惜的是，即使是在有 IDE 集成 linting 的地方，也没有能阻止我和我的同事在不同的项目中提交了带有 linting 错误的代码。在多数时候这不都是一个大问题，然而在极少数的一些情况下，这会令我在这些提交后，反过来花费数小时去寻找 bug 。明明只要我们不允许推送这些 💩 代码到代码仓库中，这些浪费时间的行 ...

我反对“初级开发者”这个头衔，因为它让我感到相当的困扰。虽然这看起来像是胡言乱语，而且也没有什么意义。但是一个来自推特的发言让我相信这仍有写出来的价值。 非常反感我们把那些拥有 2年以上开发经验 （一个理论物理学士学位或者十年经验的艺术家）称之为’初级’— Yehuda Katz (@wycats) December 7, 2015 Cui bono?（拉丁语：这有什么好处？）在任何我会想要问个问题的情形，一般来说提问“Cui bono?”或者“这对谁有好处？”都会是个好问题。我可以相当清晰的看到初级开发者这个头衔带来的缺陷： 这意味着这个开发者还没能够充当生产力 这意味着这个开发者还需要相当多管理上的工作 这意味着领导是白痴 那么这到底有谁会因此受益呢？为什么要在你的头衔里使用”初级”这个说法呢？ 企业可以支付给他们更少的工资 企业用来招募人来进入这个行业（实际上，这还是讲道理的） 制造一个阶级 关系来让某些人感觉更好 我觉得这听起来大都很令人不悦（除了为了诚心要招聘的那一条）另外这仿佛像是一个大型制造企业在告诉他们自己 听着：我从来不是一个初级开发者 ¯\_(ツ)_/ ...

如果你已经写了一段时间的 JavaScript 代码，你大概会听过像是回调地狱或者是噩梦金字塔 这类的说法。在几年前 promises 被添加到 JavaScript 中的时候。我记得我阅读到大量博客文章宣称回调地狱这类问题会得到解决。不幸的是，这看法稍微太乐观了些。随着越来越多的网页的 API 变得以 promise 为基础。我们会证明即使是 promise 也不能阻止我们写出过分嵌套且难以阅读的代码。 这些天我在完全基于 promise 的Service Worker 脚本中看到这件事发生了许多次。特别是在那些应当向我们展示 Service Worker 正确使用方法的博客文章跟教程当中。 下面的代码是一个关于如何使用 Serivce Worker 来实现一个网络优先，带缓存回调的离线支持方案的所谓的”基础”例子。就是这个代码（或者是他的一个变形版本）可以在网上的多个教程中找到。 1234567891011121314self.addEventListener('fetch', (event) => { event.respondWith( ...

当我第一次听见 WebAssembly 消息的时候就觉得它非常酷，我迫不及待地想要开始尝试使用它。然而当我不久之后开始使用 WebAssembly 的时候 ，它给我我最大的感受却是令人泄气。这篇文章的目的就是让你避免这些令人沮丧的部分。 读者须知这篇文章写于 2016 年六月 24 号， WebAssembly 还是一个非常新并且不稳定的技术，随着 WebAssembly 在各个浏览器中形成规范，这篇文章里的说的所有东西都有可能变成错误的。 有了这些说明…… 到底什么是 WebAssembly ？嗯，官方网站的说明就是这样的 WebAssembly or wasm is a new portable, size- and load-time-efficient format suitable for compilation to the web. 蛤？什么？什么的格式？文本?二进制？老实讲这就是个垃圾说明。所以，拿出你的小笔记本儿，我会用上我关于 wasm 的一切经验来给出我自己对 Wasm 的说明 WebAssembly 或者 wasm 是一个用于撰写高性能，浏览器 ...

你可能并不需要 React Router如果你现在恰好在工作中使用了 Facebook 的类库 React.js，你可能会注意到浮现在 React 社区中的一些误解。其中之一就是断言 React 只是 MVC 框架中的 V（视图）部分。为了让你在开发网页应用中像一个框架那样使用它，你需要将 React 混合其他类库一同使用。但实践上来说，你很少机会看见 React 开发者会使用 MVC 中的控制器与模型。因为基于组件的 ui 架构正在稳步占领前端社区的主流，现在已经越来越少有人会去使用 MVC 结构了。 另一个误解是 React Router 库是来自于 Facebook 的官方路由解决方案。而事实上 Facebook 里的绝大多数的项目甚至都没有使用它。说到路由，实际上在相当庞大的一部分网页应用的用例中，使用一个小而定制的路由会让整个应用变得更好。在你明确地将这个主张归类为异端邪说之前，请允许我向你展示，如何在不到50行代码的情况下实现一个功能完备的路由解决方案。 导航首先，这个解决方案没必要像 RR 所做的那样，将路由与客户端导航都写到同一个组件当中。能让你的路由真正的可通用的 ...

在 css3.0 中 flex 突出一个莽。解决了css多年的尴尬症–人们能把人送上太空，却依然无法在页面上做出垂直居中这种简单的事。而需要各种 hack 简直让人爆炸。而现在有了 flex 想水平居中就水平居中，想垂直居中就垂直居中。 说起 flex 就不得不提到阮一峰的教程，里面的内容简洁明了，非常值得一读。 本篇文章不会详细解释每个属性如何使用，仅仅是我个人的一些理解而不是教程。 flex 前言flex 实际上解决了最核心的两个需求，这是一个非常平常的需求。令人惊讶的是人们却到现在才实现了他。 控制子元素在以父元素的宽为轴的水平方向上的位置 控制子元素在以父元素的高为轴的垂直方向上的位置 这两点看起来见简单得不行。但是在没有 flex 的时代，我们就是没有很好的方法解决他。 第一点我们习惯用margin: 0 auto解决。这能让计算机自动计算外边距，以达到水平居中的效果。但是有这么几个问题： 父元素要求有确定宽度 这个方法只针对单个子元素居中，无法直接处理多个子元素居中问题。 这个方法实际上无法处理元素靠左靠右的问题。比如我想要子元素向右对齐 第二点由于历史原因，甚 ...

重要提醒：vuex 的 api 在我写这篇文章的时候已经有了大幅的改动提升。现在 vuex 更加完善地与vue集成在一起。我也应用了新的 api 到原来的概念，写了一篇 新的教程在 vuex 的官方文档中。 这篇文章还会让你非常深入的了解——为什么 vuex 如此重要，它是如何工作以及它如何让你的应用变得更好，更易于维护 Vuex 是一个由 vue 作者开发的，仍在发展中的原型库，目的在于在于帮助你按照因为Facebook的flux库（以及一系列的相似的社区实现，比如Redux）而流行起来的开发模式，来建立更加可维护的大型应用。 与直接跳进到 vuex 中并告诉你如何使用它的文章不同，在这篇文章中我会对为什么它是一个有利的替代方案，以及它到底如何帮助到你背后的理由，给出一个合理的解释。 我们建立了什么 这是一个简单的应用，它有一个按钮和计数器。按下按钮就会增加计数器的值。而且这能让我们轻松的理解那些基本概念 这个应用中有两个组件： 一个按钮（一个事件源） 一个计数器（反映基于原始事件的更新） 这两个组件既无法相互发现到对方也无法相互之间进行沟通。即使是在最细小的网页 ...

解决方法在终端中输入 echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p gulp watch error (ENOSPC)这周在工作的时候，需要同时启动两个项目。都是用 gulp 做自动化监控，自然不可避免的需要使用到 gulp 的 watch 方法。结果就报标题所示的错误 gulp watch error (ENOSPC)谷歌一番发现倒也是个挺常见的问题，官方 github 的issues历里也有相关的问题。 原因： 讲道理，这是倒不是 gulp 的问题，而是 linux 系统的问题。与系统的文件系统有关。 文件描述符的详细介绍参见维基相关词条 一开始我以为跟文件描述符有关， 简单来说，就是每个文件打开的时候都会有一个文件描述符，而 liunx 中操作文件依赖文件描述符，理论上，文件描述符应该随着文件打开而增加，上限应当与内存大小有关。 但实际上 linux 会对文件描述符的数量做限制，总的数量上一般限制为系统内存的10%，在单个进 ...

又是我，又是一个博客，不知道这次可以支持多久？

二叉树定义在计算机科学中，二叉树是每个节点最多有两个子树的树结构。通常子树被称作“左子树”（left subtree）和“右子树”（right subtree）。二叉树常被用于实现二叉查找树和二叉堆。 特点二叉树的每个结点至多只有二棵子树(不存在度大于2的结点)，二叉树的子树有左右之分，次序不能颠倒二叉树的第i层至多有2^（i-1）个结点；深度为k的二叉树至多有2^k-1个结点对任何一棵二叉树T，如果其终端结点数为n_0，度为2的结点数为n_2，则n_0=n_2+1 一棵深度为k，且有2^k-1个节点称之为满二叉树； 深度为k，有n个节点的二叉树，当且仅当其每一个节点都与深度为k的满二叉树中，序号为1至n的节点对应时，称之为完全二叉树。 在非空二叉树中，第i层的结点总数不超过2^(i-1) , i>=1； 深度为h的二叉树最多有2^h-1个结点(h>=1)，最少有h个结点； 对于任意一棵二叉树，如果其叶结点数为N0，而度数为2的结点总数为N2，则N0=N2+1； 具有n个结点的完全二叉树的深度为 有N个结点的完全二叉树各结点如果用顺序方式存储，则结点之间有如下关系： ...