-
Notifications
You must be signed in to change notification settings - Fork 108
Conversation
@janicklas-ralph on Slack you mentioned that there are still some issues. Can you please elaborate? |
@alan-agius4 There were issues with minification and traversing nodes correctly. I think I've fixed most of them with the following commits. This version is good for testing |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM! Any idea if this is meaningfully faster or slower? The build+test action finishes 13% faster than main
, maybe it's a perf win?
@developit, I am actually interested that as well, especially for SSR scenarios. |
I ran some tests with around 5 different sites, from what I can tell is the CSS parsing is a small portion of the overall time taken by critters. Majority of the time is spent in DOM lookup. |
This also appears to solve angular/universal#2367 |
[](https://renovatebot.com) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [critters](https://github.com/GoogleChromeLabs/critters) | [`0.0.6` -> `0.0.20`](https://renovatebot.com/diffs/npm/critters/0.0.6/0.0.20) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes <details> <summary>GoogleChromeLabs/critters (critters)</summary> ### [`v0.0.20`](https://github.com/GoogleChromeLabs/critters/compare/3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c...0.0.20) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c...0.0.20) ### [`v0.0.19`](https://github.com/GoogleChromeLabs/critters/compare/bcce3103f9e754cd8c3d8b1681f7e1cf6e536282...3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/bcce3103f9e754cd8c3d8b1681f7e1cf6e536282...3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c) ### [`v0.0.18`](https://github.com/GoogleChromeLabs/critters/compare/1f8a941a069cfeb68450d33a42187c5398496fd7...bcce3103f9e754cd8c3d8b1681f7e1cf6e536282) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/1f8a941a069cfeb68450d33a42187c5398496fd7...bcce3103f9e754cd8c3d8b1681f7e1cf6e536282) ### [`v0.0.17`](https://github.com/GoogleChromeLabs/critters/blob/HEAD/CHANGELOG.md#v0017) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.16...1f8a941a069cfeb68450d33a42187c5398496fd7) - Updated the HTML parser from parse5 to htmlparser2 - Implemented caching to improve speed of matching class and id based selectors - Added option `includeSelectors` - Added option `reduceInlineStyles` Feature Include/Exclude CSS rules via comments in CSS Feature Adding Critters containers. Wrap the HTML contents in a `data-critters-container` container to indicate above the fold HTML. ### [`v0.0.16`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.16) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.15...critters-0.0.16) #### What's Changed - Add support for `:where` selector by [@​jeripeierSBB](https://github.com/jeripeierSBB) in [https://github.com/GoogleChromeLabs/critters/pull/93](https://github.com/GoogleChromeLabs/critters/pull/93) - Fix inlining of `-webkit-keyframes` (often generated by scss) by [@​JessicaSachs](https://github.com/JessicaSachs) in [https://github.com/GoogleChromeLabs/critters/pull/96](https://github.com/GoogleChromeLabs/critters/pull/96) (see [#​86](https://github.com/GoogleChromeLabs/critters/issues/86)) - Fix fs import breaking in ESM builds by [@​developit](https://github.com/developit) in [https://github.com/GoogleChromeLabs/critters/pull/97](https://github.com/GoogleChromeLabs/critters/pull/97) - Document `preload:false` option by [@​kurtextrem](https://github.com/kurtextrem) in [https://github.com/GoogleChromeLabs/critters/pull/95](https://github.com/GoogleChromeLabs/critters/pull/95) #### New Contributors - [@​JessicaSachs](https://github.com/JessicaSachs) made their first contribution in [https://github.com/GoogleChromeLabs/critters/pull/96](https://github.com/GoogleChromeLabs/critters/pull/96) - [@​kurtextrem](https://github.com/kurtextrem) made their first contribution in [https://github.com/GoogleChromeLabs/critters/pull/95](https://github.com/GoogleChromeLabs/critters/pull/95) - [@​jeripeierSBB](https://github.com/jeripeierSBB) made their first contribution in [https://github.com/GoogleChromeLabs/critters/pull/93](https://github.com/GoogleChromeLabs/critters/pull/93) **Full Changelog**: GoogleChromeLabs/critters@critters-0.0.15...critters-0.0.16 ### [`v0.0.15`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.15): critters 0.0.15 [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.14...critters-0.0.15) - Bugfix: add missing getter for `document.head` ([#​87](https://github.com/GoogleChromeLabs/critters/issues/87), thanks [@​rschristian](https://github.com/rschristian)!) ### [`v0.0.14`](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.13...critters-0.0.14) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.13...critters-0.0.14) ### [`v0.0.13`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.13) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.12...critters-0.0.13) This fixes a bug in `[email protected]` where HTTP (as opposed to HTTPS) remote stylesheets were not skipped (thanks [@​alan-agius4](https://github.com/alan-agius4) - [#​83](https://github.com/GoogleChromeLabs/critters/issues/83)) **Full Changelog**: GoogleChromeLabs/critters@critters-0.0.12...critters-0.0.13 ### [`v0.0.12`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.12): Critters 0.0.12 #### What's Changed - Update parser to postcss by [@​janicklas-ralph](https://github.com/janicklas-ralph) in [https://github.com/GoogleChromeLabs/critters/pull/80](https://github.com/GoogleChromeLabs/critters/pull/80) - fix: update css-select to version 4 by [@​alan-agius4](https://github.com/alan-agius4) in [https://github.com/GoogleChromeLabs/critters/pull/82](https://github.com/GoogleChromeLabs/critters/pull/82) - fix: skip processing of remote stylesheets by [@​alan-agius4](https://github.com/alan-agius4) in [https://github.com/GoogleChromeLabs/critters/pull/75](https://github.com/GoogleChromeLabs/critters/pull/75) - Improve TypeScript typings by [@​developit](https://github.com/developit) in [https://github.com/GoogleChromeLabs/critters/pull/76](https://github.com/GoogleChromeLabs/critters/pull/76) - Add swap-high preload mode by [@​developit](https://github.com/developit) in [https://github.com/GoogleChromeLabs/critters/pull/56](https://github.com/GoogleChromeLabs/critters/pull/56) **Full Changelog**: GoogleChromeLabs/critters@57c4b40...critters-0.0.12 ### [`v0.0.10`](https://github.com/GoogleChromeLabs/critters/compare/e9a687265cd003fcbf27e7802d7b8c72168c8a14...1f23cb5b488effe0f782cc6855013fdaec38924c) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/e9a687265cd003fcbf27e7802d7b8c72168c8a14...1f23cb5b488effe0f782cc6855013fdaec38924c) ### [`v0.0.9`](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...e9a687265cd003fcbf27e7802d7b8c72168c8a14) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...e9a687265cd003fcbf27e7802d7b8c72168c8a14) ### [`v0.0.8`](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...0524b2e297eb995238b29cad01fadd49524d98bd) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...0524b2e297eb995238b29cad01fadd49524d98bd) ### [`v0.0.7`](https://github.com/GoogleChromeLabs/critters/compare/99d5070b58e5edc861f5ac6cdc8fc15223a04bfc...0524b2e297eb995238b29cad01fadd49524d98bd) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/99d5070b58e5edc861f5ac6cdc8fc15223a04bfc...0524b2e297eb995238b29cad01fadd49524d98bd) </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/sammyfilly/Canary-nextjs).
[](https://renovatebot.com) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [critters](https://github.com/GoogleChromeLabs/critters) | [`0.0.6` -> `0.0.20`](https://renovatebot.com/diffs/npm/critters/0.0.6/0.0.20) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes <details> <summary>GoogleChromeLabs/critters (critters)</summary> ### [`v0.0.20`](https://github.com/GoogleChromeLabs/critters/compare/3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c...0.0.20) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c...0.0.20) ### [`v0.0.19`](https://github.com/GoogleChromeLabs/critters/compare/bcce3103f9e754cd8c3d8b1681f7e1cf6e536282...3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/bcce3103f9e754cd8c3d8b1681f7e1cf6e536282...3b3ea7b1ad8ca4d5e40cdf793aecc1b4dcaa5e1c) ### [`v0.0.18`](https://github.com/GoogleChromeLabs/critters/compare/1f8a941a069cfeb68450d33a42187c5398496fd7...bcce3103f9e754cd8c3d8b1681f7e1cf6e536282) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/1f8a941a069cfeb68450d33a42187c5398496fd7...bcce3103f9e754cd8c3d8b1681f7e1cf6e536282) ### [`v0.0.17`](https://github.com/GoogleChromeLabs/critters/blob/HEAD/CHANGELOG.md#v0017) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.16...1f8a941a069cfeb68450d33a42187c5398496fd7) - Updated the HTML parser from parse5 to htmlparser2 - Implemented caching to improve speed of matching class and id based selectors - Added option `includeSelectors` - Added option `reduceInlineStyles` Feature Include/Exclude CSS rules via comments in CSS Feature Adding Critters containers. Wrap the HTML contents in a `data-critters-container` container to indicate above the fold HTML. ### [`v0.0.16`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.16) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.15...critters-0.0.16) #### What's Changed - Add support for `:where` selector by [@​jeripeierSBB](https://github.com/jeripeierSBB) in [https://github.com/GoogleChromeLabs/critters/pull/93](https://github.com/GoogleChromeLabs/critters/pull/93) - Fix inlining of `-webkit-keyframes` (often generated by scss) by [@​JessicaSachs](https://github.com/JessicaSachs) in [https://github.com/GoogleChromeLabs/critters/pull/96](https://github.com/GoogleChromeLabs/critters/pull/96) (see [#​86](https://github.com/GoogleChromeLabs/critters/issues/86)) - Fix fs import breaking in ESM builds by [@​developit](https://github.com/developit) in [https://github.com/GoogleChromeLabs/critters/pull/97](https://github.com/GoogleChromeLabs/critters/pull/97) - Document `preload:false` option by [@​kurtextrem](https://github.com/kurtextrem) in [https://github.com/GoogleChromeLabs/critters/pull/95](https://github.com/GoogleChromeLabs/critters/pull/95) #### New Contributors - [@​JessicaSachs](https://github.com/JessicaSachs) made their first contribution in [https://github.com/GoogleChromeLabs/critters/pull/96](https://github.com/GoogleChromeLabs/critters/pull/96) - [@​kurtextrem](https://github.com/kurtextrem) made their first contribution in [https://github.com/GoogleChromeLabs/critters/pull/95](https://github.com/GoogleChromeLabs/critters/pull/95) - [@​jeripeierSBB](https://github.com/jeripeierSBB) made their first contribution in [https://github.com/GoogleChromeLabs/critters/pull/93](https://github.com/GoogleChromeLabs/critters/pull/93) **Full Changelog**: GoogleChromeLabs/critters@critters-0.0.15...critters-0.0.16 ### [`v0.0.15`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.15): critters 0.0.15 [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.14...critters-0.0.15) - Bugfix: add missing getter for `document.head` ([#​87](https://github.com/GoogleChromeLabs/critters/issues/87), thanks [@​rschristian](https://github.com/rschristian)!) ### [`v0.0.14`](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.13...critters-0.0.14) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.13...critters-0.0.14) ### [`v0.0.13`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.13) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/critters-0.0.12...critters-0.0.13) This fixes a bug in `[email protected]` where HTTP (as opposed to HTTPS) remote stylesheets were not skipped (thanks [@​alan-agius4](https://github.com/alan-agius4) - [#​83](https://github.com/GoogleChromeLabs/critters/issues/83)) **Full Changelog**: GoogleChromeLabs/critters@critters-0.0.12...critters-0.0.13 ### [`v0.0.12`](https://github.com/GoogleChromeLabs/critters/releases/tag/critters-0.0.12): Critters 0.0.12 #### What's Changed - Update parser to postcss by [@​janicklas-ralph](https://github.com/janicklas-ralph) in [https://github.com/GoogleChromeLabs/critters/pull/80](https://github.com/GoogleChromeLabs/critters/pull/80) - fix: update css-select to version 4 by [@​alan-agius4](https://github.com/alan-agius4) in [https://github.com/GoogleChromeLabs/critters/pull/82](https://github.com/GoogleChromeLabs/critters/pull/82) - fix: skip processing of remote stylesheets by [@​alan-agius4](https://github.com/alan-agius4) in [https://github.com/GoogleChromeLabs/critters/pull/75](https://github.com/GoogleChromeLabs/critters/pull/75) - Improve TypeScript typings by [@​developit](https://github.com/developit) in [https://github.com/GoogleChromeLabs/critters/pull/76](https://github.com/GoogleChromeLabs/critters/pull/76) - Add swap-high preload mode by [@​developit](https://github.com/developit) in [https://github.com/GoogleChromeLabs/critters/pull/56](https://github.com/GoogleChromeLabs/critters/pull/56) **Full Changelog**: GoogleChromeLabs/critters@57c4b40...critters-0.0.12 ### [`v0.0.10`](https://github.com/GoogleChromeLabs/critters/compare/e9a687265cd003fcbf27e7802d7b8c72168c8a14...1f23cb5b488effe0f782cc6855013fdaec38924c) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/e9a687265cd003fcbf27e7802d7b8c72168c8a14...1f23cb5b488effe0f782cc6855013fdaec38924c) ### [`v0.0.9`](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...e9a687265cd003fcbf27e7802d7b8c72168c8a14) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...e9a687265cd003fcbf27e7802d7b8c72168c8a14) ### [`v0.0.8`](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...0524b2e297eb995238b29cad01fadd49524d98bd) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/0524b2e297eb995238b29cad01fadd49524d98bd...0524b2e297eb995238b29cad01fadd49524d98bd) ### [`v0.0.7`](https://github.com/GoogleChromeLabs/critters/compare/99d5070b58e5edc861f5ac6cdc8fc15223a04bfc...0524b2e297eb995238b29cad01fadd49524d98bd) [Compare Source](https://github.com/GoogleChromeLabs/critters/compare/99d5070b58e5edc861f5ac6cdc8fc15223a04bfc...0524b2e297eb995238b29cad01fadd49524d98bd) </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/X-oss-byte/Nextjs).
We've been getting some issues about the newer CSS rules not being processed. Updating the CSS parser to use the postcss parser, which has better support and actively maintained