前端综合试题（一）

谈谈对html5的了解

1.良好的移动性，以移动设备为主。

2.响应式设计，以适应自动变化的屏幕尺寸

3.支持离线缓存技术，webStorage本地缓存

4.新增canvas，video，audio等新标签元素。新增特殊内容元素：article，footer，header，nav，section等，新增表单控件：calendar，date，time，email，url，search。

5.地理定位...

6.新增webSocket/webWork技术

百度移动端首页秒开是如何作到的？

从几个方面优化：

(1)   静态文件放置

(2)   缓存

(3)   外链

(4)   缓存DOM

(5)   使用 iconfont

(6)   卡片的异步加载与缓存

(7)   不在首屏的就要异步化

(8)   少许静态文件的域名

详细参见：http://www.javashuo.com/article/p-wrkmdljz-gd.html

 前端速度统计（性能统计）如何作？

回答下面的两个问题：

(1)   网站都有哪些指标？

(2)   如何统计本身网站的这些指标？

详细参见：https://segmentfault.eom/a/1190000005869953

说出三种减小页面加载的方法（加载时间指感知的时间或实际加载的时间）

CSS Sprites；

JS、CSS源码压缩、图片大小控制合适；

网页Gzip；

CDN托管；

data缓存 ；

图片服务器；

项目中有没有用过加密，哪一种加密算法？

项目中没有用过，但我了解几个加密算法：

(1)   RSA加密

(2)   MD5加密

(3)   SHA256加密

(4)   SHA1（微信公众号配置wx.config）

 Ajax同步和异步的区别，如何解决跨域问题

同步的概念应该是来自于OS中关于同步的概念:不一样进程为协同完成某项工做而在前后次序上调整(经过阻塞,唤醒等方式).同步强调的是顺序性.谁先谁后.异步则不存在这种顺序性.

同步：浏览器访问服务器请求，用户看获得页面刷新，从新发请求,等请求完，页面刷新，新内容出现，用户看到新内容,进行下一步操做。

异步：浏览器访问服务器请求，用户正常操做，浏览器后端进行请求。等请求完，页面不刷新，新内容也会出现，用户看到新内容。

jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面，socke,cros

 列举几种后端通信的方法及其使用的场景，关于跨域的理解。

1.后端程序能够经过session来进行通信，session有过时时间，主要用于验证码的验证，登陆过时等的应用。

2.数据库，数据库支持多种语言的操做，那么经过数据库就能够通信。

关于跨域：

跨域请求存在的缘由：因为浏览器的同源策略，即属于不一样域的页面之间不能相互访问各自的页面内容。

跨域的场景：    

1.域名不一样 www.yangwei.com 和www.wuyu.com 即为不一样的域名）

2.二级域名相同，子域名不一样（www.wuhan.yangwei.com www.shenzheng.yangwei.com 为子域不一样）

3.端口不一样，协议不一样  （ http://www.yangwei.com 和https://www.yangwei.com属于跨域www.yangwei.con:8888和www.yangwei.con:8080)

跨域的方式：（内容较多，需掌握CORS和jsonp，其余内容也要了解）

1.前端的方式: possMessage，window.name,document.domain,image.src(得不到数据返回)，jsonP(script.src后台不配合得不到数据返回)，style.href（得不到数据返回)

一.image.src,script.src,style.href 不受同源策略的影响能够加载其余域的资源，能够用这个特性，向服务器发送数据。最经常使用的就是使用image.src 向服务器发送前端的错误信息。image.src 和style.href 是没法获取服务器的数据返回的，script.src 服务器端配合能够获得数据返回。

2、possMessage,window.name,document.domain 是两个窗口直接相互传递数据。

（1）possMessage 是HTML5中新增的，使用限制是 必须得到窗口的window 引用。IE8+支持，firefox，chrome,safair,opera支持

 （2）window.name ，在一个页面中打开另外一个页面时，window.name 是共享的，因此能够经过window.name 来传递数据，window.name的限制大小是2M，这个全部浏览器都支持,且没有什么限制。

