阅读须知：
由于是朋友面试问题的记录。所以问题的答案是我个人的，也只针对我个人，会相对简洁当做记录总结，当然如果有错或者有误感谢各位大佬指出！
问题
- http与https的区别
- ca证书怎么用
- 三次握手四次挥手分别指什么
- TCP跟UDP的区别
- 虚拟的DoM为何比真实DOM更好
- 什么情况下用React与Vue性能更差
- 做过什么性能优化，多图标多图片的处理
个人回答
问题1：
这个问题面试官肯定冲着网络基础相关去问的。
首先HTTP是一种超文本传输协议，而HTTPS也就是在HTTP和TCP之间新增了SSL/TLS安全传输层。
所以区别有大致为：
1.HTTP明文传输，不安全。HTTPS新增安全层，是报文加密传输。由于新增了一层所以HTTP需要在原本的与TCP三次握手之后，还要与SSL/TLS握手，所以也相对会增加一部分的时间消耗。
2.HTTPS需要向CA也就是证书权威机构申请数字证书，来确认服务器身份可信度。
3.默认端口号不同，HTTP和HTTPS分别是80和443。
PS:SSL/TLS是一个东西指传输层安全协议，不是两个，只是SSL标准化后改命成TLS。
问题2：
这个问题其实我也没明白面试官想问什么。
我的想法就是去CA机构申请一个数字证书，就是服务器把自己的公钥注册到CA，CA用自己的私钥将公钥签名并颁发数字证书。 客服端拿到服务器的数字证书后，使用CA公钥确认证书的真实性。
简单的说就是 客户端向服务器索要公钥，用公钥加密信息，服务器收到密文用自己的私钥解密。但是为了保证公钥的信任度和不被篡改，就要使用第三方数字证书。
问题3：
这个问题很直白就是想问问HTTP和TCP建立连接和断开的过程。
三次握手： 客户端打算建立连接时
1.首先客户端随机初始化序号client_isn,然后将他置于TCP首部的序号字段中，同时把SYN标志位置为1，发送SYN报文给服务器，进入SYN-SENT状态
2.服务器接收到SYN报文后，初始化自己的序列号server_isn,也将它填入TCP首部序号字段中，再把客户端填入的client_isn+1,接着把SYN和ACK标志位置为1，发送报文给客户端，然后由LISTEN进入SYN-RCVD状态。
3.客户端接收到报文后，把服务端填入的server_isn+1，同时把ACK标志位置位1，发送ACK应答报文。然后进入ESTABLISHED状态，服务器接收到应答报文后也进入该状态。双方连接建立完成。
ps:第三次握手是可以携带数据的。
四次挥手： 客户端打算断开连接时
1.客户端会发送一个TCP首部FIN标志位被置位1的报文，然后进入FIN_WAIT_1状态。
2.服务端接收报文后会向客户端发送ACK应答报文，然后进入CLOSED_WAIT状态，而客户端收到ACK报文后会进入FIN_WAIT_2状态。
3.等服务器处理完数据后也会向客户端发送FIN报文，进入TIME_WAIT状态。
4.客户端接收到FIN报文后会回一个ACK应答报文，之后也进入TIME_WAIT状态。然后服务器接收应答报文后进入CLOSED，关闭连接。客户端2MSL后也自动CLOSED。
其实这里还可以扩展：
1.为什么是三次握手？
可以阻止重复历史连接的初始化，同步双方初始化序列号也需要三次，才能避免浪费资源。
问题4：
这里可以浅谈下2者的区别和应用场景
区别：
1.连接：TCP是面向连接的传输层协议，传输数据要先建立连接。而UDP不需要，可以直接传输数据。
2.服务对象：TCP是一对一的服务，而UDP还可以支持一对多，简称海王。
3.可靠性：TCP因为需要建立连接，所以可以保证数据的完整，无错，不重复和按需抵达。而UDP是尽力完成交付，但不保证可靠交付数据。
4.拥塞控制，流量控制：TCP拥有阻塞机制和流量控制机制来保证数据传输的安全性。而UDP则没有，哪怕网络拥堵，也不影响发送速率。
5.首部开销：TCP首部长度较长，而且可以使用选项字段，至少20个字节。而UDP只有8个字节且固定不变，开销较小。
6.传输方式：TCP是流式传输，没有边界，且保证顺序和可靠。UDP是一个包一个包发送，有边界的，但是可能会丢包或者乱序。
7.分片不同：TCP数据如果大于MSS大小就会在传输层分片，也会在传输层组装，丢失那个分片就重新传输那个分片。而UDP则要大于MTU大小才在IP层分片，也会在IP层组装。但是丢了一个分片，整个数据包都要重新传送。
场景：
TCP：FTP文件传输，HTTP/HTTPS 特点：可靠
UDP：DNS、SNMP，音视频，通信等 特点：效率高
问题5：
这里面试官考查对虚拟dom的理解。老生常谈的问题了，一句话简述，这里就不多展开了。
虚拟 dom 相当于在 js 和真实 dom 中间加了一个缓存，利用 dom diff 算法避免了没有必要的 dom 操作，从而提高性能。
然后可以延伸至diff算法，然后在讲讲dom diff。注意：这里两者是有区别的。最后还可以延伸至vue diff算法和react diff算法，两者也有一些区别。
问题6：
这里面试官考查对前端常用的两大框架的理解。但是就性能一点，应该是在问两者diff算法的区别。然后可以聊聊两者的区别和适用场景。
两者diff中react采用从头至尾的遍历，vue采用的是双端遍历的比较。所以在一些大列表渲染的项目中vue表现更好，同时vue也更支持SEO。
老实说，就两者来说。很多相似之处，也有一些区别。比如写法上一个是模板语法，一个是JSX。vue是数据双向绑定，react则是数据单向流。一个强调数据可变性，一个强调数据不可变。
就vue2.0和react 15比较对于我来说，如果是中小型项目我更愿意用vue开发。而比较复杂的体量大的项目则比较合适用react。
因为vue数据响应的内部实现，已经帮你实现了很多性能的优化，多余的计算和渲染开销等等...。
但是你用react开发，你得特意去做一些优化，而且一不小心就会导致性能下降。不会合理运用purecomponent/shouldupdate这些，在中小型项目中性能一定相比于vue性能差。
而大型项目中使用react你的掌握力就更多。由于性能问题你的代码也会更加规范，可维护性也更高。
问题7：
这里考察一些常见的优化点，但是最好有一些有过程的专项的优化，这样才能讲的下去。优化细节就不多赘述：
常见的比如：减少网络请求次数、CDN、使用树摇，开启GZIP压缩等等，图片懒加载，使用base64编码，复杂图片的模糊到清晰的渲染。多图标使用精灵图。减少静态资源等等。
专项优化：
1.大列表大数据优化渲染及计算：分页，虚拟滚动。使用web workers计算数据等等。
2.离线上传下载优化：速度方面，压缩文件，分片等等。
3.webpack打包方面的优化点等。
面试心得
首先你的会揣摩面试官的心理。你要清楚他问你问题想要的回答是什么，这样让你的面试顺利。
同时回答不能太官方要加入自己的理解，不要背八股文，最好能有一定扩展。好比问题234都是问题1的扩展。
但是也不能聊的太多，要给面试官留追问的空间，当然大佬就不需要。最重要的是不要往自己知识薄弱的点带，扩展的时候一定要往自己的得心应手的知识点上带。
最后，祝我自己来年涨薪，心想事成！
