Live data from Hacker News

Parcel CSS: A new CSS parser, compiler, and minifier

parceljs.org

71–80 of 129 posts

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#71
post #20

I was just looking at Parcel a week or so ago to replace the stagnated Snowpack project for our frontend. Should I just stop trying to avoid it and just use Webpack 5, or can I actually rely on Parcel in a way I couldn't Snowpack? I just want to bundle my React app, I'm not trying to do anything special...

Use Vite instead, it has very nice developer experience. Webpack is a "legacy" bundler, while it is supported, is shouldn't really be used in new projects if you really value your sanity.

I'd argue that Vite's still pretty immature. It's great if you can stick within what works with it, but webpack is still the gold standard in terms of compatibility and features, and I suspect that will be the case for another couple of years while the native code bundlers (esbuild, swc, etc) catch up with their JS counterparts.

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#72
When a site's CSS is well written, with a capable web developer knowing, what they are doing, such a tool would not be necessary. People pump out megabytes of JavaScript, but then they worry about a few kilobytes of CSS being saved by compressing it, at the same time making it less readable by minifying it. (We are not yet shipping hundreds of kilobytes of CSS, are we?!)

When there is a need for a tool that minifies CSS, then people seriously need to ask themselves, how it can be, that they have that much CSS. How much redundant CSS can you accumulate? Was there no coherent styling idea or strategy, so that every thing on the page needs separate styling?

What many forget is, that data is often sent gzip compressed anyway, which naturally takes advantage of repeated parts to compress. Text usually compresses pretty well. Especially something like a description language with many repeating parts. It is great, that Parcel CSS is faster than some other tool. However, for me, these kind of tools are merely treating the symptoms of not doing styling properly. I'm glad, that I got to know the web, when you simply could look at all the source of a page and learn from it, instead of facing a multi megabyte "minified" script and "minified" CSS.

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#74

When a site's CSS is well written, with a capable web developer knowing, what they are doing, such a tool would not be necessary. People pump out megabytes of JavaScript, but then they worry about a few kilobytes of CSS being saved by compressing it, at the same time making it less readable by minifying it. (We are not yet shipping hundreds of kilobytes of CSS, are we?!) When there is a need for a tool that minifies…

> We are not yet shipping hundreds of kilobytes of CSS, are we?

Well, Bootstrap 5 is ~200K when not minified and a web site usually ships additional CSS resources as well.

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#75
post #74

When a site's CSS is well written, with a capable web developer knowing, what they are doing, such a tool would not be necessary. People pump out megabytes of JavaScript, but then they worry about a few kilobytes of CSS being saved by compressing it, at the same time making it less readable by minifying it. (We are not yet shipping hundreds of kilobytes of CSS, are we?!) When there is a need for a tool that minifies…

> We are not yet shipping hundreds of kilobytes of CSS, are we? Well, Bootstrap 5 is ~200K when not minified and a web site usually ships additional CSS resources as well.

Oh my ... Does one need all of that? Isn't there a process of reducing it to only what one needs? I think there was something like that in the past. Not sure how well that works.

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#76
post #74

Earlier quoted context omitted.

> We are not yet shipping hundreds of kilobytes of CSS, are we? Well, Bootstrap 5 is ~200K when not minified and a web site usually ships additional CSS resources as well.

Oh my ... Does one need all of that? Isn't there a process of reducing it to only what one needs? I think there was something like that in the past. Not sure how well that works.

> Isn't there a process of reducing it to only what one needs?

One such process is what you're commenting on here in this thread.

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#77

Unrelated but regarding SCSS/SASS: I am curious, why did we invent a new syntax for scss instead of writing a library in Python or Go that maps data-objects to CSS classes? You have full access to a proper programming language instead of this new DSL we need to learn. I tried searching for it but no luck, any reason why we don't do this?

I can't speak for all features in SCSS/SASS. I'd prefer JS (for reusability) to Python, Go and DSLs, but why open Turing complete Pandoras box in the first place when declarative works so incredibly well?

Regular CSS didn't have variables for a long time, which was the killer use case imo. I haven't been in the loop for a while but just found out that there is a CSS Custom Properties[1] standard which would solve most of my use cases. Heck, they're even scoped! Imo front-end folks have an unhealthy low threshold for taking on dependencies that are already supported natively, imo.

[1]: https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_c...

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#78
post #76

Earlier quoted context omitted.

Oh my ... Does one need all of that? Isn't there a process of reducing it to only what one needs? I think there was something like that in the past. Not sure how well that works.

> Isn't there a process of reducing it to only what one needs? One such process is what you're commenting on here in this thread.

I am more talking about "Only ever include the CSS rules we need." instead of "Lets take the whole of bootstrap! Oh damn, we have to somehow reduce it!".

If memory serves me right, you could compile the Bootstrap library and choose the parts you needed. Not sure if that is still true for Bootstrap 5. If it is not possible, it stands to reason, that perhaps one should not use Bootstrap 5 and instead write good styling oneself, without all the stuff, that will never be used on the site anyway.

CSS can be tricky, but in the end, reasonable styling is usually not that hard to do. Even responsiveness can be done mostly without media queries these day, unless you want content to change, if layout changes. It used to be much harder, when our browser standards were not that far. Nowadays we have flex and grid and more standardized interpretations of CSS rules in browsers. We can make navigations, menus, tiles and whatever all responsive without that much work put in.

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#79
post #74

Earlier quoted context omitted.

> We are not yet shipping hundreds of kilobytes of CSS, are we? Well, Bootstrap 5 is ~200K when not minified and a web site usually ships additional CSS resources as well.

Oh my ... Does one need all of that? Isn't there a process of reducing it to only what one needs? I think there was something like that in the past. Not sure how well that works.

> Isn't there a process of reducing it to only what one needs?

Yes there is:

https://github.com/uncss/uncss

https://github.com/purifycss/purifycss

Re: Parcel CSS: A new CSS parser, compiler, and minifier

#80
post #76

Earlier quoted context omitted.

> Isn't there a process of reducing it to only what one needs? One such process is what you're commenting on here in this thread.

I am more talking about "Only ever include the CSS rules we need." instead of "Lets take the whole of bootstrap! Oh damn, we have to somehow reduce it!". If memory serves me right, you could compile the Bootstrap library and choose the parts you needed. Not sure if that is still true for Bootstrap 5. If it is not possible, it stands to reason, that perhaps one should not use Bootstrap 5 and instead write good styling…

From the Parcel CSS page : it does 'tree shaking', which automatically eliminates unused code. Not details on what that implies, though. Tools like PurgeCSS (used by Tailwind pre-v3) comb through the HTML for matching selectors, but I'm not sure if Parcel does the same thing.

Anyway, as others comments said, these kind of tools nowadays are more 'transformers' than mere 'minifiers'.

Post reply on HN