3） document.domain 将两个页面的document.domain 设置成相同，document.domain 只能设置成父级域名，既能够访问，使用限制：这顶级域名必须相同

2.纯后端方式: CORS，服务器代理

CORS 是w3c标准的方式，经过在web服务器端设置：响应头Access一Cntrol一Alow一Origin 来指定哪些域能够访问本域的数据，ie8&9(XDomainRequest),10+,chrom4 ，firefox3.5,safair4，opera12支持这种方式。

服务器代理，同源策略只存在浏览器端，经过服务器转发请求能够达到跨域请求的目的，劣势：增长服务器的负担，且访问速度慢。

3.先后端结合:JsonP

script.src 不受同源策略的限制，因此能够动态的建立script标签，将要请求数据的域写在src 中参数中附带回调的方法，服务器端返回回调函数的字符串，并带参数。

如 script.src="http://www.yangwei.com/?id=001&callback=getInfoCallback",服务器端返回 getInfoCallBack("name:yangwei;age:18") 这段代码会直接执行，在前面定义好getInfoCallBack函数，既能够得到数据并解析。 这种是最多见的方式。

4.webSocket（了解性拓展）

服务端推送websocket和sse场景及应用

应用场景

均可以进行服务端推送,而且都是使用长链接来进行.但二者的实现又有一点不一样,sse仍使用http协议,而且使用相同的连接发送正常的http协议报文.而websocket是使用http协议进行握手,而后再使用同一个连接进行websocket协议的通讯.

websocket能够进行双向的通讯,即服务端能够往客户端发信息,客户端也能够向服务端发信息.而sse是单向的,只能由服务端往客户端发.

websocket自带链接的保持,即经过ping/pong协议保证链接能够始终维持,sse没有这个保证,不过能够参考ping/pong协议,本身周期性地发送信息来一样地进行处理.好比,5秒往客户端发一个特别的信息(经过type/name进行区分).其次,由于是基于浏览器的使用,sse有一个特性,就是浏览器发现一个链接断掉了,就会自动地进行重联,即从新发送请求.这样,服务端也不用担忧链接被断开,不过须要处理新的请求必须和上一次请求的内容相连续,以及新的推送注册.

由于都是使用http协议进行起始处理,所以在签权上均可以使用到http协议自己的一些东西,好比header/cookie签权.在相应的握手阶段,经过读取cookie(session)来保证相应的请求必须是通过受权的,也能够用于定位使用人.甚至能够经过这些信息保证单个用户只能有一个请求,避免重复请求

因为都是基于浏览器使用,所以建议的数据传输都是文本型.虽然websocket支持二进制frame传输,不过一些都不建议使用.sse只能传输文本

无论是websocket仍是sse,在用于通讯时,都建议只用于进行数据的推送,而不是进行完整的应用处理.这里能够理解为,常规的业务处理仍然交给后端的服务来处理.这样,便可以使用以前的业务开发的优点,又可使用推送的优点.而不是走向另外一个级端,即全部的信息都想经过推送来传递.

开发方式

websocket开发首选netty,由于netty对协议的封装已经作到了彻底的支持.经过 HttpServerCodec做为握手协议,WebSocketServerProtocolHandler做为协议处理,而后再加一个本身的handler,就完成了相应的业务处理.同时在性能上,netty在一个ws的请求创建起来以后,会自动地去除httpServerCodec相关的handler,这样保证后续的处理都是按照ws的协议来进行.

sse开发首选jersey,jersey一media一sse提供了相应的sse支持,而且经过与rest相集成,开发一个sse就跟普通的业务开发相同.

ws和sse在文本支持上都只支持utf一8编码,所以在处理上须要注册编码方式.同时在使用sse时,若是后端第一次进行响应时,相应的编码不对.chrome会直接报错,包括utf8都会报错(这是以前后端开发的一个问题),能够修正或者增长相应的拦截器,保证后端content一type响应中的charset=UTF一8.

