Download & Extend

Remove progress.gif from inclusion into CSS

Project:Zen
Version:7.x-5.x-dev
Component:CSS/SASS/HTML markup
Category:bug report
Priority:normal
Assigned:Unassigned
Status:closed (works as designed)

Issue Summary

The file progress.gif is needed not so frequently, but it's always included in the compiled CSS. This huge (6 kilobytes) file is not the best candidate for inline-image(), IMHO.

Comments

#1

Here's the actual patch.

AttachmentSize
zen-remove_progress_gif-1851290-1.patch 105.38 KB

#2

Status:active» needs review

#3

Status:needs review» closed (works as designed)

This huge (6 kilobytes) file is not the best candidate for inline-image(), IMHO.

It's actually the best candidate for inline image. If you reference an image in a CSS file, the browser will ALWAYS download it, even if you don't actually use that selector on the given page. That means that it will do 2 HTTP requests (one for the CSS and one for the image). Making it inline means you only need 1 HTTP request since the image is embedded in the CSS.

If you don't think the progress bar will be needed on the front-end of your site (very possible), I'd suggest removing the ruleset from your theme.

#4

> the browser will ALWAYS download it, even if you don't actually use that selector on the given page

Are you sure? My experience is if you set a separate background image for a:hover, there is a delay when hovering - the browser makes a new HTTP request.
Maybe mobile browsers behave different...