In the playground, why does ‘yellow’ get converted to ‘#ff0’ but ‘green’ remains ‘green’?
Because the hex for green (#00ff00) needs more letters than using the named color.
Parcel CSS: A new CSS parser, compiler, and minifier
11–20 of 129 posts
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#12Re: Parcel CSS: A new CSS parser, compiler, and minifier
#13Re: Parcel CSS: A new CSS parser, compiler, and minifier
#14Earlier quoted context omitted.
Because the hex for green (#00ff00) needs more letters than using the named color.
Wouldn't that shorten to #0f0? But "green" is #008000, which doesn't shorten?
Hmm I wonder which approach is actually better overall when it comes to content-encoding like their own site uses (brotli compression) or client side parsing performance. It's all probably a bit off into the weeds over something like 0.05% performance though.
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#15In the playground, why does ‘yellow’ get converted to ‘#ff0’ but ‘green’ remains ‘green’?
Because the hex for green (#00ff00) needs more letters than using the named color.
That's an... interesting optimization, and one that might make sense if you only care about byte size, but intuition (which might be wrong!) tells me that this will be more expensive (especially if it saves only one or two bytes).
I'd bet that browsers can more quickly parse a string like '0x00ff00' into its internal color representation than it can parse the string 'green'. It's probably faster to check for a '0x' prefix and convert hex-encoded ASCII to u8 values, than it is to normalize the string & do a lookup in a dictionary of 147 CSS3 color names, when taking into account the extra two bytes that need to be transferred.
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#16I 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...
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#17I 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...
No post body was provided.
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#18I 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...
Parcel has been around for awhile, and the project currently has a lot of activity - I've made the call to migrate an old create-react-app project to Parcel 2 and in general it is going well.
The nice thing about Parcel is that it is intentionally low-config with relatively intuitive defaults, which tells me that it wouldn't be terribly difficult to move to a different bundler in the future. Webpack has gotten better, but you can quickly end up with a _lot_ of Webpack-specific config that makes future migrations hard.
That said, optimizing for future migrations shouldn't generally be your #1 priority - I also like Parcel's speed, and new things like ParcelCSS just validate that further.
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#19Earlier quoted context omitted.
Had you taken the time to open the link, the 2nd paragraph states their capabilities succinctly: > Parcel CSS has significantly better performance than existing tools, while also improving minification quality. In addition to minification, Parcel CSS handles compiling CSS modules, tree shaking, automatically adding and removing vendor prefixes for your browser targets, and transpiling modern CSS features like nesting…
I've obviously read that. Most of those features are what we used to call CSS pre-processors, but I'll happily call that compilation if that's a thing now.
It wasn't obvious to me that you had read that paragraph.
Re: Parcel CSS: A new CSS parser, compiler, and minifier
#20I 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.