potential performance improvements

frontend/src/components/ChannelView.svelte

@@ -17,6 +17,7 @@
         flex-direction: column;
         width: 100%;
         height: 100%;
+        contain: content;
     }
 </style>
 

frontend/src/components/MessageInput.svelte

@@ -96,6 +96,7 @@
         width: 100%;
         padding: var(--space-norm);
         padding-bottom: 0;
+        contain: content;
     }
     
     .message-input-container.small {
@@ -118,6 +119,7 @@
         font-size: inherit;
         line-height: inherit;
         resize: none;
+        contain: strict;
     }
 
     .message-input:focus-visible {

frontend/src/styles/global.css

@@ -8,6 +8,7 @@
 	font-stretch: normal;
 	font-style: normal;
 	src: url("/assets/woff2/iosevka-waffle-regular.woff2") format("woff2");
+	font-display: fallback;
 }
 
 @font-face {
@@ -17,6 +18,7 @@
 	font-stretch: normal;
 	font-style: normal;
 	src: url("/assets/woff2/iosevka-waffle-bold.woff2") format("woff2");
+	font-display: fallback;
 }
 
 @font-face {
@@ -26,6 +28,7 @@
 	font-stretch: normal;
 	font-style: normal;
 	src: url("/assets/woff2/iosevka-waffle-light.woff2") format("woff2");
+	font-display: fallback;
 }
 
 /* top-level */
@@ -183,11 +186,13 @@ body {
 	z-index: 15;
 	background-color: rgba(0, 0, 0, 0.4);
 	backdrop-filter: blur(1.5px);
+	contain: strict;
 }
 
 .modal-backdrop-opaque {
 	background-color: var(--background-color-1);
 	backdrop-filter: unset;
+	contain: strict;
 }
 
 .modal {
@@ -195,6 +200,7 @@ body {
 	flex-direction: column;
 	background-color: var(--background-color-1);
 	border-radius: var(--radius-lg);
+	contain: content;
 }
 
 .modal-header {
@@ -417,6 +423,7 @@ body {
 	height: 100%;
 	min-width: 255px;
 	max-width: 255px;
+	contain: content;
 }
 
 @media screen and (max-width: 768px) {
@@ -433,6 +440,7 @@ body {
 	padding: var(--space-xs);
 	overflow-x: hidden;
 	overflow-y: auto;
+	contain: strict;
 }
 
 .sidebar-button {