LibWeb: Don't compute full style for ::before/::after unless matched

Before this patch, we would build full computed style for these pseudo
elements, for every DOM element, even if no ::before/::after selector
actually matched.

This was a colossal waste of time, and we can also just not do that.
Instead, just abort pseudo element style resolution early if no relevant
selectors matched. :^)

Userland/Libraries/LibWeb/CSS/StyleComputer.cpp

@@ -867,7 +867,7 @@ static ErrorOr<void> cascade_custom_properties(DOM::Element& element, Vector<Mat
 }
 
 // https://www.w3.org/TR/css-cascade/#cascading
-ErrorOr<void> StyleComputer::compute_cascaded_values(StyleProperties& style, DOM::Element& element, Optional<CSS::Selector::PseudoElement> pseudo_element) const
+ErrorOr<void> StyleComputer::compute_cascaded_values(StyleProperties& style, DOM::Element& element, Optional<CSS::Selector::PseudoElement> pseudo_element, bool& did_match_any_pseudo_element_rules) const
 {
     // First, we collect all the CSS rules whose selectors match `element`:
     MatchingRuleSet matching_rule_set;
@@ -876,6 +876,11 @@ ErrorOr<void> StyleComputer::compute_cascaded_values(StyleProperties& style, DOM
     matching_rule_set.author_rules = collect_matching_rules(element, CascadeOrigin::Author, pseudo_element);
     sort_matching_rules(matching_rule_set.author_rules);
 
+    if (pseudo_element.has_value() && matching_rule_set.author_rules.is_empty() && matching_rule_set.user_agent_rules.is_empty()) {
+        did_match_any_pseudo_element_rules = false;
+        return {};
+    }
+
     // Then we resolve all the CSS custom properties ("variables") for this element:
     // FIXME: Look into how custom properties should interact with pseudo elements and support that properly.
     if (!pseudo_element.has_value())
@@ -1400,12 +1405,27 @@ NonnullRefPtr<StyleProperties> StyleComputer::create_document_style() const
 }
 
 ErrorOr<NonnullRefPtr<StyleProperties>> StyleComputer::compute_style(DOM::Element& element, Optional<CSS::Selector::PseudoElement> pseudo_element) const
+{
+    auto style = TRY(compute_style_impl(element, move(pseudo_element), ComputeStyleMode::Normal));
+    return style.release_nonnull();
+}
+
+ErrorOr<RefPtr<StyleProperties>> StyleComputer::compute_pseudo_element_style_if_needed(DOM::Element& element, Optional<CSS::Selector::PseudoElement> pseudo_element) const
+{
+    return compute_style_impl(element, move(pseudo_element), ComputeStyleMode::CreatePseudoElementStyleIfNeeded);
+}
+
+ErrorOr<RefPtr<StyleProperties>> StyleComputer::compute_style_impl(DOM::Element& element, Optional<CSS::Selector::PseudoElement> pseudo_element, ComputeStyleMode mode) const
 {
     build_rule_cache_if_needed();
 
     auto style = StyleProperties::create();
     // 1. Perform the cascade. This produces the "specified style"
-    TRY(compute_cascaded_values(style, element, pseudo_element));
+    bool did_match_any_pseudo_element_rules = false;
+    TRY(compute_cascaded_values(style, element, pseudo_element, did_match_any_pseudo_element_rules));
+
+    if (mode == ComputeStyleMode::CreatePseudoElementStyleIfNeeded && !did_match_any_pseudo_element_rules)
+        return nullptr;
 
     // 2. Compute the font, since that may be needed for font-relative CSS units
     compute_font(style, &element, pseudo_element);

Userland/Libraries/LibWeb/CSS/StyleComputer.h

@@ -56,7 +56,9 @@ public:
     DOM::Document const& document() const { return m_document; }
 
     NonnullRefPtr<StyleProperties> create_document_style() const;
+
     ErrorOr<NonnullRefPtr<StyleProperties>> compute_style(DOM::Element&, Optional<CSS::Selector::PseudoElement> = {}) const;
+    ErrorOr<RefPtr<StyleProperties>> compute_pseudo_element_style_if_needed(DOM::Element&, Optional<CSS::Selector::PseudoElement>) const;
 
     // https://www.w3.org/TR/css-cascade/#origin
     enum class CascadeOrigin {
@@ -78,7 +80,13 @@ public:
     void load_fonts_from_sheet(CSSStyleSheet const&);
 
 private:
-    ErrorOr<void> compute_cascaded_values(StyleProperties&, DOM::Element&, Optional<CSS::Selector::PseudoElement>) const;
+    enum class ComputeStyleMode {
+        Normal,
+        CreatePseudoElementStyleIfNeeded,
+    };
+
+    ErrorOr<RefPtr<StyleProperties>> compute_style_impl(DOM::Element&, Optional<CSS::Selector::PseudoElement>, ComputeStyleMode) const;
+    ErrorOr<void> compute_cascaded_values(StyleProperties&, DOM::Element&, Optional<CSS::Selector::PseudoElement>, bool& did_match_any_pseudo_element_rules) const;
     void compute_font(StyleProperties&, DOM::Element const*, Optional<CSS::Selector::PseudoElement>) const;
     void compute_defaulted_values(StyleProperties&, DOM::Element const*, Optional<CSS::Selector::PseudoElement>) const;
     void absolutize_values(StyleProperties&, DOM::Element const*, Optional<CSS::Selector::PseudoElement>) const;

Userland/Libraries/LibWeb/Layout/TreeBuilder.cpp

@@ -154,7 +154,10 @@ ErrorOr<void> TreeBuilder::create_pseudo_element_if_needed(DOM::Element& element
     auto& document = element.document();
     auto& style_computer = document.style_computer();
 
-    auto pseudo_element_style = TRY(style_computer.compute_style(element, pseudo_element));
+    auto pseudo_element_style = TRY(style_computer.compute_pseudo_element_style_if_needed(element, pseudo_element));
+    if (!pseudo_element_style)
+        return {};
+
     auto pseudo_element_content = pseudo_element_style->content();
     auto pseudo_element_display = pseudo_element_style->display();
     // ::before and ::after only exist if they have content. `content: normal` computes to `none` for them.
@@ -164,7 +167,7 @@ ErrorOr<void> TreeBuilder::create_pseudo_element_if_needed(DOM::Element& element
         || pseudo_element_content.type == CSS::ContentData::Type::None)
         return {};
 
-    auto pseudo_element_node = DOM::Element::create_layout_node_for_display_type(document, pseudo_element_display, pseudo_element_style, nullptr);
+    auto pseudo_element_node = DOM::Element::create_layout_node_for_display_type(document, pseudo_element_display, *pseudo_element_style, nullptr);
     if (!pseudo_element_node)
         return {};