上一篇文章我写了tapable的基本用法，我们知道他是一个增强版版的发布订阅模式，本文想来学习下他的源码。tapable的源码我读了一下，发现他的抽象程度比较高，直接扎进去反而会让人云里雾里的，所以本文会从最简单的SyncHook和发布订阅模式入手，再一步一步抽象，慢慢变成他源码的样子。

前不久写了一篇webpack基本原理和AST用法的文章，本来想接着写webpack plugin的原理的，但是发现webpack plugin高度依赖tapable这个库，不清楚tapable而直接去看webpack plugin始终有点雾里看花的意思。所以就先去看了下tapable的文档和源码，发现这个库非常有意思，是增强版的发布订阅模式。发布订阅模式在源码世界实在...

我从事技术写作的时间其实不长，开始写作的时间就是我掘金账号注册的时间：到今天(2021年2月23日)也就是一年零一个月，这一年的收获是超过我的预期的：产出博文四十多篇，总共数十万字掘金优秀作者，掘金年度人气作者No.27思否2020年度"Top Writer"，万粉专栏作者开源中国优秀源创作者，源创计划年度活跃博主 Top20本文...

本文开始我会围绕webpack和babel写一系列的工程化文章，这两个工具我虽然天天用，但是对他们的原理理解的其实不是很深入，写这些文章的过程其实也是我深入学习的过程。由于webpack和babel的体系太大，知识点众多，不可能一篇文章囊括所有知识点，目前我的计划是从简单入手，先实现一个最简单的可以运行的webpack，然后再...

本文会分享一个React性能优化的故事，这也是我在工作中真实遇到的故事，最终我们是通过魔改第三方库源码将它性能提高了几十倍。这个第三方库也是很有名的，在GitHub上有4.5k star，这就是：react-big-calendar。

假设你是一个商店老板，你需要给顾客找零n元钱，你手上有的钱的面值为：100元，50元，20元，5元，1元。请问如何找零使得所需要的钱币数量最少？例子：你需要找零126元，则所需钱币数量最少的方案为100元1找，20元1张，5元1张，1元1张。

动态规划是一种常用的算法思想，很多朋友觉得不好理解，其实不然，如果掌握了他的核心思想，并且多多练习还是可以掌握的。下面我们由浅入深的来讲讲动态规划。

本文会分享一个我在实际工作中遇到的案例，从最开始的需求分析到项目搭建，以及最后落地的架构的整个过程。最终实现的效果是使用mono-repo实现了跨项目的组件共享。在本文中你可以看到：

上一篇文章我写了koa-static的源码解析，其中用到了HTTP的缓存策略，给返回的静态文件设置了一些缓存的头，比如Cache-Control之类的。于是我就跟朋友讨论了一下HTTP的缓存策略：

这篇文章继续前面的Koa源码系列，这个系列已经有两篇文章了：第一篇讲解了Koa的核心架构和源码：手写Koa.js源码第二篇讲解了@koa/router的架构和源码：手写@koa/router源码本文会接着讲一个常用的中间件----koa-static，这个中间件是用来搭建静态服务器的。其实在我之前使用Node.js原生API写一个web服务器已经讲过怎么返...

我们写的代码都是为了一定的需求服务的，但是这些需求并不是一成不变的，当需求变更了，如果我们代码的扩展性很好，我们可能只需要简单的添加或者删除模块就行了，如果扩展性不好，可能所有代码都需要重写，那就是一场灾难了，所以提高代码的扩展性是势在必行的。怎样才算有好的扩展性呢？好的扩展性应该具备以下特征:

这段时间写了一堆源码解析，这篇文章想换换口味，跟大家分享一个我工作中遇到的案例。毕竟作为一个打工人，上班除了摸鱼看源码外，砖还是要搬的。本文会分享一个使用恰当的数据结构来进行性能优化，从而大幅提高响应速度的故事，提高有几百倍那么多。

上一篇文章我们讲了Koa的基本架构，可以看到Koa的基本架构只有中间件内核，并没有其他功能，路由功能也没有。要实现路由功能我们必须引入第三方中间件，本文要讲的路由中间件是@koa/router，这个中间件是挂在Koa官方名下的，他跟另一个中间件koa-router名字很像。其实@koa/router是fork的koa-router，因为koa-router的作...

Express的源码还是比较复杂的，自带了路由处理和静态资源支持等等功能，功能比较全面。与之相比，本文要讲的Koa就简洁多了，Koa虽然是Express的原班人马写的，但是设计思路却不一样。Express更多是偏向All in one的思想，各种功能都集成在一起，而Koa本身的库只有一个中间件内核，其他像路由处理和静态资源这些功能都没...

上一篇文章我们讲了怎么用Node.js原生API来写一个web服务器，虽然代码比较丑，但是基本功能还是有的。但是一般我们不会直接用原生API来写，而是借助框架来做，比如本文要讲的Express。通过上一篇文章的铺垫，我们可以猜测，Express其实也没有什么黑魔法，也仅仅是原生API的封装，主要是用来提供更好的扩展性，使用起来更...

