diff --git a/CHANGELOG.md b/CHANGELOG.md
index 988394f47..9505a9e04 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 
 ### Fixed
 - [#806](https://github.com/plotly/dash-table/pull/806) Fix a bug where fixed rows a misaligned after navigating or editing cells [#803](https://github.com/plotly/dash-table/issues/803)
+- [#809](https://github.com/plotly/dash-table/pull/809) Fix a bug where a scrollbar flickers on table render [#801](https://github.com/plotly/dash-table/issues/801)
 
 ## [4.8.1] - 2020-06-19
 ### Fixed
diff --git a/src/core/browser/scrollbarWidth.ts b/src/core/browser/scrollbarWidth.ts
index 9390aef54..8de208597 100644
--- a/src/core/browser/scrollbarWidth.ts
+++ b/src/core/browser/scrollbarWidth.ts
@@ -1,4 +1,4 @@
-export default (): Promise<number> => {
+export default (target: HTMLElement): Promise<number> => {
     const parent = document.createElement('div');
     parent.style.position = 'absolute';
     parent.style.visibility = 'hidden';
@@ -11,13 +11,13 @@ export default (): Promise<number> => {
     child.style.height = '100px';
 
     parent.appendChild(child);
-    document.body.appendChild(parent);
+    target.appendChild(parent);
 
     return new Promise<number>(resolve => {
         setTimeout(() => {
             const width = child.clientWidth - parent.clientWidth;
 
-            document.body.removeChild(parent);
+            target.removeChild(parent);
             resolve(width);
         }, 0);
     });
diff --git a/src/dash-table/components/ControlledTable/index.tsx b/src/dash-table/components/ControlledTable/index.tsx
index 2c950a175..57d168646 100644
--- a/src/dash-table/components/ControlledTable/index.tsx
+++ b/src/dash-table/components/ControlledTable/index.tsx
@@ -308,6 +308,8 @@ export default class ControlledTable extends PureComponent<ControlledTableProps>
 
     forceHandleResize = () => this.handleResize();
 
+    getScrollbarWidthOnce = R.once(getScrollbarWidth);
+
     handleResizeIf = memoizeOne((..._: any[]) => {
         const { r0c0, r0c1, r1c0, r1c1 } = this.refs as Refs;
 
@@ -339,15 +341,13 @@ export default class ControlledTable extends PureComponent<ControlledTableProps>
             setState
         } = this.props;
 
-        const { r1c1 } = this.refs as Refs;
+        const { r1, r1c1 } = this.refs as Refs;
 
         if (!this.isDisplayed(r1c1)) {
             return;
         }
 
-        this.updateStylesheet();
-
-        getScrollbarWidth().then((scrollbarWidth: number) => setState({ scrollbarWidth }));
+        this.getScrollbarWidthOnce(r1).then((scrollbarWidth: number) => setState({ scrollbarWidth }));
 
         const { r0c0, r0c1, r1c0 } = this.refs as Refs;
 
@@ -395,7 +395,6 @@ export default class ControlledTable extends PureComponent<ControlledTableProps>
             const firstTdBounds = firstVisibleTd.getBoundingClientRect();
 
             const width = firstTdBounds.left - r1c1FragmentBounds.left;
-            const { r1 } = this.refs as Refs;
 
             r0c1.style.marginLeft = `-${width + r1.scrollLeft}px`;
             r1c1.style.marginLeft = `-${width}px`;