前端一些优化

146 阅读1分钟

网络传输层:

1.压缩CSS js 代码

2.使用精灵图、字体图标、base64优化来减少HTTP请求

3.打包时候采用cdn缓存

4.将js和css作为外部文件引用,js和css能在浏览器中产生缓存,提高页面加载速度,css用link能同步加载 @import等全部加载完毕

5.懒加载:把img图片换为比例相等的占位图片,当图片出现在 用户视野,才设置图片真正的路径,把路径存在元素的data-original属性中,页面加载完成后,根据 scrollTop判断图片是否在用户视野,如果在将data-original属性中的值取出 放到src中, 页面加载速度快、可以减轻服务器的压力、节约了流量,用户体验好

代码层:

1.尽量不使用闭包 2.用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能 3.避免在页面的主体布局中使用table,table要等其中的内容完全下载之后才会显示出来,显示比div+css布局慢 4.设置公共地址axios