共计 1555 个字符,预计需要花费 4 分钟才能阅读完成。
【问题形容】前端性能的优化做过哪些?
一、页面级优化
- 缩小 HTTP 申请数
- 将内部脚本置底(将脚本内容在页面信息内容加载后再加载)
- 异步执行 inline 脚本(其实原理和下面是一样,保障脚本在页面内容前面加载。)
- Lazy Load Javascript(只有在须要加载的时候加载,在个别状况下并不加载信息内容。)
- 将 CSS 放在 HEAD 中
- 异步申请 Callback(就是将一些前端培训行为款式提取进去,缓缓的加载信息的内容)
- 缩小不必要的 HTTP 跳转
- 防止反复的资源申请
二、代码级优化
【问题形容】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 标识(称为 session id),如果已蕴含则阐明以前曾经为此客户端创立过 session,服务器就依照 session id 把这个 session 检索进去应用(检索不到,会新建一个),如果客户端申请不蕴含 session id,则为客户端创立一个 session 并且生成一个与此 session 相关联的 session id,session id 的值应该是一个既不会反复,又不容易被找到法则以仿造的字符串,这个 session id 将被在本次响应中返回给客户端保留。保留这个 session id 的形式能够采纳 cookie,这样在交互过程中浏览器能够主动的依照规定把这个标识发送给服务器。
正文完