英文原文：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. 史上最全的Win8快捷键大全

    下列的 Win8 快捷键列表汇总均收集自网络,未全部实测,也有可能有Win7时代的热键混迹其中,不管怎样,如有错漏,欢迎大家指正! Win8 常用快捷键: Win键 可在开始屏幕主菜单及最后一个应用程 ...

  2. JQuery的动画及其幻灯片效果

    1.显示和隐藏hide()和show() 对于动画来说,显示和隐藏是最基本的效果之一,简单介绍jQuery的显示和隐藏. <script type="text/javascript&q ...

  3. 关于GreenOdoo的一个Bug

    动态创建字段的时候,虽然字段已经创建,但是显示的时候会报没有新创建的字段错误: 但是原版是没有任何问题的,记录一下.

  4. Address already in use:JVM_Bind

    1.原因:端口被占用 2.解决方式: 方式一:重启电脑 方式二:方式一不行执行方式二 双击Tomcat server   将Ports下HTTP/1.1对应的Port Number 改为其他值 备注: ...

  5. HTML - 毛玻璃 滤镜 模糊

    css 秘密花园 http://dabblet.com/gist/d9f243ddd7dbffa341a4 场景,背景图片 + 毛玻璃遮盖 原理:利用background的cover特性,将毛玻璃的区 ...

  6. 过河问题nyoj47

    时间限制:1000 ms  |  内存限制:65535 KB 难度:5   描述 在漆黑的夜里,N位旅行者来到了一座狭窄而且没有护栏的桥边.如果不借助手电筒的话,大家是无论如何也不敢过桥去的.不幸的是 ...

  7. java数据结构

    1.计算机科技的两大支柱 1.数据结构 2.算法 程序＝数据结构+算法 2.定义:是一门研究非数值计算的程序设计问题中计算机的操作对象以及它们之间的关系和操作等等的学科 3.数据(Data):是对信息 ...

  8. window对象中的常见方法

    <body><!-- window对象中的常见方法--><script type="text/javascript"> var timeid; ...

  9. Codeforces Round #376 (Div. 2) C D F

    在十五楼做的cf..一会一断...比赛的时候做出了ABCF 就没有时间了 之后没看题解写出了D..E是个神奇的博弈(递推或者dp?)看了题解也没有理解..先写了CDF.. C 有n个袜子 每个袜子都有 ...

  10. request

    social.Favorites.AddFavorite=function(angel) { a = $.extend(true, { type: "POST", url: &qu ...