performance tradeoffs - CSS efficiency, CSS filesize, HTML filesize

From my interpretation, google recommends targeting HTML elements via id performs better than targeting purely by hierachy, but when filesize is added into this equation, how do the priorities end up?

Just to be clear, there are three factors here which I wish to d开发者_运维问答iscuss the trade-offs between.

• CSS efficiency
• CSS filesize
• HTML filesize

In general it is probably better to keep HTML filesize smaller, since HTML is mostly dynamic and difficult to cache.

CSS is often static and easily cacheable, so filesize is not so important, if you set your cache headers right. CSS selectors are probably most efficient if the selector expressions are not too complex. I believe id selectors are optimized in many browsers.

If you want to keep your CSS efficient then use a simple visual layout, a few simple CSS selectors and use newer CSS effects minimally.

Here is a good set of general best practices for HTML performance : http://developer.yahoo.com/performance/rules.html