ruby-on-rails - Ruby on Rails 项目的 CSS Sprite 生成器

标签 ruby-on-rails ruby sprite css-sprites

我目前正在开发一个访问量很大的大型 Rub​​y on Rails 网站,为了缩短页面加载时间,我们正在考虑对背景图片进行 spriting。那里似乎有很多工具,但很多都处于开发的早期阶段,而且很多不支持我们需要的某些功能。

对我们很重要的功能:

  • x 或 y 重复
  • 通过我们的 rake 构建实现自动化
  • 透明度
  • 自动生成 Sprite 图像和CSS
  • 成熟
  • 易于维护
  • 开源

如果它是用 Ruby 编写的,那将是一个额外的好处,但不是必需的,只要它可以与抽成/上限设置集成即可。

是否有符合大多数(所有?)这些标准的 css sprite 工具?

最佳答案

为什么不使用 data-uri 而不是 spriting 图像? Jammit可以生成带有编译为 data-uri 对象的小图像的 CSS 文件。这实际上比 sprite 表的性能更高,因为这意味着您只有一个用于样式表的 HTTP 连接,而不是一个用于样式表,一个用于 sprite 表。

要使用它,您只需在某处路径中使用/embed/引用您的小图像(图标、重复背景等),它就会生成数据 uri、MHTML 和样式表的普通版本以供服务到各种浏览器。

Jammit 还将多个样式表(和 Javascript)编译到一个文件(每种类型)中,并且如果您想对 AJAX 响应进行 super 优化,也可以使用一些 Javascript 模板。

缺点是 a) 如果您多次引用图像,每次引用都会对其进行编译,并且 b) 更改图像会导致客户需要重新下载整个样式表。但是,由于这些 Assets 通常很少更改,因此它可以成为一种可以在不增加开发过程额外开销的情况下加快页面加载速度的解决方案。

为了减轻这两种情况,您可以有一个单独的样式表,它只用于图像引用,这样您就有一个样式表用于普通布局,然后另一个样式表将所有数据 uri 资源编译到其中。这将导致两个 HTTP 请求,但这意味着您可以更改 CSS 或嵌入的图像,而无需强制重新下载整个样式的另一半。

关于ruby-on-rails - Ruby on Rails 项目的 CSS Sprite 生成器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3827128/

相关文章:

java - 为什么当我尝试更改我的马里奥克隆游戏 Sprite 时,它会被切断?

ruby-on-rails - Rails 未定义的方法

html - 为什么我的移动 View 中的导航栏在 bulma 框架下看起来很瘦?

ruby - 在 Ruby 中有一种优雅的方法可以做到这一点吗?

ruby-on-rails - Bundler 抛出 No Such file or directory for gem install

mysql - 如何使用 ruby​​ 将哈希插入 mysql

c++ - GLSL/OpenGL 重用顶点着色器的输出

sprite - 始终阻止 compass 重新生成 Sprite

ruby-on-rails - 我的第一个 Ruby on Rails 程序报错

javascript - 如何获取函数元素中的值