Hacker News new | ask | show | jobs
by dom96 1206 days ago
I tend to stick with script tags as much as I can. Really the problem are all the frameworks pushing people to create a build step. Their excuse is optimising the code size, but for most cases that matters little, I don't mind including all of tailwind or font-awesome.

So please, if you own a framework like this, make sure a script tag with a CDN link is easily copyable.

4 comments

Are you talking about the CDN version of Tailwind? If so, the docs specifically say that's not for production use.

A lot of very useful features require a build step because it generates classes on the fly based off what you typed in the HTML.

I bet you lots of people are ignoring the "don't use this in prod" advice. Why doesn't Tailwind just offer a for-production CDN link? I understand that the build step provides features, but what if I don't care about those features?
It's not just features, it's a 350kb js file you have to send over the wire [1] as opposed to pre-building and sending a tiny css file containing the small subset of classes you used.

Not to mention, I don't know exactly how it works, but I assume it's doing all that processing to convert classes in your HTML into CSS classes on the client side so it's probably less performant.

[1] https://cdn.tailwindcss.com/

> Really the problem are all the frameworks pushing people to create a build step.

I doubt it.

People moved on from jQuery and/or vanilla because they needed to produce more sophisticated apps. And even in those days of yore, for any non-trivial project you still needed to concatenate and minify your code.

BTW Preact can be used without a build step.

React and Vue can also be used without a build step. Vue shows how to do it in the "Quick Start" at the beginning of the tutorial. React can do it with an ugly syntax and no libraries, or by using Preact creator's htm library, or domz.
The reason for bundling is converting potentially hundreds of individual script files to an amount that’s more manageable with a browser, without suffering a cost from latency… not only optimizing code size. Also, besides tree-shaking there’s a big saving from minimization and removing development-only code.
With HTTP/2 multiplexing the latency of fetching multiple files from the same server is not a big issue anymore: https://stackoverflow.com/a/30864259.

One can also argue that Minification is also not really that important with widespread new compression algorithms like Brotli.

EDIT: Also, see this very good argument in favor of multiple files: https://news.ycombinator.com/item?id=34997759

Sadly there's lots of people are overoptimizing all of these things for apps that serve 10 users.

If you serve 10 million users every byte counts, but 10? Use the cdn.

How can you get all of tailwind? I've been struggling on that one, always have to run some tool to get a built CSS file. And any change then needs build before refresh. And I cant look at a file with 1000s of definition (which I want to do)
i think if you use tailwind, not to use the actual package loses a lot of what it can do, I don't think you get all the features/functions for ..um only delivering the parts required (having mind fog this morning lol)... I'm not sure if it's tree-shaking, but how they look at every file w/ tailwind in and only bundle up the needed css. However, maybe it works in deno? I don't know.