当前位置: 首页 > Web前端 > HTML

前端性能优化总结

时间:2023-04-02 13:41:59 HTML

减少DNS查找次数:合并文件和使用csssprites,因为第一次访问网站时,大部分响应时间用于下载各种内容减少DNS查找次数查找:减少主机名的数量可以减少DNS查找的数量。url地址(获取地址的IP)->本地DNS缓存(找到则返回IP地址,并停止下一步)->DNS服务器(返回IP地址)。在此过程中,浏览器将不执行任何操作,直到DNS查找完成。可缓存AJAX:对于不改变请求的内容,可以缓存在本地延迟加载内容:页面渲染时必须先加载哪些内容?以后可以加载什么内容和结构?预加载:类似于延迟加载,当浏览器空闲时,缓存后续页面可能使用的资源减少DOM元素的数量:提高JavaScript遍历DOM的效率根据域名划分页面内容:将HTML内容和动态一个域名上的内容,将各种页面组件(图片、脚本、CSS)存储在另一个域名上减少iframe的使用使用CDN内容分发网络设置缓存:文件头指定Expires或Cache-ControlGzip压缩文件内容:image和PDF文件已经压缩了,那么gzip压缩效果不明显将样式表放在顶部:在文档中加载你的样式表避免使用CSS表达式:使用CSS表达式,记住它们是计算数千次并且它可能会对你的页面性能产生影响使用外部JavaScript和CSS:因为外部JavaScript和CSS文件可以在浏览器中缓存最小的JavaScript和CSS:去除无用代码,压缩,混淆使用insteadof@import:两者的区别,可以上网查看。将脚本放在页面底部以减少DOM访问。使用事件代理来处理相同的事件以减少cookie的大小。