Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

use CSS sprites #965

Closed
robocoder opened this issue Sep 3, 2009 · 6 comments
Closed

use CSS sprites #965

robocoder opened this issue Sep 3, 2009 · 6 comments
Labels
Enhancement For new feature suggestions that for example enhance Matomo's cabapilities.. wontfix If you can reproduce this issue, please reopen the issue or create a new one describing it.

Comments

@robocoder
Copy link
Contributor

Reason: reducing the number of http connections may result in pages loading faster.

Proposed icon sets for conversion:

  • plugins/UserSettings/images
  • plugins/UserCountry/flags

Note: there are a mix of icon sizes in plugins/UsersSettings, mostly 14x14 and 16x16 with a few odd ones:

  • browsers/ep.gif 12x14
  • plugins/java.gif 13x18
  • screens/dual.gif 17x19
  • screens/normal 15x18
  • screens/wide 15x15

For consistency, these should be resized (refreshed from full size images, if possible) to 16x16 for consistency.

@mattab
Copy link
Member

mattab commented Sep 8, 2009

CSS sprites would be very useful for country flags too.

Ideally, a script would be run that would take the list of input images, and build the merged version, as well as build the map in a php array of the X/Y offsets of the sprite. I have heard of open source library to do this already, for example: http://csssprites.org/. This one seems to be the best practise to use: reference the logos in the CSS file, and the tool parses the CSS and builds the sprite version.

@mattab
Copy link
Member

mattab commented Sep 8, 2009

when adding this feature, there should be a quick README explaining: How to add a new logo for a flag, or a new browser? Setup the css, run the script to convert the css, etc.

@mattab
Copy link
Member

mattab commented Nov 10, 2009

CSS sprites, if added as a feature, should not add overhead to the developper's time of building new UI or adding new logos in the Piwik release. vipsoft, what are your thoughts about this new feature and its implementation?

@robocoder
Copy link
Contributor Author

Using sprites isn't all or nothing.

I recommend that we only use sprites where:

  • there is a homogeneous set of related images
  • an image is not considered part of a theme or Piwik brand
  • the development state of the plugin and its images is relatively stable (i.e., not alpha/beta)

Proposal:

  • Convert country flags, browsers, os, and plugins images to sprites
    • these are generally very static (an exception was the flag update in Wrong Flag of Georgia #849)
    • if a developer adds a new image, he/she can simply be add it to the .css file; we're not forced to regenerate the sprites at any time
  • Add a script or procedure to regenerate those sprites
  • Code and/or template mods to use those sprites
  • Continue to distribute the individual image files

@mattab
Copy link
Member

mattab commented Jan 13, 2014

Probably too tricky with the new Theming feature

@bittner
Copy link

bittner commented Jan 7, 2015

+1

CSS sprites in the following plugins would significantly increase (perceived) loading and display time of the Dashboard:

As of today the Dashboard flickers and quivers for quite a few seconds, mainly when displaying the visitors panel, until all images are loaded.

This issue was closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Enhancement For new feature suggestions that for example enhance Matomo's cabapilities.. wontfix If you can reproduce this issue, please reopen the issue or create a new one describing it.
Projects
None yet
Development

No branches or pull requests

3 participants