Efficiency of color selection in html. RGB vs hex vs name

Question

Is there a difference in the speed a browser can parse a colour?

for example, the colour red, i could use the following css:

.red
{
    color:red;
    co         


        

Answer 1

I think it's safe to say that browsers will render pages faster if you use the #rrggbb color hashes in your CSS.

I made a super-trivial web page that put a background and foreground color on the body element via CSS, an a little JS at the bottom of the page on a timeout to output the first render time (unfortunately I used the performance.timing.msFirstPaint value, so it will only work in IE, but you can get the gist from this). I rendered the page ten times and took the average. Then I changed the color names ("green" and "white") in the CSS, changed them to hex values (#008000 and #fff) and repeated the measurements. Using names, the page rendered in an average of 41.6ms; using hex values: 14.5ms. Given how simple the test page is, with only two colors, I feel that's a pretty significant difference.