ws和sse均可以经过nginx进行代理转发.ws的处理只须要设置http版本,以及从新转发前端的Upgrade和Connection头便可.而sse,也能够经过禁用buffer来处理.参考 http://stackoverflow.com/questions/27898622/server一sent一events一stopped一work一after一enabling一ssl一on一proxy

特定实现

为保证在开发时推送类的和业务类的系统不会耦合在一块儿,或者同一个应用内有两种处理模式的功能存在.建议直接在系统层就开发2个不一样的系统,一个专门用于推送,另外一个用于相应的业务处理.而后业务处理后的数据,须要再交由推送处理,则能够在后端进行经过消息系统进行中转,如kafka(持久保证)或redis(内存订阅)等

由于两者在ie上的支持都颇有限,所以不建议在ie上进行尝试

使用sse仍是websocket,取决因而否须要前台交互,还取决于对后端的支持技术的了解程序.好比,了解jersey多一点,仍是netty多一点.因为最近netty进行微服务化底层通讯支持愈来愈流行,我的更倾向于使用websocket.但若是仅仅是一个简单的推送功能,又不但愿修改代码,那也可使用jersey(毕竟以前的系统就是在上面进行开发的)

须要后端有的时候须要进行定向发送或者是群发,这种需求ws和sse的实现中都有相应的处理.如ChannelGroup和SseBroadcaster,这样在后端获取到一个消息,须要进行路由时就能够从这里面拿相应的channel信息.不过,前提是对各个channel上进行了特定的消息绑定,这样就好区分具体的路由信息.具体路由策略能够在创建时绑定session,后续经过session来路由.

 设计一个幻灯应用，须要列举选择的基础框架、项目的基础框架和代码管理、幻灯数据的存储和读取，部分特效的实现，能够只写思路，后续面聊。

本题无标准答案，同窗们能够本身研究考虑一下，。

 Html5中本地存储概念是什么，有什么优势，与cookie有什么区别？

html5中的Web Storage包括了两种存储方式：sessionStorage和localStorage。

sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问而且当会话结束后数据也随之销毁。所以sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。而localStorage用于持久化的本地存储，除非主动删除数据，不然数据是永远不会过时的；

cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（一般通过加密）。

区别：

一、 cookie数据始终在同源的http请求中携带（即便不须要），即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。cookie数据还有路径（path）的概念，能够限制cookie只属于某个路径下。

二、存储大小限制也不一样，cookie数据不能超过4k，同时由于每次http请求都会携带cookie，因此cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，能够达到5M或更大。

三、 数据有效期不一样，sessionStorage：仅在当前浏览器窗口关闭前有效，天然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，所以用做持久数据；cookie只在设置的cookie过时时间以前一直有效，即便窗口或浏览器关闭。

做用域不一样，sessionStorage不在不一样的浏览器窗口中共享，即便是同一个页面；localStorage 在全部同源窗口中都是共享的；cookie也是在全部同源窗口中都是共享的。

 说说你对做用域链的理解

做用域链的做用是保证执行环境里有权访问的变量和函数是有序的，做用域链的变量只能向上访问，变量访问到window对象即被终止，做用域链向下访问变量是不被容许的。

见好文：http://weizhifeng.net/javascript-the-core.html

 对新技术有那些了解，常去的网站有那些

node.js、angular.js、vue.js，reactjs，react-native，微信小程序

掘金、简书、github、csdn，知乎等

 用程序找出数组中出现次数超过一半的数字

