title: Do CSS gradients get cached?
body: <p>my current project uses quite a few CSS-based background gradients. They are not used for every element, but they are quite essential for the User Interface.
  While integrating them, I was unable to find detailed answers how these gradients affect performance. </p>
  
  <p>Obviously having multiple gradients will use processing power when the respective element is first drawn. Is it known if this gradient generation can also be hardware-accelerated or is this CPU-only?</p>
  
  <p>Additionally, and IMO more importantly, are they being cached? If so, what has to be identical for two elements to share the same "generated" gradient? My first guess would be that the css-statement and the element-size has to be identical (even if the classes that contain this statement are different). It could also be possible that it is being cached by class, but then the element-size could be different and as thus would require another gradient. </p>
  
  <p>For example, if I have a list (ul) with let's say 15 list items (li), which each has a background gradient and includes three elements which also have background gradients, each element type has a constant size. Would the browser generate 15 or 60 gradients?</p>