diff --git a/apps/ssr-tests/test/test.js b/apps/ssr-tests/test/test.js
index 5fc7e4beba1d62..658d96e04cd38d 100644
--- a/apps/ssr-tests/test/test.js
+++ b/apps/ssr-tests/test/test.js
@@ -46,12 +46,6 @@ describe('Utilities', () => {
       assert.equal(library.getDocument(), undefined);
     });
   });
-
-  describe('canUseDOM', () => {
-    it('returns false in server environment', () => {
-      assert.equal(library.canUseDOM(), false);
-    });
-  });
 });
 
 function testRender(componentName, component) {
@@ -62,7 +56,7 @@ function testRender(componentName, component) {
       ReactDOMServer.renderToString(elem);
       done();
     } catch (e) {
-      done(e);
+      done(new Error(e));
     }
   });
 }
diff --git a/change/@fluentui-react-095e69ed-d501-445c-aefa-a2f2ec7f8084.json b/change/@fluentui-react-095e69ed-d501-445c-aefa-a2f2ec7f8084.json
new file mode 100644
index 00000000000000..02231c2ebc67d9
--- /dev/null
+++ b/change/@fluentui-react-095e69ed-d501-445c-aefa-a2f2ec7f8084.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "revert: rollback List rendering change",
+  "packageName": "@fluentui/react",
+  "email": "seanmonahan@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap b/packages/react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
index 2f907bb6650eb5..77aaf42a066394 100644
--- a/packages/react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
+++ b/packages/react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
@@ -8114,7 +8114,7 @@ exports[`DetailsList renders List with hidden checkboxes correctly 1`] = `
                                       flex-shrink: 0;
                                     }
                                 data-automationid="DetailsRow"
-                                data-focuszone-id="FocusZone7"
+                                data-focuszone-id="FocusZone9"
                                 data-is-focusable={true}
                                 data-item-index={0}
                                 data-selection-index={0}
@@ -8396,7 +8396,7 @@ exports[`DetailsList renders List with hidden checkboxes correctly 1`] = `
                                       flex-shrink: 0;
                                     }
                                 data-automationid="DetailsRow"
-                                data-focuszone-id="FocusZone9"
+                                data-focuszone-id="FocusZone11"
                                 data-is-focusable={true}
                                 data-item-index={1}
                                 data-selection-index={1}
@@ -8622,7 +8622,7 @@ exports[`DetailsList renders List with hidden checkboxes correctly 1`] = `
                     >
                       <div
                         aria-expanded={true}
-                        aria-labelledby="GroupHeader11"
+                        aria-labelledby="GroupHeader7"
                         aria-rowindex={5}
                         className=
                             ms-GroupHeader
@@ -8814,7 +8814,7 @@ exports[`DetailsList renders List with hidden checkboxes correctly 1`] = `
                                   white-space: nowrap;
                                 }
                             data-selection-invoke={true}
-                            id="GroupHeader11"
+                            id="GroupHeader7"
                             onClick={[Function]}
                             role="gridcell"
                           >
@@ -8841,7 +8841,7 @@ exports[`DetailsList renders List with hidden checkboxes correctly 1`] = `
                       <div
                         aria-label="Group 1"
                         className="ms-List"
-                        id="GroupedListSection10"
+                        id="GroupedListSection6"
                         role="rowgroup"
                       >
                         <div
diff --git a/packages/react/src/components/List/List.tsx b/packages/react/src/components/List/List.tsx
index d5d3979b78f14b..c4bad1bb229957 100644
--- a/packages/react/src/components/List/List.tsx
+++ b/packages/react/src/components/List/List.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   Async,
   EventGroup,
-  canUseDOM,
   css,
   divProperties,
   findIndex,
@@ -120,6 +119,7 @@ export class List<T = any> extends React.Component<IListProps<T>, IListState<T>>
   };
   private _focusedIndex: number;
   private _scrollElement?: HTMLElement;
+  private _hasCompletedFirstRender: boolean;
 
   // surface rect relative to window
   private _surfaceRect: IRectangle | undefined;
@@ -336,18 +336,9 @@ export class List<T = any> extends React.Component<IListProps<T>, IListState<T>>
   }
 
   public componentDidMount(): void {
-    this.setState({ hasMounted: true });
     this._scrollElement = findScrollableParent(this._root.current) as HTMLElement;
     this._scrollTop = 0;
-
-    if (!this.props.getPageHeight) {
-      const heightsChanged = this._updatePageMeasurements(this.state.pages!);
-      if (heightsChanged) {
-        this._materializedRect = null;
-        this.setState(this._updatePages(this.props, this.state));
-      }
-    }
-
+    this.setState(this._updatePages(this.props, this.state));
     this._measureVersion++;
 
     this._events.on(window, 'resize', this._onAsyncResize);
@@ -372,9 +363,15 @@ export class List<T = any> extends React.Component<IListProps<T>, IListState<T>>
         // If measured version is invalid since we've updated the DOM
         const heightsChanged = this._updatePageMeasurements(finalState.pages!);
 
+        // On first render, we should re-measure so that we don't get a visual glitch.
         if (heightsChanged) {
           this._materializedRect = null;
-          this._onAsyncScroll();
+          if (!this._hasCompletedFirstRender) {
+            this._hasCompletedFirstRender = true;
+            this.setState(this._updatePages(finalProps, finalState));
+          } else {
+            this._onAsyncScroll();
+          }
         } else {
           // Enqueue an idle bump.
           this._onAsyncIdle();
@@ -494,12 +491,8 @@ export class List<T = any> extends React.Component<IListProps<T>, IListState<T>>
       nextProps.items !== this.props.items ||
       nextProps.renderCount !== this.props.renderCount ||
       nextProps.startIndex !== this.props.startIndex ||
-      nextProps.version !== this.props.version ||
-      !previousState.hasMounted
+      nextProps.version !== this.props.version
     ) {
-      if (!canUseDOM()) {
-        return previousState;
-      }
       // We have received new items so we want to make sure that initially we only render a single window to
       // fill the currently visible rect, and then later render additional windows.
       this._resetRequiredWindows();