思路：

    一、 一个数字在数组中出现次数超过了一半，则排序后，位于数组中间的数字必定就是该出现次数超过了长度一半的数字（能够用反证法证实），也便是说，这个数字就是统计学上的中位数。最容易想到的办法是用快速排序对数组排序号后，直接取出中间的那个数字，这样的时间复杂度为O(nlogn)，空间复杂度为O(1)。

    2 、事实上能够不用对数组进行排序，或者说仅部分排序，受快速排序的partition函数的启发，咱们能够利用反复调用partition函数来求的该数字。咱们如今数组中随机选取一个数字，然后经过Partition函数返回该数字在数组中的索引index，若是index恰好等于n/2，则这个数字即是数组的中位数，也便是要求的数，若是index大于n/2，则中位数确定在index的左边，在左边继续寻找便可，反之在右边寻找。这样能够只在index的一边寻找，而不用两边都排序，减小了一半排序时间。这种状况的平均时间复杂度大体为：T(n) = n+n/2+n/4+n/8+....+1，很明显当n很大时，T(n)趋近于2n，也就是说平均状况下时间复杂度为O(n),可是这种状况下，最坏的时间复杂度依然为O(n*n)，最坏状况下，index老是位于数组的最左或最右边，这样时间复杂度为T(n) = n+n一1+n一2+n一3+....+1 = n(n一1)/2，显然，时间复杂度为O(n*n)，空间复杂度为O(1)。

  常使用的库有哪些？经常使用的前端开发工具？开发过什么应用或组件？

1)bootstrap, easy UI, highcharts和echarts，  jqueryUI , jquery、angular.js,  vue.js, reactjs等。

2)前端开发工具：gulp  webpack

3)轮播插件，拖拽插件

  你作的页面在哪些浏览器测试过？这些浏览器的内核分别是什么？

IE内核浏览器：360，傲游，搜狗，世界之窗，腾讯TT。

非IE内核浏览器：firefox opera safari chrome 。

IE浏览器的内核Trident、Mozilla的Gecko、Chrome的Blink（WebKit的分支）、Opera内核原为Presto，现为Blink；

 对前端界面工程师这个职位是怎么理解的？它的前景怎样？

前端工程师属于一个比较新兴的技术，各类技术层出不穷，随着客户体验的重要性前端须要掌握的技能也愈来愈多，对前端的要求也愈来愈多，并且咱们前端是最贴近用户的程序员，主要负责实现界面交互，提高用户体验，并且有了Node.js，前端能够实现服务端的一些事情，针对服务器的优化、拥抱最新前端技术，除了掌握必要的技能还要掌握用户的心理，善于沟通。

前景：前景无疑是值得确定的，也须要咱们时刻关注最新的技术，这会是一个时刻都在学习的道路

 对WEB标准以及w3c的理解与认识？

Web标准就是将页面的结构、表现和行为各自独立实现，w3c对标注提出了规范化的要求

1.对结构的要求：（标签规范能够提升搜索引擎对页面的抓取效率，对SEO颇有帮助）

1）标签字母要小写；

2）标签要闭合；

3）标签不容许随意嵌套。

2.对css和js的要求：

1）尽可能使用外联css样式表和js脚本，使结构、表现和行为分红三块，符合规范，同时提升页面渲染速度，提升用户体验；

2）样式尽可能少用行间样式表，使结构与表现分离，标签的id和class命名要作到见文知义，标签越少，加载越快，用户体验更高，代码维护更简单，便于改版；

3）不须要变更页面内容，即可提供打印版本而不须要复制内容，提升网站易用性

为何利用多个域名来提供网站资源会更有效？

1)     突破浏览器的并发限制（浏览器同一域名最大的并发请求数量为6个，ie6为2个）

2)     节约cookie带宽 (默认状况下，主域名请求静态资源一样会携带cookie，但跨域请求则不会携带，必定程度上节约了cookie带宽）

3)     CDN缓存更方便

4)     防止没必要要的安全问题（尤为是cookie的隔离尤其重要）

5)     节约主机域名链接数，优化页面响应速度

 身为觉得web前端工程师，你确定知道如今最流行的前端技术吧，有那些？

Vuejs2.0/Angular2.0/React Native /es6//Nodejs

http2

gulp/webpack

 请简述为何要使用数据库的事务

数据库事务(Database Transaction) ，是指做为单个逻辑工做单元执行的一系列操做，要么彻底地执行，要么彻底地不执行。

