diff --git a/src/components/views/dialogs/ExportDialog.tsx b/src/components/views/dialogs/ExportDialog.tsx
index d82bc1efd8..64cac3364a 100644
--- a/src/components/views/dialogs/ExportDialog.tsx
+++ b/src/components/views/dialogs/ExportDialog.tsx
@@ -29,11 +29,11 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
     const [exportType, setExportType] = useState(exportTypes.TIMELINE);
     const [includeAttachments, setAttachments] = useState(false);
     const [isExporting, setExporting] = useState(false);
-    const [exportProgressText, setExportProgressText] = useState("");
     const [numberOfMessages, setNumberOfMessages] = useState<number>(100);
     const [sizeLimit, setSizeLimit] = useState<number | null>(8);
     const sizeLimitRef = useRef<Field>();
     const messageCountRef = useRef<Field>();
+    const exportProgressRef = useRef<HTMLParagraphElement>();
     const [displayCancel, setCancelWarning] = useState(false);
     const [exportCancelled, setExportCancelled] = useState(false);
     const [exportSuccessful, setExportSuccessful] = useState(false);
@@ -59,7 +59,7 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
                         room,
                         exportTypes[exportType],
                         exportOptions,
-                        setExportProgressText,
+                        exportProgressRef,
                     ),
                 );
                 break;
@@ -69,7 +69,7 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
                         room,
                         exportTypes[exportType],
                         exportOptions,
-                        setExportProgressText,
+                        exportProgressRef,
                     ),
                 );
                 break;
@@ -79,7 +79,7 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
                         room,
                         exportTypes[exportType],
                         exportOptions,
-                        setExportProgressText,
+                        exportProgressRef,
                     ),
                 );
                 break;
@@ -356,7 +356,7 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
                 onFinished={onFinished}
                 fixedWidth={true}
             >
-                <p> { exportProgressText } </p>
+                <p ref={exportProgressRef} />
                 <DialogButtons
                     primaryButton={_t("Cancel")}
                     primaryButtonClass="danger"
diff --git a/src/utils/exportUtils/Exporter.ts b/src/utils/exportUtils/Exporter.ts
index 3da058233d..d2b9df23e0 100644
--- a/src/utils/exportUtils/Exporter.ts
+++ b/src/utils/exportUtils/Exporter.ts
@@ -10,6 +10,7 @@ import { MatrixClient } from "matrix-js-sdk";
 import streamToZIP from "./ZipStream";
 import * as ponyfill from "web-streams-polyfill/ponyfill";
 import "web-streams-polyfill/ponyfill"; // to support streams API for older browsers
