Nginx--简论
本文会帮你解答一个问题，nginx 这玩意儿是干嘛的Nginx 是啥，官方说法，一种高性能的 http 与反向代理的 web 服务器。什么叫高性能？说白了就是响应尽可能地快。一般的项目后端配置 tomcat 即可满足需求，因为一个站点在某个时刻不可能会有大量的请求达到。tomcat 最高同时能够满足 5、600 的请求响应，所以说一般场景下基本 hold 住。但是总有些热门的站点。在某一时刻会有数以万计的请求，这个时候，tomcat 就扛不住了，服务器直接飘红。为了解决这一问题，nginx 就来了（最大支持 50000 请求）。
反向代理、负载均衡、动静分离、打包预览
反向代理先说明什么是正向代理。玩吃鸡这类游戏的时候，我们往往要挂个加速器（vpn），不然就很慢。关于为什么慢甚至无法访问，请移步”梯子”那篇文章。这里的加速器，就是正向代理，开启代理，我们触发的任何请求均是由加速器代替我们的客户端发出去的。即：代理客户端就是正向代理。而反向代理的典型就是 nginx。当客户端的请求发送给服务端的时候，实际上被 nginx 拦截，代替服务端返回响应。即：代理服务端就叫做反向代理。两者的效果 ...
Cookie、Token相关
cookie、token都是做鉴权验证的方式，实际上还应该有一个session，面试的时候总会问的一个问题：cookie、session和token的区别。实际上我认为这个问题很傻叉。因为本质上讲这三个东西就是一个东西，这种问题的逻辑，就相当于一只鸡从上下左右观察有什么区别。有鸡毛区别。
鉴权的两种方式：
cookie+session
用户登录，提交用户信息
后端根据用户提交的数据生成一个sessionID，存储到磁盘，并通过set-cookie返回给前端
前端收到自动存储到对应域名下的cookie中，之后的每次请求，都会自动带上这sessionID
token
用户登录，提交用户信息
后段通过jwt等库提供的加密方式，生成一串字符串，无需存储，通过set-cookie返回给前端
前端收到自动存储到对应域名下的cookie中，之后的每次请求，都会自动带上这token，后端只需要判断是不是他生成的即可
过程一致，唯一不同的，就是一个叫sessionID，一个叫token字符串，。这种问题，毫无意义。
Vue.js系列：深入理解生命周期
我tm今天才知道，路由跳转时，旧页面的beforeDestroy，居然是在新页面的created之后。。。。理由很简单，倘若新页面的created逻辑太多导致页面空白。所以如此操作。。。。。
Vue.js系列：vue的路由实现
vue-router存在的目的，就是实现纯前端的路由跳转，需要满足两点：无刷新、内容切换目下就是两种模式：hash模式和history模式
Hash模式：#后面跟着路径（hash值），浏览器向后端发请求时， #后头的字段不会给到后段。因为#只是一个标识符。例如：http://www.xxx.com/#/info.html，后段只会收到`http://www.xxx.com`实现原理：通过监听hashchange,获悉当前url，显示对应视图内容。
window.addEventListener('hashchange', updateView)
Historyh5新增的api，通过history.pushstate、history.popstate跳转到对应路由，显示对应视图,也能实现一样的功能，但是因为少个#，所以更加的美观.例如：http://www.xxx.com/info.html
但该方法准确的讲，是能够实现当用户没有刷新整个页面的情况下，实现视图的更新。如果强制刷新了页面，请求会带上路由中所有字段，后端收到该地址，匹配不到对应地址，出现404，因为没有匹配到任何资源.如何 ...
Vue.js系列：数组变化的侦测
本文详细介绍vue2，对于数组变化的侦测vue2中针对数组的响应式，跟对象的响应式还是有些区别的，总的原则还是那句话：getter中搜集依赖，setter中触发依赖。，但是数组可以调用push等这些能够添加删除数据的api，变更数据。再介绍对象的属性监听时说过，这种操作无法捕捉到，所以vue单独用$set和$delete处理。那么针对数组，vue2又是如何处理的呢？
vue2针对数组，做了一层拦截器。即：当通过那些api变更数据时，实际触发的是我们自己写的函数，然后再走原生方法，这样，每次变更，走我们自己的方法时，就可以执行触发依赖的操作。示例代码如下：
const data = [1,2,3,4]
for (let key in data) {
let val = data[key]
Object.defineProperty(data, key, {
enumerable: true,
get() {
console.log('搜集以来')
return val
...
拥塞窗口的策略机制
本文主要介绍tcp数据包的传输策略：拥塞窗口请大家思考一个问题，为什么说TCP协议是可靠的？是什么东西保证了他的可靠？答案就是“拥塞窗口机制”：拥塞窗口机制确保了，在指定窗口大小的情况下，传输的数据包是完整未丢失的，也就是可靠的。
所谓的“拥塞窗口”是指：在接收方确认数据包之前，发送方可以发出的tcp包的个数。假如拥塞窗口大小为1，那么发送方在发出一个数据包之后，就只能等待，直到接收到接收方的确认信息之后，再发送第二个数据包。那么大小是如何确定的呢？这就涉及到另一个概念慢启动。慢启动的目标，是为了让新链接搞清楚，当前网络的负载状况。默认值可以从1开始，发送方再接收到第一个包的确认后，除了发送第二个包以外，还可以额外再发送一个，也就是一个确认对应俩，指数级别的增加，直到达到阈值。若中间出现丢包情况，自动回缩窗口大小，以适应当前网络状况，匹配出最佳大小。
Vue.js系列：实现一个自己的vue续篇
在前文中，我们已经实现了模板编译的功能。即用我们自己写的vue，已经能够自动的解析页面中的变量，给予展示。那么接下来，我们要更进一步：当变量的值变化的时候，我们能够感知到这种变化，并同步更新到视图。目标拆分： 感知变化,更新视图
感知变化通俗点说，我们需要知道变量值改变的时刻。如何实现？借助defineProperty将目标变量变成响应式。写一个类实现之：
class Obsever {
constructor(vm) {
this.vm = vm
this.data = vm.$data
this.obsever()
}
obsever() {
const dep = new Dep()
for (let key in this.data) {
let val = this.data[key]
Object.defineProperty(this.data, key, {
...
Vue.js系列：实现一个自己的vue
本文开始，我们尝试着实现一个自个儿的vue框架（简陋版本）。
基本功能数据变化，更新视图，视图变化，改变数据。(MVVM中的VM做的事情)
首先我们的页面结构如下：<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My_vue</title>
</head>
<body>
<div id="app">
<input type="text" v-model="msg">
<div>{{msg}}---{{info}}</ ...
Vue.js系列：patch
节点的patch（补丁）操作，是虚拟dom核心中的核心,就是对比出新旧节点中，变化了的那些部分。本质上来讲就三种情况：创建节点、删除节点和修改需要更新的节点。
创建节点，两种情况。
当oldVnode中不存在但是vnode中存在的某些节点时，需要创建新节点
当新旧节点是完全不同的节点时，比如新节点时一个text，但是旧节点是一个div。此时需要删除旧的创建新的。
删除节点：上面提了不赘述
当两个节点是同一节点的时候，才需要进行更新节点的操作
3.1 首先判断新旧节点是否为如下所示的静态节点：
<p>asdasdasd</p>
所谓的静态节点就是不存在状态的标签节点。此时，直接跳过，因为他不会变化。
3.2 新节点是否为文本节点3.2.1 新节点是文本节点： 旧节点有children删children，有text覆盖更新3.2.2 新节点不是文本节点，是元素节点3.2.2.1 新节点有children3.2.2.1.1 旧节点无children：遍历新节点children挨个添加3.2.2.1.2 旧节点有children： Diff后论3.2.2.2 新 ...
Vue.js系列：虚拟dom
首先开宗明义，为什么要用虚拟DOM？理论上来讲，任何状态改变后，我们完全可以粗暴的根据当前的状态，生成对应的dom，就像jquery时代那样。但是设想一个场景：有一个ul下面绑着是个li标签。我们可能只是改变了其中的一个li，就是说此时，我们只需要更新那个变化了的li即可，而不需要费劲的旧dom全删了然后再一个个重新创建一遍。虚拟DOM就是为了解决这个问题，本质上做了两件事情：
提供与真实dom节点对应的虚拟节点vnode（就是一个对象）
每次状态变化后，生成新的vnode，然后通过算法对新旧vnode对比，找出变化了的更新即可。重在性能优化，这也是为什么这些框架如此流行。
那么具体，什么是虚拟DOM(Vnode)？DOM元素有元素节点（div）、文本节点（text）、注释节点等。vnode实际上就是这些节点的ADT（抽象数据类型）。举例解释：
<p>asdasdasd</p>
const vnode = {
tag: 'p',
data: {...} // 比如class、style等
children: [... ...