原子性（Atomic）（Atomicity)
　　事务必须是原子工做单元；对于其数据修改，要么全都执行，要么全都不执行。一般，与某个事务关联的操做具备共同的目标，而且是相互依赖的。若是系统只执行这些操做的一个子集，则可能会破坏事务的整体目标。原子性消除了系统处理操做子集的可能性。
　　一致性（Consistent）(Consistency)
　　事务在完成时，必须使全部的数据都保持一致状态。在相关数据库中，全部规则都必须应用于事务的修改，以保持全部数据的完整性。事务结束时，全部的内部数据结构（如 B 树索引或双向链表）都必须是正确的。某些维护一致性的责任由应用程序开发人员承担，他们必须确保应用程序已强制全部已知的完整性约束。例如，当开发用于转账的应用程序时，应避免在转账过程当中任意移动小数点。
　　隔离性（Insulation）(Isolation)
　　由并发事务所做的修改必须与任何其它并发事务所做的修改隔离。事务查看数据时数据所处的状态，要么是另外一并发事务修改它以前的状态，要么是另外一事务修改它以后的状态，事务不会查看中间状态的数据。这称为隔离性，由于它可以从新装载起始数据，而且重播一系列事务，以使数据结束时的状态与原始事务执行的状态相同。当事务可序列化时将得到最高的隔离级别。在此级别上，从一组可并行执行的事务得到的结果与经过连续运行每一个事务所得到的结果相同。因为高度隔离会限制可并行执行的事务数，因此一些应用程序下降隔离级别以换取更大的吞吐量。
　　持久性（Duration）(Durability）
　　事务完成以后，它对于系统的影响是永久性的。该修改即便出现致命的系统故障也将一直保持。

 聊一聊前端存储。

老朋友cookie

短暂的 sessionStorage

简易强大的localStorage

websql与indexeddb

详细参见：https://segmentfault.com/aZ1190000005927232

 CSS，JS代码压缩，以及代码CDN托管，图片整合

CSSJS代码压缩：

能够应用gulp的gulp一uglify, gulp一minify一css模块完成；能够应用webpack的 UglifyJsPlugin 压缩插件完成。

CDN:

内容分发网络(CDN)是一个经策略性部署的总体系统，包括分布式存储、负载均衡、网络请 求的重定向和内容管理4个要件。主要特色有：本地Cache加速，镜像服务，远程加速，带 宽优化。关键技术有：内容发布，内容路由，内容交换，性能管理。CDN网站加速适合以 咨询为主的网站。CDN是对域名加速不是对网站服务器加速。CDN和镜像站比较不须要访 客手动选择要访问的镜像站。CDN使用后网站无需任何修改便可使用CDN得到加速效果。

若是经过CDN后看到的网页仍是旧网页，能够经过URL推送服务解决，新增的网页和图片 不须要URL推送。使用动态网页能够不缓存即时性要求很高的网页和图片。CDN能够经过 gi域SVN来管理。

图片整合

减小网站加载时间的最有效的方式之一就是减小网站的HTTP请求数。实现这一目标的一个 有效的方法就是经过CSS Sprites ——将多个图片整合到一个图片中，而后再用CSS来定 位。缺点是可维护性差。可使用百度的fis/webpack来自动化管理sprite。

如何利用webpack把代码上传服务器以及转码测试?

代码上传：

可使用sftp一webpack一plugin,可是会把子文件夹给提取出来，不优雅。可使用gulp +webpack来实现。

转码测试

webpack应用babel来对ES6转码，开启devtool: “source一map"来进行浏览器测试。应用 karma或mocha来作单元测试。

 项目上线流程是怎样的？

流程建议

模拟线上的开发环境

本地反向代理线上真实环境开发便可。（apache, nginx, nodejs都可实现）

模拟线上的测试环境

模拟线上的测试环境，实际上是须要一台有真实数据的测试机，建议没条件搭daily的，就直接 用线上数据测好了，只不过程序部分走大家的测试环境而已，有条件搭daily最好。

可连调的测试环境

可连调的测试环境，分为2种。一种是开发测试都在一个局域网段，直接绑hosts便可，不在 一个网段，就每人分配一台虚拟的测试机，放在你们均可以访问到的公司内网，代码直接往 上布便可。

自动化的上线系统

自动化的上线系统，能够采用Jenkins。若是没有，能够自行搭建一个简易的上线系统，原 理是每次上线时都抽取最新的trunk或master，作一个tag，再打一个时间戳的标记，而后分 发到cdn就好了。界面里就2个功能，打tag,回滚到某tag,部署。

适合先后端的开发流程

开发流程依据公司所用到的工具，构建，框架。原则就是分散独立开发，互相不干扰，连调 时有hosts可绑便可。

简单的可操做流程

代码经过git管理，新需求建立新分支，分支开发，主干发布 一上线走简易上线系统，参见上一节

经过gulp+webpack连到发布系统，一键集成，本地只关心原码开发

本地环境经过webpack反向代理的server

搭建基于linux的本地测试机，自动完成build+push功能

 工程化怎么管理的？

前端工程化能够自动化处理一些繁复的工做，提升开发效率，减小低级错误。

目前前端构建工具不少，综合比较来看，gulp相对来讲更灵活，能够作更多的定制化任务，而webpack在模块化方面更完美一些

   gulp打造前端工程化方案，同时引入webpack来管理模块化代码，大体分工以下：

gulp：处理html压缩/预处理/条件编译，图片压缩，精灵图自动合并等任务

webpack：管理模块化，构建js/css。

       具体流程可参考： http://blog.csdn.net/java_goodstudy/article/details/52797322

  webpack 和 gulp 对比

Gulp就是为了规范前端开发流程，实现先后端分离、模块化开发、版本控制、文件合并与 压缩、mock数据等功能的一个前端自动化构建工具。说的形象点，“Gulp就像是一个产品的 流水线，整个产品从无到有，都要受流水线的控制，在流水线上咱们能够对产品进行管 理。”另外，Gulp是经过task对整个开发过程进行构建。

Webpack是当下最热门的前端资源模块化管理和打包工具。它能够将许多松散的模块按照 依赖和规则打包成符合生产环境部署的前端资源。还能够将按需加载的模块进行代码分隔， 等到实际须要的时候再异步加载。经过loader的转换，任何形式的资源均可以视做模块，比 如 CommonJs 模块、AMD 模块、ES6 模块、CSS、图片、JSON、Coffeescript、LESS等。

Gulp和Webpack功能实现对比：从基本概念、启动本地Server、sass/less预编译、模块化 开发、文件合并与压缩、mock数据、版本控制、组件控制八个方面对Gulp和Webpack进行对比。

详细参见：http://www.tuicool.com/articles/e632EbA

 webpack打包文件太大怎么办？

webpack把咱们全部的文件都打包成一个JS文件，这样即便你是小项目，打包后的文件也 会很是大。能够从去除没必要要的插件，提取第三方库，代码压缩，代码分割，设置缓存几个 方面着手优化。

详细参见：http://www.jianshu.com/p/a64735eb0e2b

 谈谈你对webpack的见解

WebPack 是一个模块打包工具，你可使用WebPack管理你的模块依赖，并编绎输出模块们所需的静态文件。它可以很好地管理、打包Web开发中所用到的HTML、JavaScript、CSS以及各类静态文件（图片、字体等），让开发过程更加高效。对于不一样类型的资源，webpack有对应的模块加载器。webpack模块打包器会分析模块间的依赖关系，最后 生成了优化且合并后的静态资源。

webpack的两大特点：

1.code splitting（能够自动完成）

2.loader 能够处理各类类型的静态文件，而且支持串联操做

webpack 是以commonJS的形式来书写脚本滴，但对 AMD/CMD 的支持也很全面，方便旧项目进行代码迁移。

webpack具备requireJs和browserify的功能，但仍有不少本身的新特性：

1. 对 CommonJS 、 AMD 、ES6的语法作了兼容

2. 对js、css、图片等资源文件都支持打包

3. 串联式模块加载器以及插件机制，让其具备更好的灵活性和扩展性，例如提供对CoffeeScript、ES6的支持

4. 有独立的配置文件webpack.config.js

5. 能够将代码切割成不一样的chunk，实现按需加载，下降了初始化时间

6. 支持 SourceUrls 和 SourceMaps，易于调试

7. 具备强大的Plugin接口，大可能是内部插件，使用起来比较灵活

8.webpack 使用异步 IO 并具备多级缓存。这使得 webpack 很快且在增量编译上更加快

 说说你对AMD和Commonjs的理解

CommonJS是服务器端模块的规范，Node.js采用了这个规范。CommonJS规范加载模块是同步的，也就是说，只有加载完成，才能执行后面的操做。AMD规范则是非同步加载模块，容许指定回调函数。

AMD推荐的风格经过返回一个对象作为模块对象，CommonJS的风格经过对module.exports或exports的属性赋值来达到暴露模块对象的目的。

 不想让别人盗用你的图片，访问你的服务器资源该怎么处理？

目前经常使用的防盗链方法主要有两种：

(1)   设置Referer:适合不想写代码的用户，也适合喜欢开发的用户（Referer是HTTP协议中的请求头，在跨页面访问的时候会带上。须要看看浏览器请求的Referer是http://仍是https://，通常是http://）

(2)   签名URL:适合喜欢开发的用户

详细参见：https://yq.aliyun.com/articles/57931

 精灵图和base64如何选择？

css精灵，用于一些小的图标不是特别多，一个的体积也稍大，好比大于10K (这个没有严 格的界定）。

base64,用于小图标体积较小（相对于css精灵），多少都无所谓。字体图标，用于一些别 人作好的图标库（也有少数本身去作的）用起来比较方便，他的图标只能用于单色，图标用 只能于一种颜色。

webpack怎么引入第三方的库？

拿jQuery为例：

entry: {

page: 'path/to/page.js',

jquery: 'node—modules/jquery/dist/jquery.min.js'

}

new HtmlWebpaekPlugin({

 filename: 'index.html',

 template: 'index.html',

 inject: true,

chunks: ['jquery','page'] // 按照前后顺序插入 script 标签

})

  用过Nginx吗？都用过哪些？

nginx是一个高性能的HTTP和反向代理服务器。

常使用场景：

(1)   反向代理

(2)   网站负载均衡

详细参见：http://www.cnblogs.com/hobinly/p/6023883.html

性能和效率

 你平时如何评测你写的前端代码的性能和效率。

Chrome DevTools的Timeline:是用来排查应用性能瓶颈的最佳工具。

Chrome DevTools的Audits:对页面性能进行检测，根据测试的结果进行优化。

第三方工具Yslow。

详细参见：

http://www.cnblogs.com/一simon/p/5883336.html

http://blog.csdn.net/ivan0609/artide/details/45508365

http://www.wtoutiao.com/p/1305TZW.html

 如何优化页面，加快页面的加载速度(至少5条)

(1)   优化图片资源的格式和大小

(2)   开启网络压缩

(3)   使用浏览器缓存

(4)   减小重定向请求

(5)   使用CDN存储静态资源

(6)   减小DNS查询次数

(7)   压缩css和js内容

详细参见：http://www.mahaixiang.cn/wyzz/1589.html

 怎么保证多人开发进行内存泄漏的检查（内存分析 工具）

1)     使用xcode里面的Analyze进行静态分析

build setting ----》 automa ----》 mrc环境

product ----》 analyze ----》command + R

2)     为避免没必要要的麻烦，多人开发的时候尽可能使用 ARC

内存泄露：

参考：http://blog.csdn.net/panda_bear/article/details/8009421

 先后端性能如何调优？

1.     减小http请求数

2.     使用内容分布式网络

3.   给头部添加一个失效期或者Cache一Control

4.     Gzip压缩组件

5.     把样式表放在前面

6.     把脚本放在最后

7.     不使用CSS表达式

8.     使用外部的JavaScript和CSS

9.     减小DNS的查询

10. 缩小JavaScript和CSS

参考：http://blog.csdn.net/sonta/article/details/44454787

 浏览器http请求过多怎么解决？

(1)   合并JS、CSS文件

(2)   合并图片css sprite

(3)   使用 Image maps

(4)   data嵌入图片：如base64

(5)   使用CDN，减小http请求头