前端性能优化入门

来源：互联网发布：非负矩阵分解 matlab 编辑：程序博客网时间：2024/06/08 06:13

最近简单的了解了一下前端性能的优化，看了网上的许多文章，从无到有的知道了一些皮毛，知道了一些基础又简单易用的优化方式，记录在这里。

减少请求次数

1.使用CSS Sprite制作雪碧图：
当网页中有多张图片的时候，浏览器会发送多个请求给服务器，逐个得到。通过制作雪碧图，把多个图片整合成一张大图，然后再通过background-position来得到相应的小图，这样可以有效的减少请求次数。

2.合并、压缩外联CSS和JS文件
合并外联的css和js文件，同样也可以减少请求次数，在合并的同时对他们进行压缩，降低文件大小，也能优化速度。
这个在线工具能够合并和压缩HTML,CSS,JS。
另外还在一篇博客中看到了用windows中的简单的脚本来实现多个文件的合并。

注意：在合并压缩的时候，请注意文件顺序，比如一些需要jQuery的js文件，要放在jQuery后边，以免出现未定义的错误。

其注意事项：

1.尽可能将js放在</body>前边而不是<head>里边。
2.万不得已将js放在<head>中时，先引入css，再引入js，不要混编。
3.尽量不要使用width和height来改变图片大小，而是直接引入合适大小的图片。
4.常用的css或js写在同一个文件中，浏览器缓存下来之后，打开其他页面的时候就不用重复请求了。

0 0