Improve User Exprience for Blame page

This is a follow-up on: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/67050

Initial rendering performance optimization using content-visiblity introduced issues onto Blame page scrolling.
This is a fix for those issues, which uses content-visibility only for the elements with a known height.

Changelog: other
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/73173

app/assets/stylesheets/framework/files.scss

@@ -146,13 +146,6 @@
      *  Blame file
      */
     &.blame {
-      //
-      // IMPORTANT PERFORMANCE OPTIMIZATION
-      //
-      // When viewinng a blame with many commits a lot of content is rendered on the page.
-      // The line below ensures that we only render what is visible to the user, thus reducing TBT in the browser.
-      content-visibility: auto;
-
       table {
         border: 0;
         margin: 0;
@@ -167,12 +160,6 @@
       }
 
       td {
-        //
-        // IMPORTANT PERFORMANCE OPTIMIZATION
-        //
-        // When viewinng a blame with many commits a lot of content is rendered on the page.
-        // The line below ensures that we only render what is visible to the user, thus reducing TBT in the browser.
-        content-visibility: auto;
         border-top: 0;
         border-bottom: 0;
 
@@ -235,6 +222,21 @@
           color: $gray-900;
         }
       }
+
+      //
+      // IMPORTANT PERFORMANCE OPTIMIZATION
+      //
+      // When viewinng a blame with many commits a lot of content is rendered on the page.
+      // Two selectors below ensure that we only render what is visible to the user, thus reducing TBT in the browser.
+      .commit {
+        content-visibility: auto;
+        contain-intrinsic-size: 1px 3em;
+      }
+
+      code .line {
+        content-visibility: auto;
+        contain-intrinsic-size: 1px 1.1875rem;
+      }
     }
 
     &.logs {