Node.js是JavaScript基础上发展起来的语言，所以前端开发者应该天生就会一点。一般我们会用它来做CLI工具或者Web服务器，做Web服务器也有很多成熟的框架，比如Express和Koa。但是Express和Koa都是对Node.js原生API的封装，所以其实不借助任何框架，只用原生API我们也能写一个Web服务器出来。本文要讲的就是不借助框架，...

上一篇文章我们分析了Redux-Thunk的源码，可以看到他的代码非常简单，只是让dispatch可以处理函数类型的action，其作者也承认对于复杂场景，Redux-Thunk并不适用，还推荐了Redux-Saga来处理复杂副作用。本文要讲的就是Redux-Saga，这个也是我在实际工作中使用最多的Redux异步解决方案。Redux-Saga比Redux-Thunk复杂得多...

前段时间，我们写了一篇Redux源码分析的文章，也分析了跟React连接的库React-Redux的源码实现。但是在Redux的生态中还有一个很重要的部分没有涉及到，那就是Redux的异步解决方案。本文会讲解Redux官方实现的异步解决方案----Redux-Thunk，我们还是会从基本的用法入手，再到原理解析，然后自己手写一个Redux-Thunk来替换...

这篇文章跟大家讨论一个比较有意思的问题：怎么破解https？大家都知道，现在几乎整个互联网都采用了https，不是https的网站某些浏览器还会给出警告。面试中也经常问到https，本文会深入https原理，一直讲到https破解思路。

模块是Node.js里面一个很基本也很重要的概念，各种原生类库是通过模块提供的，第三方库也是通过模块进行管理和引用的。本文会从基本的模块原理出发，到最后我们会利用这个原理，自己实现一个简单的模块加载机制，即自己实现一个require。

封装好的代码，内部变量不会污染外部。可以作为一个模块给外部调用。外部调用者不需要知道实现的细节，只需要按照约定的规范使用就行了。对扩展开放，对修改关闭，即开闭原则。外部不能修改模块，既保证了模块内部的正确性，又可以留出扩展接口，使用灵活。

函数式编程是一种编程范式，是一种构建计算机程序结构和元素的风格，它把计算看作是对数学函数的评估，避免了状态的变化和数据的可变，与函数式编程相对的是命令式编程。我们有这样一个需求，给数组的每个数字加一：

这篇文章是讲JS异步原理和实现方式的第四篇文章，前面三篇是：setTimeout和setImmediate到底谁先执行，本文让你彻底理解Event Loop从发布订阅模式入手读懂Node.js的EventEmitter源码手写一个Promise/A+,完美通过官方872个测试用例本文主要会讲Generator的运用和实现原理，然后我们会去读一下co模块的源码，最后还会提一...

上面的计算方法就是函数的嵌套执行，而我们compose的作用就是将嵌套执行的方法作为参数平铺，嵌套执行的时候，里面的方法也就是右边的方法最开始执行，然后往左边返回，我们的compose方法也是从右边的参数开始执行，所以我们的目标就很明确了，我们需要一个像这样的compose方法：

上一篇文章我们讲了React-Router的基本用法，并实现了常见的前端路由鉴权。本文会继续深入React-Router讲讲他的源码，套路还是一样的，我们先用官方的API实现一个简单的例子，然后自己手写这些API来替换官方的并且保持功能不变。

React-Router是React生态里面很重要的一环，现在React的单页应用的路由基本都是前端自己管理的，而不像以前是后端路由，React管理路由的库常用的就是React-Router。本文想写一下React-Router的使用，但是光介绍API又太平淡了，而且官方文档已经写得很好了，我这里就用一个常见的开发场景来看看React-Router是怎么用的吧...

前面一篇文章setTimeout和setImmediate到底谁先执行，本文让你彻底理解Event Loop详细讲解了浏览器和Node.js的异步API及其底层原理Event Loop。本文会讲一下不用原生API怎么达到异步的效果，也就是发布订阅模式。发布订阅模式在面试中也是高频考点，本文会自己实现一个发布订阅模式，弄懂了他的原理后，我们就可以去读No...

笔者以前面试的时候经常遇到写一堆setTimeout,setImmediate来问哪个先执行。本文主要就是来讲这个问题的，但是不是简单的讲讲哪个先，哪个后。笼统的知道setImmediate比setTimeout(fn, 0)先执行是不够的，因为有些情况下setTimeout(fn, 0)是会比setImmediate先执行的。要彻底搞明白这个问题，我们需要系统的学习JS的异步...

JS中的this是一个老生常谈的问题了，因为它并不是一个确定的值，在不同情况下有不同的指向，所以也经常使人困惑。本篇文章会谈谈我自己对this的理解。

在讲这个之前我们先来说说类，了解面向对象的朋友应该都知道，如果我要定义一个通用的类型我可以使用类(class)。比如在java中我们可以这样定义一个类：