Comparing two identically designed websites, their weight, amount of HTML and CSS, rendering speed, and best practices.

Kevin

FaunaDB

Community Picks is a section on daily.dev where our community members share the most interesting and valuable content they've discovered online. From insightful articles to handy tools, every post is a gem curated by our dedicated coomunity. To contribute to Community Picks, you need to have at least 250 reputation points, ensuring that only active and trusted members can share their finds.

Community Picks

This post compares the differences between Tailwind and Semantic CSS in terms of coding, rendering speed, separation of concerns, and more. It highlights that Semantic CSS is significantly smaller in size, faster in rendering, and allows for loose coupling and reusability.

Tailwind vs. Semantic CSS

This guy doesn’t know what he is talking about when comparing tailwind vs symantic. He is thinking Tailwind you need to use &lt;div&gt; tag for everything well you don’t lol. Need more people to chime on this.

Extremely biased article that just bashes on Tailwind.
Cherry-picked arguments and even some straight out false. (Theming in tw is very much possible and one of its strong points.)
It says tw is popular with new devs - I’m a 10+ yrs css dev and have fallen in love with tailwind for very concrete and productive reasons.

“Tailwind needs significantly more coding because you are completely lacking the power of CSS.”
This has to be one of the worst takes on tailwind I’ve come across so far. The comparisons of htmls make no sense. Also this:
“With Tailwind you must create a JavaScript component to construct a suitable HTML structure for the design.”
Does the author not know that you can use tailwind outside React (or JS frameworks in general)?

This author is famous for unabashedly hating on Tailwind. He exclusively focuses on Tailwind’s weaknesses (how it looks in the “inspect elements”/“view source” panels) while completely glossing over how the actual css in “semantic css” (whatever that means…) looks.
The simple fact that he chooses to even mention the DOM (as in; the base DOM without any classes) in what is supposed to be a comparison of CSS strategies clearly tells us that he’s failing to find real arguments and creates fictitious ones; There’s absolute zero reason to have a different DOM in either scenario.
In Tailwind it’s easier to have a more consistent design (by virtue of the entire system being created around a centralized configuration file)

I’m a fan of writing my CSS. But this article is completely biased and simply wrong in many places. It is not a good reference.