Switch from PostCSS/Autoprefixer/CSSNano to Parcel CSS#6591
Merged
Conversation
mitchellhenke
approved these changes
Jul 20, 2022
**Why**: Improved performance, both at build time and runtime. changelog: Internal, Build, Improve stylesheet build performance
Contributor
Author
|
I gave this a thorough shake locally, spot-checking individual code differences (particularly on vendor prefixes like Next I'm going to test this in my personal sandbox to make sure the binaries don't give us any trouble in deployment, but otherwise this is shaping up nicely to merge. Edit: Looks good in my personal sandbox! |
mitchellhenke
approved these changes
Aug 2, 2022
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why:
I had tried this once before and the feature support with autoprefixing didn't have what we needed at the time (especially CSS mask used by a lot of USWDS icons), but it looks like this has since improved. Will be worth testing a bit more exhaustively to check overall support.
I also want to confirm more closely that the browserlist configuration is being used as expected.
Resources:
Impact:
yarn build:css(development bundling)Before: ~3.5s
After: ~2.2s
NODE_ENV yarn build:css(production bundling with minification)Before: ~5.3s
After: ~2.5s
NODE_ENV yarn build:css && brotli-size app/assets/builds/application.css(production stylesheet size)Before: 36.6kb
After: 36.0kb