Performance improvements #2171

There is no need in re-compiling tailwind or building expensive lookupt tables when it turns out that we don't even need it. We have a small overhead by walking the tree to check if `@apply` exists. However this outweighs the slowness of re-generating tailwind + expensive lookup tables.

We were re-creating the classNameParser inside the loop. Since that code is all pretty pure we can hoist it so that we don't have to recreate that parser all the time.

Currently we will walk the tree for every single rule to see if an `@apply` exists somewhere in that tree. However we don't use the `containsApply` anymore so this is a quick win!

We create a big lookup table so that we can lookup the nodes by its utilityName. This is used inside the recursive `@apply` code. This big lookup table will clone every single rule and put it in, however we don't need to clone everything! We are only interested in the rules that have been actually applied. This way we make the cloning of the rule lazy and only when we use this exact rule. There is an additional performace "issue" though: When we read the same rule multiple times, it will clone every time you read from that object. We could add additional memoization stuff, but so far it doesn't seem to be the bottleneck. Therefore I've added a perf todo just to leave a mark when this becomes the bottleneck.

We alreayd know that we have an `@apply` otherwise we would not have called that function in the first place. Moving to a `do {} while ()` allows us to skip 1 call to `hasAtRule(css, 'apply')`. Which is nice because that skips a possible full traversal.

We don't require this reversed map since we can already sort by the index on the node directly. Therefore this can be dropped.

No need to re-create the selector parser in the loop for each selector.

We used to clone the full tree and then remove all the children, this was a bit too slow so therefore we will now create a new tree based on the old information.

Naming is hard so I took this name from the React hook 😎 Also use this useMemoy utility to make sure that the extractUtilityNames is cached. There is no need to re-compute the utility names all the time.

No need to re-create the selectorParser in every call.

Otherwise every time we read this value it will be re-cloned

Same idea, but prepend will internally reverse all nodes.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Performance improvements #2171

Performance improvements #2171

Commits on Aug 18, 2020