英文原文：http://www.mobify.com/blog/css-sprites-vs-data-uris-which-is-faster-on-mobile/

中文翻译：http://www.csdn.net/article/2013-09-25/2816925-CSS-Sprites-vs.-Data-URIs:-Which-is-Faster-on-Mobile

上文对dataURI 与 CSS Sprites的性能进行了详细的对比与阐述。

根据上文的测试结果，在移动端，需要强调如下结论：

  1. 仅对很小的资源采用dataURI
  2. 不要在CSS和HTML中过多的内联dataURI
  3. 移动端不要使用超过3-5次dataURI（同一个页面）

dataURI V.S. CSS Sprites 移动端的更多相关文章

  1. CSS Sprites+CSS3 Icon Font

    CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来, ...

  2. 使用CSS sprites减少HTTP请求

    sprites是鬼怪,小妖精,调皮鬼的意思,初听这个高端洋气的名字我被震慑住了,一步步掀开其面纱后发觉很简单的东西,作用却很大 神马是CSS 小妖精 CSS sprites是指把网页中很多小图片(很多 ...

  3. CSS sprites减少HTTP请求

    使用CSS sprites减少HTTP请求   sprites是鬼怪,小妖精,调皮鬼的意思,初听这个高端洋气的名字我被震慑住了,一步步掀开其面纱后发觉很简单的东西,作用却很大 神马是CSS 小妖精 C ...

  4. Web优化 --利用css sprites降低图片请求

    sprites是鬼怪,小妖精,调皮鬼的意思,初听这个高端洋气的名字我被震慑住了,一步步掀开其面纱后发觉非常easy的东西.作用却非常大 什么是CSS Sprites CSS Sprites是指把网页中 ...

  5. css sprites（精灵图）如何使用？

    CSS Sprites是一种性能优化技术,一种网页图片应用处理方式:将多个图像组合成单个图像文件以在网站上使用的方法,以提高性能:也被称为css 精灵图. 网页通常包含多个图像.这些包括图标,按钮,徽 ...

  6. CSS Sprites优缺点

    利用CSS Sprites能很好地减少网页的http请求,从而大大的提高页面的性能,这也是CSS Sprites最大的优点,也是其被广泛传播和应用的主要原因: CSS Sprites能减少图片的字节, ...

  7. 神奇的CSS sprites，制作特效的新方法

    本文主要内容简译自Dava Shea的英文文章 CSS Sprites: Image Slicing’s Kiss of Death,如果觉得博主讲的含糊不清的话,可以看作者原文. 熟悉了常规切图的我 ...

  8. CSS3与页面布局学习笔记（五）——Web Font与CSS Sprites（又称CSS精灵、雪碧图）技术

    一.web font web font是应用在web中的一种字体技术,在CSS中使用font-face定义新的字体.先了解操作系统中的字体: a).安装好操作系统后,会默认安装一些字体,这些字体文件描 ...

  9. Css Sprites 多张图片整合在一张图片上

    CSS Sprites原理: CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中,再利用CSS的"background-image","backgro ...

随机推荐

  1. 李洪强漫谈iOS开发[C语言-051]-判断整数位数

  2. JQuery小结

    一.选择网页元素 jQuery的基本设计和主要用法,就是"选择某个网页元素,然后对其进行某种操作".这是它区别于其他函数库的根本特点. 使用jQuery的第一步,往往就是将一个选择 ...

  3. 教你彻底解决css中设置z-index的值无效的问题

    在使用z-index这个属性之前,我们必须先了解使用z-index的必要条件: 1.要想给元素设置z-index样式,必须先让它变成定位元素,说的明白一点,就是要给元素设置一个postion:rela ...

  4. 安装wampserver之后，浏览器中输入localhost页面显示IIS7解决办法

    1.wampserver图标为绿色才为正常启动,如果为橘色说明端口(默认为80)被占用:可以点击图标,然后点Apache->Service->测试80端口,来验证端口是否被占用. 如果占用 ...

  5. oracle函数,查询,事务

    函数包括:单行函数,多行函数(分组函数) 数值函数: --绝对值 select abs(-12.3) from dual; --向上取值 select ceil(5.3) from dual; --向 ...

  6. Go 语言学习

    golang中国 http://www.golangtc.com/ 第三方github学习 https://github.com/Unknwon/go-fundamental-programmingh ...

  7. 关于UGUI Image Sliced模式的一个BUG。

    Unity4.6.2f1 在Android/IOS平台下,Image选择Sliced模式,并且对Sprite设置好Border后,会发现并没有按照预计的 情况进行拉伸. 搜了一下是因为Sprite的G ...

  8. Java中this关键字的几种用法

    1 . 当成员变量和局部变量重名时,在方法中使用this时,表示的是该方法所在类中的成员变量.(this是当前对象自己) 如:public class Hello { String s = " ...

  9. requirejs解决异步模块加载方案

    他首先会遍历enableRegistry取出其中定义的模块,并且将没有加载成功的模块标识注入noLoads数组,如果过期了这里就会报错 如果上述没问题还会做循环依赖的判断,主要逻辑在breakCycl ...

  10. ThinkPHP 3.2.3 Widget 扩展的使用

    ThinkPHP3.2.3 手册中 Widget 扩展的地址是: http://www.kancloud.cn/manual/thinkphp/1862 Widget 扩展一般用于页面组件的扩展,和自 ...