Article | Date posted : 7 June, 2013 | Updated on : 16 January, 2014

id versus class performance

Sponsored Links

For a beginner web developer or designer there is always a question as to why you should use a class over an id or an id over a class.

But I’m not going to cover a topic that already has been explained excellently by Chris Coyier which you can find here.

I’m going to explain to you the performance difference between an ID and a Class.

Every character regardless of its type is measured as 1 byte.

So if we take two examples using the same identifier but different selectors, we will see that one is lighter than the other.

example 1 using an id.

versus 1 using a class

We count that the id has 22 characters thus being 22 bytes and the class counts 25 characters which is 25 bytes

3 bytes is not much, but imaging having a hundred or even a thousand id’s, 300 bytes or 3 kb is a big difference.

Then multiplying 3 kb with the amount of unique visitors, your counting up the numbers.

100.000 visitors will turn it into 28.610229492 mb

And multiply that for each page you have. You will find out that everything ads up.

I know this is knit picking but facts are facts! 🙂

Sponsored Links


Leave a Reply

Your email address will not be published. Required fields are marked *

Follow me on Google+

Google Shopping Data Feed Generator

Sponsored Links

Hire Me