stevebauman / curlwind

Generate Tailwind utility stylesheets on demand.
https://curlwind.com
123 stars 4 forks source link

Multiple links to curlwind on a page? #7

Closed richcorbs closed 7 months ago

richcorbs commented 7 months ago

This really isn't an issue but it seemed more than I wanted to ask on X.

How terrible would it be to include multiple links to cdn.curlwind.com on a page?

Even for a small page there could be a lot of styles. Think of the lengthy tailwind class lists on individual elements and then needing to combine all of them (the unique ones) together into a single URL. I mean we only get 2048 characters, depending on which source and browser you trust.

I'm considering having links for:

Would that just be awful from any perspective?

Thanks for CurlWind! It's enjoyable to use.

stevebauman commented 7 months ago

Hey @richcorbs, thanks for the question!

I don't think it'd be awful at all, it'd just be an additional HTTP request on the initial load of the page.

I totally get it though. I'm thinking of building a "preset" system where you'll be able to toggle on styles and combine them into a single shortlink to reduce the length of the URL.

Also thinking of implementing the ability to provide "categories" or "properties" in the query params to produce the tailwind classes that interact with said category or property. For example, passing in "properties=flex" would produce all the Tailwind flexbox utilities.

What do you think?

richcorbs commented 7 months ago

Just tried out multiple links. It seems to have worked.

The only observation so far is that every link returned a fair amount of boilerplate tailwind stuff beyond the things I explicitly asked for. I don't think this reflects negatively on CurlWind. Just an observation.

With separate links I get back ~16kb in CSS. It happens largely in parallel and so it's still snappy.

With one big link I only get back ~7kb.

richcorbs commented 7 months ago

Would presets be configurable by some sort of UI? And name-able? Like gimme the "?preset-name=project-x-typography-styles"?

I can see the value of having "properties".

On the other hand, a CurlWind without support for wildcards would force me to request exactly what I need which kind of matches the minimalistic vibe I get when I use CurlWind.

Thanks for being approachable about it!

stevebauman commented 7 months ago

Ah you're likely receiving Tailwinds "preflight" CSS in both of them. Disable it on one of the links via "preflight=0"

stevebauman commented 7 months ago

Would presets be configurable by some sort of UI? And name-able? Like gimme the "?preset-name=project-x-typography-styles"?

Yea that's exactly right 👍

richcorbs commented 7 months ago

Here's where I ended tonight: