diff --git a/src/React/Basic/DOM.js b/src/React/Basic/DOM.js
index de26467..257f887 100644
--- a/src/React/Basic/DOM.js
+++ b/src/React/Basic/DOM.js
@@ -19,3 +19,7 @@ export function unmount(node) {
 export function createPortal(jsx) {
   return (node) => ReactDOM.createPortal(jsx, node);
 }
+
+export function flushSync(callback) {
+  return () => ReactDOM.flushSync(callback);
+}
diff --git a/src/React/Basic/DOM.purs b/src/React/Basic/DOM.purs
index fc20ffb..0acb058 100644
--- a/src/React/Basic/DOM.purs
+++ b/src/React/Basic/DOM.purs
@@ -13,6 +13,7 @@ module React.Basic.DOM
   , unmount
   , createPortal
   , text
+  , flushSync
   , module Generated
   ) where
 
@@ -100,4 +101,15 @@ foreign import createPortal :: JSX -> Element -> JSX
 
 -- | Create a text node.
 text :: String -> JSX
-text = unsafeCoerce
\ No newline at end of file
+text = unsafeCoerce
+
+-- | `flushSync` lets you force React to flush any updates inside the provided
+-- | callback synchronously. This ensures that the DOM is updated immediately.
+-- | 
+-- | ```purs
+-- | let
+-- |   handleNewChatMessage msg = do
+-- |     flushSync (setMessages (_ <> [msg]))
+-- |     scrollToLastMessage
+-- | ```
+foreign import flushSync :: forall a. Effect a -> Effect a