HTTP版本演进：第三回
本文的目的，就是要填前文留下的坑。为了更加充分的使用c端和s端的效率，解决队首阻塞。两个方案：并行tcp链接，以及http2.0版本的多路复用。
并行tcp链接这个方法简单粗暴。1.1版本的http协议不是严格执行串行传输嘛，那好，我们就多开几个tcp链接。同时s端开启多线程并行处理响应。目前主流的浏览器厂商都默认最大支持6条线路。至于为什么是6，而不是更大的数值，权衡的结果。这种方法，能在一定程度上，实现优化的效果，但是治标不治本，对于并行的每条链路而言，依然存在队首阻塞的问题。
HTTP的2.0HTTP/2基于SPDY，专注于性能，最大的一个目标是在用户和网站间只用一个连接（connection）
1. 二进制分帧如下图所示：
传统1.x传输的是纯文本的报文（字节）， 而2.0是将请求和响应的数据切分成更小的数据帧，传输的是其二进制格式的数据，提高解析的效率。
2.0版本的数据传输如下图所示，所有的数据传输都是基于一个TCP链接。一个完整的请求响应称为一个流，流又有请求消息和响应消息组成，而具体的消息就是帧。这样的解释更多的是逻辑上的理解。本质就是数据被二进制分帧，乱序发送与组装， ...
HTTP版本演进：第二回
续前文，本文将详细的介绍一下1.x版本的特性，主要就是1.1啦。
1.x版本的三个特点：
长连接
管道化
串行传输
长连接1.0版本遵循的规则是：建立链路--发送请求--接收响应--断开链路。对于每一个请求而言，1.5个rtt（往返时延）是必须的。假使我们现在有n个请求，那么固定的时耗就是1.5 * n。那么1.1的重大改进，就是利用长连接，实现了多个请求共用一个TCP连接通道。这样除了第一个请求外，对于后面的每个请求，都能省去用于建立链路的1个rtt耗时，即：我们能够节省（n-1）次的rtt（往返时延）。这就是长连接带来的好处。
插个题外话：我们知道，c端在发送资源请求之前，需要通过三次握手建立连接链路，时间损耗，就用掉了1.5个往返，这里有个细节我之前一直没在意。就是发送资源请求的时间点与建立连接的那最后0.5的往返时刻是同时发生的，可以理解为，1.5的往返耗时，包含了请求时间，见下图：
同时，通过上图，也能看出，为什么1.1版本的改进影响巨大。著名案例就是苹果的工程师们针对itunes的改进，有兴趣自行谷歌。
但是，通过长连接虽然实现了公用tcp链路，我们发现了新的问题，因为规 ...
HTTP版本演进：第一回
本系列文章，严重参考《高性能浏览器网络》和《HTTP权威指南》
前言：http的设计思路，起源于20世纪三十年代的一篇文章：《As we may think》，作者美国MIT工程学院的电子工程师Vannevar Bush，该文尝试探讨了人们每天生产的信息量和社会消化信息的能力。一句话总结：信息太多，别说消化了，查找都费劲。得设计一个更牛叉的东西，帮助我们提高效率。这就是http超文本概念的起源，超越文本的信息存在。虽然概念的正式提出得30多年之后但是，在此还是由衷的对这些仰望星空的前辈们致敬。
http和https：http就是超文本传输协议，所谓的协议就是一种约定，约定了在双方或者多方之间传输的数据的格式，仅此而已。这是1991年万维网之父伯纳斯李同学提出并设计的一套协议。主要目的就是机器之间能够互传资源，实现网络互联的真实需求。请求与响应。即：客户端向服务器发送资源请求，服务器端响应返回对应资源。https则是在http之外，又包了一层SSL，也就是安全套接层，用于加密传输，保证数据的可靠性。
总体划分四个版本：0.9、1.0、1.1和2.0
0.9版本该版本可以视为初代机，只有一 ...
Webpack系列：第四回
以前面的先验内容为铺垫，本文将会仔细的介绍webpack的基本打包思路，最终目标，手撕一个自己的webpack。
前期准备首先再次重申一个重点：webpack的根本目的,是为了将我们写的代码转换成浏览器能够执行的代码,并且将分散的各个模块，揉成一个统一的文件。然后直接在index.js中引入即可那么我们的mywebpack.js的目标就是一个，从入口文件读取各个模块，生成转换后的代码，写到bundle.js文件，成功与否检验的标准就一个，index.html引入该bundle.js，看看浏览器能否正确显示。
实际讲解之前，准备好一些相关的文件。index.html、index.js、helloGirl.js和hello.js、template模板文件，当然还有我们最为重要的mywebpack.js。
// 1. 其中index.js入口文件，四段极为工整的代码块。：
import helloGirl from "./helloGirl.js";
const helloWorldStr = helloGirl();
function component() {
const ...
Webpack系列：第一回
本文开始， 我们尝试深入理解一下前端神器webpack。最终的目标：能够理解前端模块化，理解webpack打包的核心思路及执行，理解webpack中的“关键人物”。解锁这三点，最终彻底掌握。
Webpack干啥的打包用的，简单说就是将项目的各种零散的文件揉成一个完整的js。比如我们的项目一共用到了a.js,b.js,c.js共三个文件，打包后就成了一个bundle.js。那问题来了，为什么要打包？我就喜欢零散的，咋了？
客观存在的需求
其一： 零散文件使用，各个文件之间的依赖关系顺序，需要人为的梳理。比如在a文件里用到了b文件的某个属性，那么，b文件就应该先于a文件加载，否则error。可想而知此等操作，项目的复杂度一上来，开发人员直接崩溃。
其二： 零散文件意味着，请求的数目随文件个数线性放大。那么遵循不发请求或者少发请求的终极性能准则，此方法依旧鸡肋。
因此，我们的神器webpack应运而生。当然啦，除了他还有很多其他的如gulp、parcel等的工具，非独此一款。
webpack具体的能力
合并文件。在项目中，我们可能会到处import各种依赖，这些依赖又分布在各个文件中。we ...
Preparing the Preliminary Actions
The new-era software laborer is the official term for people working in software development (hehe), and today the group roughly splits into frontend and backend. Their roles are well-defined, and occasionally there are full-stack masters who can handle every tricky issue without batting an eye (but are exhausted to the bone).
Putting aside the backend Java ecosystem, a single frontend role already offers endless topics to study. The three frameworks—Angular, Vue, React—do you master all of them ...