CODEWITHSUNDEEP
ruby-on-railsasset-pipeline
Sam Kong
Sam Kong

Reputation: 5810

What's the benefit of Rails asset pipeline for images

Asset Pipeline is made up of 3 processes - precompile, concatenation, and minification.

I understand that JavaScript and CSS can benefit from it. However, I can't think of any benefits for images.

Can you explain it, please?

Thanks.

Sam

Upvotes: 1

Views: 880

Answers (3)

pensebien
pensebien

Reputation: 554

When rendering SVG files in your Ruby CSS files

Example
.benefits__icon::after {
  content: "";
  background: url("learn-investment-investxd.svg") no-repeat;
  background-size: 52px;
}

with an assets.rb file as such

  Rails.application.config.assets.precompile += %w( application.css dashboard.css dashboard.js)` with no other configuration.

The example above, the background url would restore to http://localhost:3001/learn-investment-investxd.png even if I place the image file learn-investment-investxd.png in my assets/images folder.

My workaround

I added assets to the url.

.benefits__icon::after {
  content: "";
  background: url("assets/learn-investment-investxd.svg") no-repeat;
  background-size: 52px;
}

This works. It can be improved

Upvotes: 1

cbeer
cbeer

Reputation: 1231

One benefit to passing images through the Rails asset pipeline is to take advantage of asset fingerprinting, which lets you set far-future caching headers and busts the cache when the asset changes.

When a filename is unique and based on its content, HTTP headers can be set to encourage caches everywhere (whether at CDNs, at ISPs, in networking equipment, or in web browsers) to keep their own copy of the content. When the content is updated, the fingerprint will change. This will cause the remote clients to request a new copy of the content. This is generally known as cache busting. ( from the Ruby on Rails Guides: Asset Pipeline)

Upvotes: 1

Brian
Brian

Reputation: 6840

Assuming you use Rails helpers for images (e.g. image_tag), versioning/fingerprining is the primary benefit.

The fingerprinting helps to bust cache (both from a CDN and browser perspective).

See this rails guide section.

Upvotes: 2

Related Questions