CSS bundling options in Ruby on Rails - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

How does CSS bundling improve Rails app performance?

In a Rails app using CSS bundling, what is the main benefit of combining multiple CSS files into one bundle?

A It disables CSS caching to ensure styles update instantly on every request.

B It automatically converts CSS to JavaScript for better browser compatibility.

C It reduces the number of HTTP requests, speeding up page load times.

D It splits CSS files into smaller chunks to load only needed styles per page.

💡 Hint

Think about how browsers load files and how fewer files can mean faster loading.

Bundling CSS combines many files into one, so the browser makes fewer requests. This reduces waiting time and speeds up page loading.

❓ component_behavior

intermediate

What happens when you enable CSS bundling in Rails?

Given a Rails app with multiple CSS files, what is the expected behavior after enabling CSS bundling?

A All CSS files are merged into a single file served to the browser.

B Each CSS file is loaded separately with unique URLs to avoid caching.

C CSS files are converted to inline styles inside HTML files.

D CSS files are ignored and styles are loaded from external CDN only.

💡 Hint

Consider what bundling means for file delivery.

Enabling CSS bundling merges all CSS files into one, reducing requests and simplifying style delivery.

📝 Syntax

advanced

Identify the correct CSS bundling config in Rails

Which of the following is the correct way to configure CSS bundling in config/assets.rb for Rails?

A css_bundling.install('tailwind')

B cssbundling.install :tailwind

C CSSBundling.install :tailwind

D cssBundling.install :tailwind

💡 Hint

Look for the correct method name and symbol usage in Ruby.

The correct syntax uses lowercase method cssbundling.install with a symbol argument :tailwind.

🔧 Debug

advanced

Why does CSS bundling fail to update styles after changes?

After enabling CSS bundling in Rails, you update your CSS but the browser still shows old styles. What is the most likely cause?

A The CSS bundling gem is incompatible with Rails 7.

B Rails does not support CSS bundling with Tailwind CSS.

C The CSS files are not saved in the <code>app/assets/stylesheets</code> folder.

D The CSS bundle is cached by the browser and needs cache clearing or fingerprinting.

💡 Hint

Think about how browsers handle static files and caching.

Browsers cache bundled CSS files. Without cache busting (fingerprinting), updates may not show until cache is cleared.

❓ lifecycle

expert

When is CSS bundling applied during Rails asset pipeline lifecycle?

At what stage in the Rails asset pipeline does CSS bundling typically occur?

A During asset precompilation before deployment to production.

B At runtime when the browser requests CSS files.

C When the Rails server starts, before serving any requests.

D After the browser downloads CSS, during rendering.

💡 Hint

Consider when assets are prepared for production use.

CSS bundling happens during asset precompilation, combining and optimizing CSS before deployment.