From 990bad9d1e4c164dead3ef0089c8cd555eb349a7 Mon Sep 17 00:00:00 2001
From: Mathias Bynens <mathias@qiwi.be>
Date: Wed, 14 Oct 2020 09:00:58 +0200
Subject: [PATCH 1/3] Improve rendering performance by chunking layout

This patch adds `content-visibility: auto` as described here:

- https://web.dev/content-visibility/
- https://www.youtube.com/watch?v=FFA-v-CIxJQ

Demo:
- Before: https://mathiasbynens.github.io/ecma262-layout-chunking/before.html
- After: https://mathiasbynens.github.io/ecma262-layout-chunking/after.html
---
 css/elements.css | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/css/elements.css b/css/elements.css
index de9bbfbb..5bdd0e0a 100644
--- a/css/elements.css
+++ b/css/elements.css
@@ -16,6 +16,11 @@ body {
   overflow: hidden;
 }
 
+#spec-container > emu-clause {
+  content-visibility: auto;
+  contain-intrinsic-size: 1px 1000px;
+}
+
 body.oldtoc {
   margin: 0 auto;
 }
@@ -167,7 +172,7 @@ emu-note > div.note-contents > p:last-of-type {
 
 emu-table td code {
   white-space: normal;
-} 
+}
 
 emu-figure {
   display: block;
@@ -470,7 +475,7 @@ emu-production > ins, emu-production > del,
 emu-grammar > ins, emu-grammar > del {
   display: block;
 }
-emu-rhs > ins, emu-rhs > del { 
+emu-rhs > ins, emu-rhs > del {
   display: inline;
 }
 
@@ -699,10 +704,10 @@ tr.del > td {
   flex-grow: 0;
   flex-shrink: 0;
   width: 100%;
-  
+
   display: flex;
   flex-direction: column;
-  
+
   max-height: 300px;
 }
 
@@ -940,6 +945,6 @@ li.menu-search-result-term:before {
 
 @media print {
   #menu-toggle {
-    display: none; 
+    display: none;
   }
 }

From e9906b39fec3e8d3f5311ad7d0a61665d86a8520 Mon Sep 17 00:00:00 2001
From: Mathias Bynens <mathias@qiwi.be>
Date: Wed, 14 Oct 2020 17:49:04 +0200
Subject: [PATCH 2/3] Add #menu-spacer { overflow-anchor: none; }

As described in [1], this prevents a flickering issue.

[1]: https://bugs.chromium.org/p/chromium/issues/detail?id=1138233#c3
---
 css/elements.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/css/elements.css b/css/elements.css
index 5bdd0e0a..e2376dac 100644
--- a/css/elements.css
+++ b/css/elements.css
@@ -539,6 +539,7 @@ tr.del > td {
   max-width: 500px;
   flex-grow: 0;
   flex-shrink: 0;
+  overflow-anchor: none;
 }
 
 #menu a {

From 790ca20417d6dc9cd922f39cbb4b0a1d99a506e1 Mon Sep 17 00:00:00 2001
From: Mathias Bynens <mathias@qiwi.be>
Date: Thu, 15 Oct 2020 07:56:45 +0200
Subject: [PATCH 3/3] Support ecma-402

---
 css/elements.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/css/elements.css b/css/elements.css
index e2376dac..8d6fd1bf 100644
--- a/css/elements.css
+++ b/css/elements.css
@@ -16,7 +16,7 @@ body {
   overflow: hidden;
 }
 
-#spec-container > emu-clause {
+#spec-container > emu-clause, #spec-container > emu-import > emu-clause {
   content-visibility: auto;
   contain-intrinsic-size: 1px 1000px;
 }