前端基础

1、什么是同源：

    协议相同，域名相同，端口相同。一般浏览器都会有同源策略限制，同源策略的目的是为了保证用户的信息安全，防止恶意网站窃取数据。

    如果是非同源，会受到什么限制：

    1、cookie、LocalStorage、sessionStorage、indexDB无法访问

    2、dom无法获得

    3、ajax请求无法发送

2、浏览器解析页面的过程 ，   html标签如何与css中样式联系起来

     浏览器内核会对页面进行检索，首先识别html，后识别css,根据深度优先的原则遍历html代码和css代码，并将识别过的标签挂到一棵树上，最终浏览器内核会根据节点的排列规则构建出一棵domtree，domtree生成后等待csstree的生成，csstree的生成是根据我们所写的css样式生成的一棵类似于domtree的csstree，csstree生成后会和domtree拼成一棵rendertree，rendertree生成之后浏览器的渲染引擎就会按照renderTree中的规则绘制页面。

3、常见的浏览器及其内核都有哪些？

    Google Chrome : webkit/blink

    Safari : webkit

    IE: trident

    Opera: presto（原先）  blink(现今)

    Firefox:  gecko

QQ浏览器  trident（电脑端） webkit(手机端)

搜狗浏览器:  双内核 webkit（极速模式，打开页面速度最快） trident(兼容模式) 可手动切换

360：双内核 webkit trident  (可手动切换)

内核分为js引擎和渲染引擎

       其中渲染引擎负责页面的布局和绘制，并将其显示在网页上面，而js引擎负责解释执行js代码，实现页面和用户的交互。最开始渲染引擎和js引擎并没有明确的区分，后来js引擎越来越独立，内核就倾向于只值渲染引擎。

比较出名的有chrome的V8，safari的Chakra引擎。

4.cookies、sessionStorage、localStorage的区别？

    cookies：是为了标识用户身份而存储在用户本地终端上的数据，该数据通常会经过加密，并在本地和服务器之间来回传递,每次请求新页面时cookie都会被发送，因此会浪费一定的带宽。

sessionStorage和localStorage都属于webstorage,不会自动将数据传给服务器 ，仅在本地保存，他们是为了更大容量的存储而设计的。

大小

cookie数据大小不能超过4k。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，
可以达到5M或更大。

有效时间

    localStorage    存储持久数据，浏览器关闭后数据不丢失除非主动删除数据；

    sessionStorage  数据在当前浏览器窗口关闭后自动删除。

    cookie设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭

5.如何实现浏览器内多个标签页之间的通信? (阿里)

调用localstorge、cookies等本地存储方式

6.为什么要用多个域名来存储网站资源

CDN缓存更方便 ，突破浏览器并发限制 
节约cookie带宽 ，节约主域名的连接数，优化页面响应速度 防止不必要的安全问题

7.一个页面上有大量的图片，你有哪些方法优化这些图片的加载，优化用户的体验

（1）图片懒加载，在页面的未可视区添加一个滚动事件，计算图片的位置与浏览器和页面顶部的距离，当图片的可视区加大，而未可视区逐渐减少时，优先加载该图片。

（2）图片预加载，如幻灯片，相册，轮播图，可使用图片预加载技术，将当前图片的上一张和下一张优先加载

（3）图片压缩，设置当图片大小一个上限值，当图片小于该上限值时可直接加载，当图片大于该上限值时，可以通过base64或者其它特殊的编码格式进行压缩再展示到页面中。

8.前端的一些性能优化方式

      1. 减少dom操作，dom操作是页面中最耗费性能的一类操作了，大部分的dom操作都会触发页面的重绘或重排。

      2.减少作用域链查找（这方面设计到一些内容的相关问题）
　　前文谈到了作用域链查找问题，这一点在循环中是尤其需要注意的问题。如果在循环中需要访问非本作用域下的变量时请在         遍历之前用局部变量缓存该变量，并在遍历结束后再重写那个变量，这一点对全局变量尤其重要，因为全局变量处于作用域         链的最顶端，访问时的查找次数是最多的     

    3.减少http请求

    4.使用cdn加速

    5.部署上线前，可以通过打包工具如webpack或者gulp对代码和其它资源进行资源合并与压缩，这样可节省不少的空间

    6.使用lazy load :对静态资源如图片等使用懒加载，预加载技术，对js代码进行按需加载

    7.合理设置http缓存

    8.将外部脚本（JavaScript）置于底部，因为js会阻塞页面的加载，js未加载完成，html和css将无法加载，因此，js应放在页面底部。

    9.将Css放在head中，如果将css放在页面的其它部位，比如body，那么浏览器可能还未加载到css就开始渲染页面了，那么页面的展示会先展示无css状态再转到有css的状态，这样用户体验就比较糟糕。而且，有些浏览器可能会在css资源下载完成后才开始渲染页面，如果css放在页面底部，那么会导致页面的渲染时间推迟.

  10减少闭包的使用，因为闭包的使用可能造成作用域链无法释放，会造成内存的泄露，如果不可避免要使用到闭包的话，就请将闭包放在立即执行函数当中。

   11. 使用ajax，ajax是高性能ajax的基础。