前端性能的优化做过哪些?
一、页面级优化
1.减少HTTP请求数
2.将外部脚本置底(将脚本内容在页面信息内容加载后再加载)
3.异步执行inline脚本(其实原理和上面是一样,保证脚本在页面内容后面加载。)
4.LazyLoadJavascript(只有在需要加载的时候加载,在一般情况下并不加载信息内容。)
5.将CSS放在HEAD中
6.异步请求Callback(就是将一些行为样式提取出来,慢慢加载信息的内容)
7.减少不必要的HTTP跳转
8.避免重复的资源请求
二、代码级优化
Javascript
(1).DOM:DOM操作应该是脚本中最耗性能的一类操作,例如增加、修改、删除DOM元素或者对DOM集合进行操作。
(2).慎用with
(3).避免使用eval和Function
(4).减少作用域链查找(这方面到一些内容的相关问题)
(5).数据访问
(6).字符串拼接
浏览器兼容性的问题有哪些?
IE6不支持png-24透明图片
解决方法:图片使用gif格式,或者png-8格式图片。
像素问题:
解决方法:对另一个div也使用float;
浏览器默认的margin和padding不同
解决方案是加一个全局的*{margin:0;padding:0;}来统一。
IE5-IE8不支持opacity
解决方法:这时可以另外添加ie滤镜alpha
IE6不能定义1px左右宽度的容器
解决方法:因为行高line-height在IE6下有默认值,设置line-height:1px
overflow:hidden
zoom:0.08
IE6不支持min-*:问题出现的浏览器:IE6及其更低的版本
解决方法:利用IE6不识别!Important,给元素设置固定高度,并且设置元素高度自动。
双外边距浮动问题:IE6及其更低的版本
解决办法:将元素的display属性设置为inline,因为元素是浮动的,所以这么设置
Firefox点击链接出现的虚线框:Firfox浏览器
解决方法:我们为了和其他浏览器保持一致,需要去掉虚线框,我们可以给a标签设置outline属性
Cookie、session和localStorage的区别
答:cookie的内容主要包括:名字、值、过期时间、路径和域。路径与域一起构成cookie的作用范围。若不设置时间,则表示这个cookie的生命期为浏览器会话期间,关闭浏览器窗口,cookie就会消失。这种生命期为浏览器会话期的cookie被称为会话cookie。
会话cookie一般不存储在硬盘而是保存在内存里,当然这个行为并不是规范规定的。若设置了过期时间,浏览器就会把cookie保存到硬盘上,关闭后再打开浏览器这些cookie仍然有效直到超过设定的过期时间。对于保存在内存里的cookie,不同的浏览器有不同的处理方式session机制。
当程序需要为某个客户端的请求创建一个session时,服务器首先检查这个客户端的请求里是否已包含了一个session标识(称为sessionid),如果已包含则说明以前已经为此客户端创建过session,服务器就按照sessionid把这个session检索出来使用(检索不到,会新建一个),如果客户端请求不包含sessionid,则为客户端创建一个session并且生成一个与此session相关联的sessionid,sessionid的值应该是一个既不会重复,又不容易被找到规律以仿造的字符串,这个sessionid将被在本次响应中返回给客户端保存。保存这个sessionid的方式可以采用cookie,这样在交互过程中浏览器可以自动按照规则把这个标识发送给服务器。