前端性能优化--合理使用CSS Sprites和内联图片

在开发前端的过程中，作为一个前端工程师，可能不仅仅是做出一个页面，而丝毫不考虑页面的访问速度也是不现实的，我在做过一些页面之后，发现有时候性能确实不太理想，以至于自己都看不过去，接下来，我会从我的理解，从一些基本的方面来对前端页面进行优化，今天先介绍一下图片给网页带来的页面缓慢解决方法：

0、普通图片加载：用时101ms

1、CCS Sprites的使用：用时40ms

2、使用内联图片：用时45ms

其实我做过多次测试，按照传统加载方式加载大概100ms左右，后面两个差不多都在40ms左右，所以在编码中采用雪碧图和内联图片相对来说可以提高网页的加载效率。

但是这里要提醒大家注意的一点是，在采用内联图片的时候，最好采用引用外部css的方式，这样效率会有很大的提高。

这里提供一个将：image 转 DataUrI的网址：http://tool.c7sky.com/datauri/

希望对大家有所帮助，也希望大家提出自己的宝贵意见。