文章列表

# Problem 在使用 Mac 自带邮件 App 的时候，在一段时间发现总是连不上我的 Gmail 账户，会显示如下： # Reason 首先 Mac 拉取 / 发送 Gmail 邮件走的是 SMTP/IMAP 协议，它们的端口通常不是 433（HTTP）。 而默认的 GFW 会屏蔽 Gmail 相关网站，但它没有屏蔽 SMTP/IMAP 的端口，因此即使没有使用科学上网，Mac 邮件 App 也可以正常拉取 / 发送 Gmail 邮件（当然需要先科学上网添加账户）。所以我在刚开始使用 Mac 邮件 App 的时候没有发生这个问题。 当后续我的 Clash...

# 前置网络知识 从 TCP/IP 四层说起： 应用层：决定了如果向用户提供应用实时服务通信。HTTP、FTP、Websocket 都在这里。 传输层（TCP）：负责数据的端到端传输。将应用层数据做报文分段，给每个报文添加端口、序号等数据， 网络层（IP）：将 IP 地址映射到 MAC 地址，然后将 TCP 数据包加上 IP 相关信息后放到数据链路层来让其找到目标主机。 数据链路层：将数据包与电信号进行互相转换。 # Websocket 它和 HTTP 一样是应用层协议，并且也在传输层使用了 TCP 协议。一般可以通过 HTTP 的 101Upgrade 来升级为 Websocket...

# 什么是异步加载组件 异步加载组件是指在需要的时候才加载组件。通常可以用于优化首屏加载时间，提高用户体验。其出现的原因有一点就是现在的应用都是 SPA 应用，会将所有代码打包到一个 chunk 中，导致解析代码体积过大。 在应用层面我们可以在合适的时机再去请求组件的代码，比如在路由切换的时候再去请求组件的代码。 # 技术实现 通常是通过 ES 的 import () 语法实现的。import () 语法返回一个 Promise 对象，当 Promise 对象状态变为 fulfilled 时，就会返回一个模块对象。模块对象中包含了组件的代码。 而在框架层面，比如 React，会提供一个...

IM (即时通讯应用) 的特点是实时、可靠性，即可以快速、正确的收 / 发消息，在本篇我们着重讨论可靠性。 # IM 中消息的可靠性 消息的可靠性指的是消息的不丢失和不重复，这点在 IM 中是非常重要的，特别是不丢失，你不希望编辑了一段很重要的话看似发送成功，但其实没有被对方接收到。 # 报文类型 我们可以简单地把客户端和服务器之间传输的报文看作 3 个类型。 请求报文 (Request:R)：客户端主动发送给服务器的报文。 应答报文 (Ack:A)：服务器被动回应给客户端的报文，一个请求报文对应一个应答报文。 通知报文 (Notice:N)：服务器主动发送给客户端的报文。 #...

IM (即时通讯应用) 的特点是实时、可靠性，即可以快速、正确的收 / 发消息，在本篇我们着重讨论实时性。 # IM 中保持有效长连接的重要性 使用长连接来实现的驱动力来自于，每次收发消息我们希望只是一次简单的数据发送 / 接收，而不是建立一次新的 HTTP，因为那会带来 DNS 解析、连接建立的开销。 实现上面的前提是这个长连接可以有效的保持，如果长连接的请求迟迟没有收到反馈，经常断连，那么带来的体验还不如每次新建一个...

# 进程和线程 当启用一个应用时，操作系统会为其创建一个进程以及私有的内存空间。这片空间用来存储所有程序相关的数据的状态，当应用关闭，这片空间也随之释放。而线程是跑在进程里面的。 有时候为了满足某些功能的需要，当前进程会请求系统创建另外的进程去处理其他任务，这些进程是互相独立的，只能通过 IPC 通信。很多应用程序都会采用多进程的方式来工作，因为这些进程互相独立不影响。所以当一个进程崩溃，并不会使整个程序崩溃。 # 浏览器架构 浏览器的运作当然也需要进程和线程来工作。一种是单进程架构，进程内有若干个线程工作；一种是多进程架构，每个进程都有若干个线程工作，不同进程通过 IPC 通信。 以...

之前有粗略了解过 HTTPS 加密的过程，比如对称加密、非对称加密、数字证书等等。但还是会被拷打的底裤不剩，所以认真总结一波。 # 为什么需要 HTTPS HTTP 是一种超文本传输协议，它是明文的，也就代表如果客户端的请求被中间人抓包，可以篡改中间的数据再发往服务器，服务器无法判断数据是否被人为修改过。 弊端如下： 无法保证消息的保密性 无法保证消息的准确性 无法保证消息的来源 # 基本概念 # 对称加密 客户端与服务器可以协商一份密钥，使用这个密钥对发送的消息进行加密，再对接收到的信息做解密。看起来可以确保消息的保密性。 但它存在一个缺点：这个密钥是共享的，交换过程容易存在风险...

# TCP 的首部 源端口：表示发送方的端口号 目的端口：表示接收方的端口号 序号：发送方一次 TCP 通信中每个字节的编号 确认号：对发送方发送的 TCP 报文段的确认 头部长度：表示 TCP 头部的长度，单位是 4 字节，最多为 15 个 4 字节 = 60 字节 窗口大小：TCP 流量控制的手段，表示缓冲区的大小。 校验和：校验数据的完整性。 紧急指针：紧急指针相对当前序号的偏移，也可以叫做紧急偏移。 # TCP 如何保证可靠的 三次握手、四次挥手确保连接的可靠性。 TCP 是有状态的。会记录哪些数据发送、哪些被接受，保证数据包按序到达。 TCP 是可控制的。有校验和、ACK...

# 父 / 子类型 在真实的开发中，常常需要用到 TS 的父 / 子类型进行代码类型的复用维护。所以怎么写出完善的类型是比较重要的。 首先需要搞清楚父 / 子类型的定义： 1234567interface Animal { age: number;}interface Dog extends Animal { bark(): void;} 上面的 Dog 就是 Animal 的子类型。子类型通常由父类型扩展而来，它可以拥有更多的属性，更加的...

# 前言 在学习 Typescript 的时候都只在项目简单的使用，很多高级类型都没有接触过。所以最近开始学习 TypeScript 的类型体操，一方面熟悉高级类型，也锻炼自己的手写 TS 类型的能力。 过程中也发现同一个关键字在不同场景下的用法是不一样的，所以记录一下。 # 常见语法 特性 interface type 语法 interface User { name: string } type User = { name: string } 扩展方式 extends 继承 &...