浏览器的最大并发链接数通常在4到6之间,首先了解影响加载的性能因素:css
(1)下载的文件太大html
(2)发出的请求太多前端
(3)请求相应不及时后端
针对这些因素,通常会考虑减小请求次数:浏览器
(1)对静态文件设置缓存事件缓存
(2)页面设计尽可能简洁服务器
(3)合并文件(html,JS, css,图片..)网络
再细致一点:多线程
(1)页面实现按需加载(分时加载)并发
(2)页面提交,考虑异步执行
(3)页面加载考虑多种优化方案
通常将css在<head>标签加载,Js 在的<body>底部加载
优化方向:
请求数量 合并脚本和样式表 css sprites, 拆分初始化负载,划分主域
请求带宽 开启GZIP,精简JS code,移除重复脚本,图像优化
缓存利用 使用CDN,使用外部JS,CSS 添加Expire 头,减小DNS查找,配置ETag, 使AJAX可缓存
页面结构 样式顶部,js底部,避免页面加载阻塞,尽早刷新文档流输出
代码校验 避免CSS表达式,避免重定向
YUI Compress 压缩工具 -》 精简JS
服务器端安装GZIP自动压缩功能模块
CDN-》内容分发网络,可以实时地根据网络流量和各节点的链接,负载情况以及到用户的距离和相应时间等信息将用户请求导向到离用户最近的服务节点。
‘查找----替换’的思路,来实现主域的划分
总之,作前端开发必定要考虑浏览器兼容性和UI性能的设计,重要的是用户体验。