1. https和http优缺点

    设计到对称加密和非对称加密
    https缓存机制没有Http高效
    SSL证书要钱而且一个证书只能绑定一个ip地址
    http是明文传输的，那对称加密的是什么？

    1. 实现一个多人在线聊天记录

    怎么确保用户信息，怎么存储，当同一时间有大数据量，怎么处理

    1. weakMap和Map,weakSet和Set区别
      1. Map支持任意的类型为key，weakMap只支持对象类型为Key
      2. 因为wekpMap的key是弱引用，所以如果引用类型被回收，weakMap里面的的内存也会被释放，所以没有size
    2. tranform/transition/animation
      1. tranform只静态类型的改变，比如变形，旋转
      2. transition是过渡，也是有timing和time-function(曲线规则)，一般配合:hover :check等实现
      3. transition需要一个事件触发，而且不能连续性，而且只能绑定一个属性的变化，不能有中间状态
      4. animation需要写一个@keyframe定义一个动画名称
    3. vue2.0中怎么做去重操作的
      1. 每一个dep对象都对应一个递增uid，然后内部维护这一个depIds的数组，如果在数组内部，就不进行重复收集
    4. webpack 热更新
      1. 服务器端构建，推送更新消息
        1. 注入HRM runtime代码逻辑
        2. 找到修改的模块，生成一个补丁js和更新描述Json文件
        3. 生成两个文件[id].[hash].hot-update.js和[hash].hot-update.json，一个是说明更新了什么信息，一个是放更新之后的模块
        4. 文件更新之后，需要通知浏览器端打包号的新的补丁文件，可以拉代码了
      2. 浏览器端拉取更新模块
        1. 浏览器端通过补丁文件，去服务器端拉取更新的js文件
      3. 浏览器端页面渲染
        1. 浏览器端通过注入的HRM runtime代码实现页面更新
    5. v-model实现原理
    6. slot的实现原理
    7. TCP和UDP
      1. UDP是面向无连接的
      2. UDP面向报文的，不会将数据做拼接或者拆分，TCP是基于流的，靠包的编号以及确认号
      3. TCP在发生丢包的情形中，会采用重传的机制。TCP采用流量控制和拥塞控制
      4. UDP支持一对一，一对多，多对一，多对多交互通讯，TCP只能一对一通讯
      5. UDP首部开销小，仅仅8个字节，TCP首部最小20个字节
      6. UDP使用于实时应用（视屏会议，直播等）
      7. TCP要求可靠传输应用
    8. esbuild,vite,snowWebpack,webpack
      1. esbuild采用go语言编写，实现本地编译化，采用并行方式
      2. vite是基于esbuild构建的，然后在本地是不需要编译的，在服务器端做编译
    9. 什么是BFC，怎么触发，应用场景
      1. BFC是块级格式化上下文，它是一种规则，决定了元素内容如何定位，以及相关元素的作用
      2. 触发： overflow:hidden,display:inline-block/flex/table-cell,position:absolute,fixed
      3. 内部margin会重叠，计算BFC高度的时候，浮动元素也会参与计算
      4. 场景：float脱离文档流，高度坍塌，margin边距重叠
    10. get和post区别
      1. options请求，预检查，会检查请求投中的Access-Control-Request-Method和Access-Control-Request-Headers
      2. options请求是有缓存的，Access-Control-Max-Age做缓存，一般为10分钟，10分钟内不再发options请求
      3. get是幂等的，可以被浏览器缓存，get参数长度有限制
    11. socket.io实现原理，以及心跳检查机制，长轮询和短轮询
      1. websocket基于tcp建立连接，请求头中带上Connecttion:Upgrade,Upgrade:websocket给服务器端
      2. 服务器端识别后进行服务升级，升级成websocket协议
      3. 返回：Code: 101(Switching Protocols)

    socket.io工作流程
    a. socket.io首先建立一个长连接，发送给服务器端，pingInterval心跳检查的时间

    1. {"sid":"ab4507c4-d947-4deb-92e4-8a9e34a9f0b2","upgrades":["websocket"],"pingInterval":25000,"pingTimeout":60000}
    1.     b. 客户端通过判断客户端是否支持websocket，如果支持，则建立一个websocket，否则使用一个poll长轮询进行双向通讯

    长轮询：客户端发送请求到服务器端，服务器端先hold住，等到有数据返回的话，就返回数据到客户端，然后断开连接，客服端再重新发起连接
    短轮询：客服端定时向服务端发送请求，查询是否有更新

    为什么要发送心跳包？

    1. 连接断开，需要重连
    2. 连接没有断开，但是不可用
    3. 服务不可用

    对于第二种和第三种，就需要心跳检测来感知连接是否可用。
    对于断网，TCP一般不是能很快速的检测到，如果断网之后再联网，websocket通讯还是可以使用的

    1. react和vue
      1. Fiber出现的目的
        1. 如果组件层级比较深的话，会有卡顿
        2. 减少页面卡顿
        3. Virtual Dom对比过程使用了递归，递归调用的过程不能被终止
        4. Fiber放弃 了递归，采用循环来模拟递归，因为循环可以随时停止
        5. 利用浏览器的空闲时间执行任务
        6. 每个虚拟节点就是一个fiber任务，将整个任务拆成小的任务
        7. Fiber是一种链表数据结构，采用的后序遍历
        8. Fiber的工作方式分为render阶段和commit阶段
        9. render阶段是构建链表的，在构建过程中标记DOM执行的操作
        10. commit的阶段，根据构建号的链表进行DOM操作，不可中断
      2. vue是渐进式js框架，主张最少，增量开发，并不需要一下子就学习vue-router,vuex等，只关注试图渲染，所以很容易和其他应用做整合
      3. vue采用的数据劫持+发布订阅者实现的响应式系统，采用mixin封装公共代码
      4. react是用来构建用户界面的Js库，主张函数式编程，推崇纯组件，数据不可变，单向数据流
      5. vue保留了html,css,js分离的写法，react推崇jsx写法，将html,css都写进js里面，all in js
      6. vue通过watcher能够确定组件是否需要更新，react是只要数据发生改变，就会重新渲染组件，可以通过shouldComponentUpdate钩子函数进行浅层比较，结合immutable数据流
      7. React
    2. 性能指标LCP，FID（first input Delay）,CLS(cumulative layout shift)
    3. 你知道vue router吗
      1. hash 和history路由模式的几个特性，再简单讲讲怎么在 install 方法中获取 Vue 实例上的 router 属性，怎么触发更新
      2. hash模式是基于锚点和onhashchange事件决定的
      3. history是基于h5提供的pushState和replaseState和popState实现的，但是如果刷新过程中，还是会向后端发送请求，这个时候需要服务器端配合返回Index页面
      4. vue router是在Install方法期间，给vue mixin了一个beforeCreate钩子函数，然后挂载上$router和$route，同时对currentRute进行监听，如果当前路由对象发生改变，就通知组件更新

    https://juejin.cn/post/6981673766178783262#heading-3 (浏览器优化)
    https://juejin.cn/post/6844904048961781774#heading-7 （查看内存泄漏）