41–50 of 90 posts
Earlier quoted context omitted.
Since you use the term "antipattern," what is the respectable pattern (methodology) that Tailwind stands opposed to?
Semantic classes.
Maybe you mean classes organized with a high level of abstraction that have multiple rules and are meant to be related to the document structure in a specific way?
Earlier quoted context omitted.
“It helps build fast rendering sites, sometimes even sub-second renders…” That has to be a typo, right? Or sarcasm? I weep for what we’ve all done to the beautiful speed and simplicity of the web.
I don't think it's a typo - a sub-second render on a modern website with all the bells and whistles that users now expect...that probably puts you in the 99th percentile, maybe even higher. Not disagreeing with you though - it's amazing how much bloat we've added. Nobody seems to get just how fucking fast the web actually is. Take a look at Figma or Linear if you want to see products that truly care about performance…
Whoever claims that sub second rendering isn't outstanding is just clueless.
Earlier quoted context omitted.
Semantic classes.
How is a class with a single rule, that does exactly what it's supposed to, not "semantic?" What do you think "semantic" means, in this context? Maybe you mean classes organized with a high level of abstraction that have multiple rules and are meant to be related to the document structure in a specific way?
...etc
Earlier quoted context omitted.
I’m not sure you know exactly what “critical CSS” refers to because it’s unrelated to font loading and “color styles.” It has to do with inlining the CSS required for content “above the fold” while loading the rest asynchronously.
Not necessarily just for content above the fold there is more than one way to split between critical and non-critical e.g. styles for initial page render vs those used on interaction (for a popup menu for example)
> Critical CSS is a technique that extracts the CSS for above-the-fold content in order to render content to the user as fast as possible.
You can decide to put whatever you want into the style tag, but "critical CSS" explicitly refers to above the fold.
Earlier quoted context omitted.
Been developing websites and apps since the days when we are worrying about the y2k bug. Tailwind is my favorite thing. Almost everything that I disliked about CSS is solved by it. Once you really kick the tires, you become way more productive: Naming is hard. No more naming. Switching between your markup and your CSS added friction to your flow. No more friction. Avoiding problems caused by overly aggressive rules /…
I feel the same way about Tailwind, but haven't taken the plunge on Tailwind UI. Though I kinda want to buy it just to support the team. Do you feel like it constrains you too much, or no?
I recently converted several of my projects into critical CSS and now I’m outranking my competitors who still use old CSS. Say what you want but Google loves fast loading sites and gives a good rankings boost. You can whine about critical CSS or get it done and win.
If you're passing your Core Web Vitals scores, there is no further ranking signal.
Transcribed from a 2021 Q&A with Google engineers
> beyond that point [of a good threshold for all Core Web Vital metrics], you don't get additional boost for reaching it even better. Like if you have your LCP at two seconds and you get it all the way down to one second, um, we've kind of publicly stated that that will not increase your ranking
Inlining critical CSS is madness for any project that is above a certain scale. Maybe you can do it for a single page, but in my experience the results are not worth the effort. You can make your site exceptionally fast without it.
Earlier quoted context omitted.
This is the reason I love tailwind. There's no bloat, no headache of naming conflicts (in fact they completely did away with naming), no orphan css. CSS for a full blown website can be less than 5kb. It takes away the pain of thinking about CSS architecture, naming things, conflicts etc and you can just focus on styling.
Tell us a bit more about Tailwind. Last I looked at it a few years ago it seemed a conglomeration of antipatterns. Quick googling is not convincing. Assume that I know _nothing_ about Tailwind, sell it to me. I'd appreciate it. Thanks.
I am a fan of CSSWizardry and yet I find this post misleading. The examples shown are ways NOT to do frontend performance engineering. The current best performant way to load JS is asynchronously as documented at https://web.dev/efficiently-load-third-party-javascript/ . And the best way to load CSS is with Critical Path CSS + Async CSS as documented at https://web.dev/defer-non-critical-css/ . The easiest way to gen…
> yet I find this post misleading. The examples shown are ways NOT to do frontend performance Is advice different than what you prefer "misleading?" Anyway, he doesn't actually weigh in on marking JS with `defer` or `async`. And the article is directly contesting preloading the styles, given his note on race conditions with `media` switching. Moving the CSS before the ` ` closing tag is genuinely a way to really defe…
I have not run into layout janks when I have used critical path CSS. I'd look into other tools/settings while extracting the critical path CSS if this would happen to me.
Earlier quoted context omitted.
I don't think it's a typo - a sub-second render on a modern website with all the bells and whistles that users now expect...that probably puts you in the 99th percentile, maybe even higher. Not disagreeing with you though - it's amazing how much bloat we've added. Nobody seems to get just how fucking fast the web actually is. Take a look at Figma or Linear if you want to see products that truly care about performance…
HN, which is as far removed as you can get from modern websites takes 700-900ms from initial request to render if you're in a logged in session. Whoever claims that sub second rendering isn't outstanding is just clueless.
After that you have 500ms to render your webpage. If you are lazy loading images, and most assets below the fold, thats a lot of time to get a page rendered.
You may take a look at my personal website (https://www.troysk.com/) which is hosted via Cloudflare so has CDN support and does sub second render on first load even though its image heavy.