<linkrel="alternate"lang="fr"xml:lang="fr"title="N'utilisez pas de gradients avec Chrome"type="text/html"hreflang="fr"href="/Scratch/fr/blog/2010-07-07-CSS-rendering-problems-by-navigator/"/>
<linkrel="alternate"lang="en"xml:lang="en"title="Do not use CSS gradient with Chrome"type="text/html"hreflang="en"href="/Scratch/en/blog/2010-07-07-CSS-rendering-problems-by-navigator/"/>
<p>Some <ahref="http://reddit.com">Reddit</a> users reported my website was really long to load and to scroll.
They thinks it was because of the ‘1px shadow’ I apply on all the text.
I was a bit surprised, because I make some test into a really <em>slow</em> virtual machine. And all have always worked fine. In fact, what slow down so much are by order of importance:</p>
<ol>
<li>Radial gradient on Chrome (not in Safari on Mac)</li>
<li>Box shadows on Firefox and Chrome</li>
</ol>
<h2id="gradient">Gradient</h2>
<p>On Safari on Mac there is absolutely no rendering time problem. But when I use Chrome under Linux it is almost unusable.</p>
<p>Safari and Chrome use webkit, when you access my website with javascript enabled, an additionnal browser specific CSS is loaded. Until now I switched only between: IE, Mozilla and Webkit. Now I added one more special case for Chrome. Now I continue to use gradient for Safari but no more on Chrome.</p>
<p>I didn’t tried to verify the efficiency of all new CSS 3 features. But I advise you not to use <strong><code>-webkit-gradient</code></strong> on Chrome. At least when the host is a Linux.</p>
<h2id="box-shadows">Box Shadows</h2>
<p>I also detected that <strong><code>-moz-box-shadow</code></strong> elements slow down the rendering on Firefox under Linux. But there was very few time rendering issue with Safari on Mac.</p>
<h2id="text-shadows">Text Shadows</h2>
<p>Many tell me to use text-shadows sparingly. But I believe it was not the real reason of the slow down. This is why I’ll get them back.</p>
<h2id="conclusion">Conclusion</h2>
<p>Do not use <strong><code>-webkit-gradient</code></strong> on Chrome browser yet.