英文原文: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. javascrit2.0完全参考手册(第二版) 第2章第2节 语言特性

    脚本执行顺序     js代码是按照它们在html中出现的顺序一行一行被解释的.这表明把函数定义和变量声明放到<head>中会很好.这保证了函数的代码和事件相关的处理程序不会立即执行. 大 ...

  2. django1.9 创建项目和app并初始化项目

    创建项目: django-admin startproject  mytest04 创建app: python manage.py startapp app04 配置:settings.py 1. 2 ...

  3. nfs基本配置

    一.安装nfs: yum install nfs-utils rpcbind 创建共享目录:mkdir -p /XXX/export/ 修改配置文件:vim /etc/exports /XXX/exp ...

  4. POJ 2838 单调队列

    Sliding Window Time Limit: 12000MS   Memory Limit: 65536K Total Submissions: 55309   Accepted: 15911 ...

  5. css - float浮动模块的高度问题 解决方案

    当一个Div中的子元素都是浮动元素时,该div是没有高度的.通常会带来很多困扰,解决方案如下: 低版本统配兼容: overflow: hidden; 下面是不支持低配浏览器,而且似乎该效果对 P 标签 ...

  6. include文件时尽量使用绝对路径

    1.如果能将类的方法定义成static,就尽量定义成static,它的速度会提升将近4倍. 2.$row['id'] 的速度是$row[id]的7倍. 3.echo 比 print 快,并且使用ech ...

  7. SVN :This XML file does not appear to have any style information associated with it.

    SVN :This XML file does not appear to have any style information associated with it. The document tr ...

  8. NFS服务器搭建

    1. 安装nfs-kernel-server,然后编辑/etc/exports. /sambadata/nfsserver    10.0.0.0/255.255.255.0(fsid=0,all_s ...

  9. 【iCore3 双核心板_FPGA】例程八:触发器实验——触发器的使用

    实验指导书及代码包下载: http://pan.baidu.com/s/1bswW3c iCore3 购买链接: https://item.taobao.com/item.htm?id=5242294 ...

  10. html基本的内容

    1.表现各标签的特征 <img>中的src(source)即为属性 属性都是以"属性名 = 值"的形式出现 属性的值建议用引号括起来 属性建议均以键值对的形式括起来 一 ...