Re-evaluate @media when the viewport changes

The media context was built once, while generating the CSS tree, so a resize
never re-ran the cascade: a `@media (min-width: …)` rule picked at load time
stayed picked no matter how the window was resized afterwards.

HtmlContainerInt now keeps the html and base stylesheet it was given, and
PerformLayout re-runs the cascade when the current viewport would evaluate a
@media condition differently than the one the cascade was computed against.

The test is deliberately narrow, since PerformLayout runs on every layout pass.
CssData collects the distinct @media chains its rules are nested under while
indexing (one entry per @media block), and MediaOutcomeChanged evaluates just
those against the old and new device. A document with no viewport-dependent
@media - the common case - costs one empty loop, and a resize that stays within
the same breakpoint costs a handful of comparisons and rebuilds nothing.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

Author: 2 people

Source/HtmlRenderer/Core/CssData.cs

@@ -124,11 +124,62 @@ public IndexedRule(IStyleRule rule, bool isUserAgent, int documentOrder, MediaLi
             public MediaList[] EnclosingMedia { get; }
         }
 
+        private List<MediaList[]> _mediaConditions;
         private Dictionary<string, List<IndexedRule>> _tagIndex;
         private Dictionary<string, List<IndexedRule>> _classIndex;
         private Dictionary<string, List<IndexedRule>> _idIndex;
         private List<IndexedRule> _universalRules;
 
+        /// <summary>
+        /// The distinct <c>@media</c> chains any indexed rule is nested under. Small (one entry per
+        /// distinct <c>@media</c> block), and only used to test whether a change of device would change
+        /// which rules apply - see <see cref="MediaOutcomeChanged"/>.
+        /// </summary>
+        private static List<MediaList[]> CollectMediaConditions(
+            Dictionary<string, List<IndexedRule>> tagIndex,
+            Dictionary<string, List<IndexedRule>> classIndex,
+            Dictionary<string, List<IndexedRule>> idIndex,
+            List<IndexedRule> universal)
+        {
+            var conditions = new List<MediaList[]>();
+
+            Action<IEnumerable<IndexedRule>> collect = rules =>
+            {
+                foreach (var indexed in rules)
+                {
+                    if (indexed.EnclosingMedia == null) continue;
+                    if (conditions.Contains(indexed.EnclosingMedia)) continue;   // reference compare: one array per block
+                    conditions.Add(indexed.EnclosingMedia);
+                }
+            };
+
+            foreach (var bucket in tagIndex.Values) collect(bucket);
+            foreach (var bucket in classIndex.Values) collect(bucket);
+            foreach (var bucket in idIndex.Values) collect(bucket);
+            collect(universal);
+
+            return conditions;
+        }
+
+        /// <summary>
+        /// Whether moving from <paramref name="before"/> to <paramref name="after"/> changes the outcome
+        /// of any <c>@media</c> condition in these stylesheets - i.e. whether the cascade needs to be
+        /// re-run. False for a resize that doesn't cross any breakpoint, and for documents with no
+        /// viewport-dependent <c>@media</c> at all (the common case), so the caller can skip the work.
+        /// </summary>
+        internal bool MediaOutcomeChanged(MediaQueryContext before, MediaQueryContext after)
+        {
+            EnsureIndex();
+
+            foreach (var condition in _mediaConditions)
+            {
+                if (MediaQueryMatcher.Matches(condition, before) != MediaQueryMatcher.Matches(condition, after))
+                    return true;
+            }
+
+            return false;
+        }
+
         /// <summary>
         /// Every style rule in a rule list, in document order, descending into <c>@media</c> and
         /// <c>@layer</c> blocks and into CSS-Nesting child rules. <see cref="Stylesheet.StyleRules"/>
@@ -180,6 +231,7 @@ private void EnsureIndex()
             _tagIndex = tagIndex;
             _classIndex = classIndex;
             _idIndex = idIndex;
+            _mediaConditions = CollectMediaConditions(tagIndex, classIndex, idIndex, universal);
             _universalRules = universal;
         }
 

Source/HtmlRenderer/Core/HtmlContainerInt.cs

@@ -126,6 +126,19 @@ public sealed class HtmlContainerInt : IDisposable
         /// </summary>
         private CssData _cssData;
 
+        /// <summary>
+        /// The html and base stylesheet last given to <see cref="SetHtml"/>, kept so the cascade can be
+        /// re-run when a viewport change alters which <c>@media</c> rules apply.
+        /// </summary>
+        private string _htmlSource;
+
+        private CssData _baseCssData;
+
+        /// <summary>
+        /// The device the current cascade was computed against.
+        /// </summary>
+        private MediaQueryContext _cascadeMedia;
+
         /// <summary>
         /// Is content selection is enabled for the rendered html (default - true).<br/>
         /// If set to 'false' the rendered html will be static only with ability to click on links.
@@ -507,13 +520,17 @@ internal RColor SelectionBackColor
         public void SetHtml(string htmlSource, CssData baseCssData = null)
         {
             Clear();
+            _htmlSource = htmlSource;
+            _baseCssData = baseCssData;
+
             if (!string.IsNullOrEmpty(htmlSource))
             {
                 _loadComplete = false;
                 _cssData = baseCssData ?? _adapter.DefaultCssData;
 
                 DomParser parser = new DomParser(_cssParser);
                 _root = parser.GenerateCssTree(htmlSource, this, ref _cssData);
+                _cascadeMedia = MediaQueryContext.FromAdapter(_adapter, _maxSize.Width, _maxSize.Height);
                 if (_root != null)
                 {
                     _selectionHandler = new SelectionHandler(_root);
@@ -522,6 +539,23 @@ public void SetHtml(string htmlSource, CssData baseCssData = null)
             }
         }
 
+        /// <summary>
+        /// Re-runs the cascade if the viewport has changed in a way that changes which <c>@media</c>
+        /// rules apply - a resize crossing a <c>min-width</c> breakpoint, say. Nothing happens for a
+        /// document whose stylesheets have no viewport-dependent <c>@media</c> (the common case), or for
+        /// a resize that stays within the same breakpoint, so this costs one cheap condition test per
+        /// layout rather than a re-parse.
+        /// </summary>
+        private void RefreshMediaDependentCascade()
+        {
+            if (_root == null || string.IsNullOrEmpty(_htmlSource) || _cssData == null) return;
+
+            var media = MediaQueryContext.FromAdapter(_adapter, _maxSize.Width, _maxSize.Height);
+            if (!_cssData.MediaOutcomeChanged(_cascadeMedia, media)) return;
+
+            SetHtml(_htmlSource, _baseCssData);
+        }
+
         /// <summary>
         /// Clear the content of the HTML container releasing any resources used to render previously existing content.
         /// </summary>
@@ -632,6 +666,8 @@ public void PerformLayout(RGraphics g)
         {
             ArgChecker.AssertArgNotNull(g, "g");
 
+            RefreshMediaDependentCascade();
+
             _actualSize = RSize.Empty;
             if (_root != null)
             {