LibWeb: Cache CSS rules in buckets to reduce number of rules checked

This patch introduces the StyleComputer::RuleCache, which divides all of
our (author) CSS rules into buckets.

Currently, there are two buckets:
- Rules where a specific class must be present.
- All other rules.

This allows us to check a significantly smaller set of rules for each
element, since we can skip over any rule that requires a class attribute
not present on the element.

This takes the typical numer of rules tested per element on Discord from
~16000 to ~550. :^)

We can definitely improve the cache invalidation. It currently happens
too often due to media queries. And we also need to make sure we
invalidate when mutating style through CSSOM APIs.

1 files changed, 4 insertions, 0 deletions

diff --git a/Userland/Libraries/LibWeb/DOM/Document.cpp b/Userland/Libraries/LibWeb/DOM/Document.cpp
index e9423c0bac..a0ef87151f 100644
--- a/Userland/Libraries/LibWeb/DOM/Document.cpp
+++ b/Userland/Libraries/LibWeb/DOM/Document.cpp
@@ -1147,6 +1147,10 @@ void Document::evaluate_media_queries_and_report_changes()
     for (auto& style_sheet : style_sheets().sheets()) {
         style_sheet.evaluate_media_queries(window());
     }
+
+    // FIXME: This invalidates too often!
+    //        We should only invalidate when one or more @media rules changes evaluation status.
+    style_computer().invalidate_rule_cache();
 }
 
 NonnullRefPtr<DOMImplementation> Document::implementation() const