1.1、讲讲输入完网址按下回车，到看到网页这个过程中发生了什么
a. 域名解析
b. 发起TCP的3次握手
c. 建立TCP连接后发起http请求
d. 服务器端响应http请求，浏览器得到html代码
e. 浏览器解析html代码，并请求html代码中的资源
f. 浏览器对页面进行渲染呈现给用户
参考《输入URL到展现页面的全过程》
1.2、谈谈你对前端性能优化的理解
a. 请求优化：
合并JS和CSS，减少DNS查找次数，避免重定向，使用GET完成AJAX请求，减小请求中的Cookie，缓存资源，使用CDN，开启GZip，压缩HTML页面，开启长连接，避免行内脚本阻塞并行下载，少用iframe（阻塞onload事件，影响并行下载）。
b. CSS优化：
样式表置于页面顶部，避免使用CSS表达式，使用外部JS和CSS，压缩JS和CSS，避免滤镜。
c. JavaScript优化：
脚本置于页面底部，减少DOM访问，减少重绘和重排，尽量使用局部变量，使用定时器分割大型任务，用合适的正则操作字符串，惰性模式减少分支，事件委托，第三方代码异步加载，节流与去抖动，使用localStorage替代cookie。
d. 图片优化：
内联图使用Data:URL，压缩图片或使用WebP格式，固定图片尺寸，图片预加载，图片延迟加载，使用字体矢量图标，Sprites图片。
1.3、请说出三种减少页面加载时间的方法
a. 尽量减少页面中重复的HTTP请求数量
b. 服务器开启gzip压缩
c. css样式的定义放置在文件头部
d. Javascript脚本放在文件末尾
e. 压缩合并Javascript、CSS代码
f. 使用多域名负载网页内的多个文件、图片
1.4、请介绍下cache-control
每个资源都可以通过 Cache-Control HTTP 头来定义自己的缓存策略
Cache-Control 指令控制谁在什么条件下可以缓存响应以及可以缓存多久
Cache-Control 头在 HTTP/1.1 规范中定义，取代了之前用来定义响应缓存策略的头（例如 Expires）。
1.5、一次js请求一般情况下有哪些地方会有缓存处理？
a. 浏览器端存储
b. 浏览器端文件缓存
c. HTTP缓存304
d. 服务器端文件类型缓存
e. 表现层&DOM缓存
1.6、一个页面上有大量的图片（大型电商网站），加载很慢，你有哪些方法优化这些图片的加载，给用户更好的体验。
a. 图片懒加载，滚动到相应位置才加载图片。
b. 图片预加载，如果为幻灯片、相册等，将当前展示图片的前一张和后一张优先下载。
c. 使用CSSsprite，SVGsprite，Iconfont、Base64等技术，如果图片为css图片的话。
d. 如果图片过大，可以使用特殊编码的图片，加载时会先加载一张压缩的特别厉害的缩略图，以提高用户体验。
1.7、谈谈以前端角度出发做好SEO需要考虑什么？
a. 了解搜索引擎如何抓取网页和如何索引网页
b. meta标签优化
c. 关键词分析
d. 付费给搜索引擎
e. 链接交换和链接广泛度（Link Popularity）
f. 合理的标签使用
1.8、HTTP2.0有哪些提升？
a. HTTP 2.0中的二进制分帧层突破了限制：客户端和服务器可以把HTTP消息分解为互不依赖的帧，然后乱序发送，最后再在另一端把它们重新组合起来。
b. 把HTTP消息分解为很多独立的帧之后，就可以通过优化这些帧的交错和传输顺序，进一步提升性能。
c. HTTP 2.0通过让所有数据流共用同一个连接，可以更有效地使用TCP连接。
d. 服务器除了对最初请求的响应外，服务器还可以额外向客户端推送资源，而无需客户端明确地请求。
e. HTTP 2.0会压缩首部元数据，针对之前的数据只编码发送差异数据。
1.9、TCP与UDP的区别
a. UDP 协议的头长度不到TCP头的一半，所以同样大小的包里UDP携带的净数据比TCP包多。
b. TCP会发响应，UDP不会。并且UDP没有Seq和Ack等概念，省去了建立连接的开销，DNS解析就使用UDP协议。TCP有3次握手4次挥手。
c. UDP不能分割报文段（MSS），超过MTU的时候，发送方的网络层负责分片，接收方收到分片后再组装起来，这个过程会消耗资源，降低性能。
d. UDP没有重传机制，丢包的时候就不能按需发送。TCP有超时重传、快速重传和SACK。
1.10、URI和URL
URI（Uniform Resource Identifier）：统一资源标识符。
URL（Uniform Resoure Locator）：统一资源定位符，通俗的说法是网址。
URI表示某一互联网资源，而URL表示资源地点，所以URL是URI的子集。
1.11、移动端click延迟300ms和事件穿透
解决300MS延迟
方案1：FastClick.js
方案2：用JQ的tap事件
解决事件穿透
方案1：点击消失元素，添加超过300MS的动画
方案2：动态地在触摸位置生成一个透明的元素，这样当上层元素消失而延迟的click来到时，它点击到的是那个透明的元素，也不会“穿透”到底下。在一定的timeout后再将生成的透明元素移除。
方案3：点击触发事件的时候pointer-events变成none,过400毫毛pointer-events变成auto
方案4：fastclick 取消 click 事件，用 touchend 模拟快速点击行为