样本一
减少 http 请求次数:CSS Sprites, JS、CSS 源码压缩、图片大小控制合适;网页 Gzip,CDN 托管,data 缓存 ,图片服务器。
前端模板 JS+数据,减少由于 HTML 标签导致的带宽浪费,前端用变量保存 AJAX 请求结果,每次操作本地变量,不用请求,减少请求次数
用 innerHTML 代替 DOM 操作,减少 DOM 操作次数,优化 javascript 性能。
当需要设置的样式很多时设置 className 而不是直接操作 style。
少用全局变量、缓存 DOM 节点查找的结果。减少 IO 读取操作。
避免使用 CSS Expression(css 表达式)又称 Dynamic properties(动态属性)。
图片预加载,将样式表放在顶部,将脚本放在底部 加上时间戳。
避免在页面的主体布局中使用 table,table 要等其中的内容完全下载之后才会显示出来,显示比 div+css 布局慢。
样本二
减少 HTTP 请求
减少 DOM 操作
避免不必要的重绘与重排
优化 CSS 选择器(从右向左匹配)
CSS/JS minify,减少文件体积
开启 Gzip 压缩
将 CSS 放到顶部,JavaScript 放到尾部
压缩图片以及使用 CSS Sprite
使用 CDN 加速,适当进行文件缓存
合理控制 cookie 大小(每次请求都会包含 cookie)
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。