+import { MutableRefObject } from "react";
 
 type FileStream = {
     name: string;
@@ -27,7 +28,7 @@ export default abstract class Exporter {
         protected room: Room,
         protected exportType: exportTypes,
         protected exportOptions: exportOptions,
-        protected setProgressText: React.Dispatch<React.SetStateAction<string>>,
+        protected exportProgressRef: MutableRefObject<HTMLParagraphElement>,
     ) {
         this.cancelled = false;
         this.files = [];
@@ -43,7 +44,7 @@ export default abstract class Exporter {
 
     protected updateProgress(progress: string, log = true, show = true): void {
         if (log) console.log(progress);
-        if (show) this.setProgressText(progress);
+        if (show) this.exportProgressRef.current.innerText = progress;
     }
 
     protected addFile(filePath: string, blob: Blob): void {
diff --git a/src/utils/exportUtils/HtmlExport.tsx b/src/utils/exportUtils/HtmlExport.tsx
index fc963a27b8..51ca9877bf 100644
--- a/src/utils/exportUtils/HtmlExport.tsx
+++ b/src/utils/exportUtils/HtmlExport.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { MutableRefObject } from "react";
 import Exporter from "./Exporter";
 import { mediaFromMxc } from "../../customisations/Media";
 import { Room } from "matrix-js-sdk/src/models/room";
@@ -31,9 +31,9 @@ export default class HTMLExporter extends Exporter {
         room: Room,
         exportType: exportTypes,
         exportOptions: exportOptions,
-        setProgressText: React.Dispatch<React.SetStateAction<string>>,
+        exportProgressRef: MutableRefObject<HTMLParagraphElement>,
     ) {
-        super(room, exportType, exportOptions, setProgressText);
+        super(room, exportType, exportOptions, exportProgressRef);
         this.avatars = new Map<string, boolean>();
         this.permalinkCreator = new RoomPermalinkCreator(this.room);
         this.totalSize = 0;
@@ -333,7 +333,7 @@ export default class HTMLExporter extends Exporter {
         let prevEvent = null;
         for (let i = 0; i < events.length; i++) {
             const event = events[i];
-            if (i % 100 == 0) this.updateProgress(`Processing event ${i ? i : 1} out of ${events.length}`, false, true);
+            this.updateProgress(`Processing event ${i + 1} out of ${events.length}`, false, true);
             if (this.cancelled) return this.cleanUp();
             if (!haveTileForEvent(event)) continue;
 
diff --git a/src/utils/exportUtils/JSONExport.ts b/src/utils/exportUtils/JSONExport.ts
index 7b2a4f57a9..ed42936787 100644
--- a/src/utils/exportUtils/JSONExport.ts
+++ b/src/utils/exportUtils/JSONExport.ts
@@ -6,6 +6,7 @@ import { haveTileForEvent } from "../../components/views/rooms/EventTile";
 import { exportTypes } from "./exportUtils";
 import { exportOptions } from "./exportUtils";
 import { EventType } from "matrix-js-sdk/src/@types/event";
+import { MutableRefObject } from "react";
 
 export default class JSONExporter extends Exporter {
     protected totalSize: number;
@@ -15,9 +16,9 @@ export default class JSONExporter extends Exporter {
         room: Room,
         exportType: exportTypes,
         exportOptions: exportOptions,
-        setProgressText: React.Dispatch<React.SetStateAction<string>>,
+        exportProgressRef: MutableRefObject<HTMLParagraphElement>,
     ) {
-        super(room, exportType, exportOptions, setProgressText);
+        super(room, exportType, exportOptions, exportProgressRef);
         this.totalSize = 0;
         this.messages = [];
     }
@@ -62,7 +63,7 @@ export default class JSONExporter extends Exporter {
     protected async createOutput(events: MatrixEvent[]) {
         for (let i = 0; i < events.length; i++) {
             const event = events[i];
-            if (i % 100 == 0) this.updateProgress(`Processing event ${i ? i : 1} out of ${events.length}`, false, true);
+            this.updateProgress(`Processing event ${i + 1} out of ${events.length}`, false, true);
             if (this.cancelled) return this.cleanUp();
             if (!haveTileForEvent(event)) continue;
             this.messages.push(await this.getJSONString(event));
diff --git a/src/utils/exportUtils/PlainTextExport.ts b/src/utils/exportUtils/PlainTextExport.ts
index c437c52de9..109fa78162 100644
--- a/src/utils/exportUtils/PlainTextExport.ts
+++ b/src/utils/exportUtils/PlainTextExport.ts
@@ -7,6 +7,7 @@ import { haveTileForEvent } from "../../components/views/rooms/EventTile";
 import { exportTypes } from "./exportUtils";
 import { exportOptions } from "./exportUtils";
 import { textForEvent } from "../../TextForEvent";
+import { MutableRefObject } from "react";
 
 export default class PlainTextExporter extends Exporter {
     protected totalSize: number;
@@ -16,9 +17,9 @@ export default class PlainTextExporter extends Exporter {
         room: Room,
         exportType: exportTypes,
         exportOptions: exportOptions,
-        setProgressText: React.Dispatch<React.SetStateAction<string>>,
+        exportProgressRef: MutableRefObject<HTMLParagraphElement>,
     ) {
-        super(room, exportType, exportOptions, setProgressText);
+        super(room, exportType, exportOptions, exportProgressRef);
         this.totalSize = 0;
         this.mediaOmitText = !this.exportOptions.attachmentsIncluded
             ? _t("Media omitted")
@@ -86,7 +87,7 @@ export default class PlainTextExporter extends Exporter {
         let content = "";
         for (let i = 0; i < events.length; i++) {
             const event = events[i];
-            if (i % 100 == 0) this.updateProgress(`Processing event ${i ? i : 1} out of ${events.length}`, false, true);
+            this.updateProgress(`Processing event ${i + 1} out of ${events.length}`, false, true);
             if (this.cancelled) return this.cleanUp();
             if (!haveTileForEvent(event)) continue;
             const textForEvent = await this._textForEvent(event);