diff --git a/examples/react/package-lock.json b/examples/react/package-lock.json
index 31de85a..13ec6d4 100644
--- a/examples/react/package-lock.json
+++ b/examples/react/package-lock.json
@@ -9,7 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "comlink": "^4.4.2",
-        "mupdf": "^1.1.0",
+        "mupdf": "^1.3.0",
         "react": "^18.3.1",
         "react-dom": "^18.3.1"
       },
@@ -3503,9 +3503,9 @@
       "dev": true
     },
     "node_modules/mupdf": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/mupdf/-/mupdf-1.1.0.tgz",
-      "integrity": "sha512-4mWXw1zC7FFX3/0CJ8M3YhUo/NLIOUTshmF0i6hrV3sMs571iYZU8QQgMB8DXOOWpy+lGiqaMcYnIcPsdAKH3g=="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/mupdf/-/mupdf-1.3.0.tgz",
+      "integrity": "sha512-rKol+1qv8rXj6gNc+JYFY57bdUuqpAn1Vk3Gj7lCYp/F6tbx3VYTQ7DvRJuER69MzSAvfHO+CHvUC2jEziuZkw=="
     },
     "node_modules/nanoid": {
       "version": "3.3.8",
diff --git a/examples/react/package.json b/examples/react/package.json
index 3a1252c..8569019 100644
--- a/examples/react/package.json
+++ b/examples/react/package.json
@@ -11,7 +11,7 @@
   },
   "dependencies": {
     "comlink": "^4.4.2",
-    "mupdf": "^1.1.0",
+    "mupdf": "^1.3.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },
diff --git a/examples/react/public/test.pdf b/examples/react/public/test.pdf
index 5411b2a..7860621 100644
Binary files a/examples/react/public/test.pdf and b/examples/react/public/test.pdf differ
diff --git a/examples/react/src/App.css b/examples/react/src/App.css
index 7ed4e2e..28abee7 100644
--- a/examples/react/src/App.css
+++ b/examples/react/src/App.css
@@ -1,4 +1,21 @@
 #root {
   display: flex;
   justify-content: center;
+}
+
+#pages {
+    width:90%;
+    margin:0 auto;
+}
+
+#pages div {
+    position: relative;
+    width:inherit;
+	background-color: white;
+	margin: 16px auto;
+	box-shadow: 0px 2px 8px #0004;
+}
+
+#pages div img {
+    width:100%;
 }
\ No newline at end of file
diff --git a/examples/react/src/App.tsx b/examples/react/src/App.tsx
index 08263d7..3e2eeea 100644
--- a/examples/react/src/App.tsx
+++ b/examples/react/src/App.tsx
@@ -3,32 +3,62 @@ import { useMupdf } from "@/hooks/useMupdf.hook";
 import { useEffect, useState } from "react";
 
 function App() {
-  const { isWorkerInitialized, renderPage, loadDocument, currentPage } =
+
+  const [docLoaded, setDocLoaded] = useState(false);
+
+  const { isWorkerInitialized, renderPage, loadDocument, currentPage, countPages } =
     useMupdf();
-  const [pageImgUrl, setPageImgUrl] = useState<string | null>(null);
+  const [pageImages, setPageImages] = useState<any>([]);
 
   // ===> This is a demo effect which uses hooks <===
   // ===> from useMupdf to load and display the first page <===
   // ===> of the pdf as an image. <===
   useEffect(() => {
+
     if (!isWorkerInitialized) {
       return;
     }
 
-    const loadAndRender = async () => {
-      const response = await fetch("/test.pdf");
-      const arrayBuffer = await response.arrayBuffer();
-      await loadDocument(arrayBuffer);
-      const pngData = await renderPage(currentPage);
-      setPageImgUrl(
-        URL.createObjectURL(new Blob([pngData], { type: "image/png" }))
-      );
-    };
+    // load the document and then load the pages
+    const init = async () => {
+        const response = await fetch("/test.pdf");
+        const arrayBuffer = await response.arrayBuffer();
+        await loadDocument(arrayBuffer)
+        setDocLoaded(true);
+        await loadPages().catch(console.error);
+    }
+    
+
+    const loadPages = async () => {
+
+        let pageStack = new Array();
+        const totalPages: number | void = await countPages().catch(console.error);
+        
+        if (totalPages) {
+            for (let i:number = 0; i < totalPages; ++i) {
+                let pngData = await renderPage(i).catch(console.error);
+
+                if (pngData) {
+                    pageStack.push(URL.createObjectURL(new Blob([pngData], { type: "image/png" })));
+                
+                    if (pageStack.length == totalPages) {
+                        setPageImages(pageStack);
+                    }
+                }
+            }
+        }
+    }
+
+    init();
+    
+  }, [isWorkerInitialized, loadDocument, renderPage]);
 
-    loadAndRender().catch(console.error);
-  }, [currentPage, isWorkerInitialized, loadDocument, renderPage]);
+  return <div id="pages">
+  { pageImages.map((item:any, i) => {
+    return <div key={i}><img src={item} /></div>;
+  }) }
+</div>
 
-  return <>{pageImgUrl && <img src={pageImgUrl} />}</>;
 }
 
 export default App;
diff --git a/examples/react/src/hooks/useMupdf.hook.ts b/examples/react/src/hooks/useMupdf.hook.ts
index 430e237..62be77d 100644
--- a/examples/react/src/hooks/useMupdf.hook.ts
+++ b/examples/react/src/hooks/useMupdf.hook.ts
@@ -51,10 +51,21 @@ export function useMupdf() {
     );
   }, []);
 
+  const countPages = useCallback(() => {
+    if (!document.current) {
+        throw new Error("Document not loaded");
+    }
+    
+    return mupdfWorker.current!.getPageCount();
+  }, []);
+
+  
+
   return {
     isWorkerInitialized,
     loadDocument,
     renderPage,
     currentPage,
+    countPages,
   };
 }
diff --git a/examples/react/src/workers/mupdf.worker.ts b/examples/react/src/workers/mupdf.worker.ts
index c07d71a..3cfeab7 100644
--- a/examples/react/src/workers/mupdf.worker.ts
+++ b/examples/react/src/workers/mupdf.worker.ts
@@ -1,12 +1,12 @@
 /// <reference lib="webworker" />
 import * as Comlink from "comlink";
-import * as mupdfjs from "mupdf/mupdfjs";
+import * as mupdfjs from "mupdf/mupdfjs"
 import { PDFDocument } from "mupdf/mupdfjs";
 
 export const MUPDF_LOADED = "MUPDF_LOADED";
 
 export class MupdfWorker {
-  private document?: PDFDocument;
+  private pdfdocument?: PDFDocument;
 
   constructor() {
     this.initializeMupdf();
@@ -25,24 +25,34 @@ export class MupdfWorker {
   // ===> from mupdfjs which wraps ./node_modules/mupdf/dist/mupdf.js <===
 
   loadDocument(document: ArrayBuffer): boolean {
-    this.document = mupdfjs.PDFDocument.openDocument(
+
+    this.pdfdocument = mupdfjs.PDFDocument.openDocument(
       document,
       "application/pdf"
-    );
+    ) as PDFDocument;
 
     return true;
   }
 
-  renderPageAsImage(pageIndex = 0, scale = 1): Uint8Array {
-    if (!this.document) throw new Error("Document not loaded");
+  renderPageAsImage(pageIndex:number = 0, scale:number = 1): Uint8Array {
+    if (!this.pdfdocument) throw new Error("Document not loaded");
+
+    const page = new mupdfjs.PDFPage(this.pdfdocument, pageIndex);
 
-    const page = this.document.loadPage(pageIndex);
     const pixmap = page.toPixmap(
       [scale, 0, 0, scale, 0, 0],
       mupdfjs.ColorSpace.DeviceRGB
     );
 
-    return pixmap.asPNG();
+    let png = pixmap.asPNG();
+    pixmap.destroy();
+    return png;
+  }
+
+  getPageCount(): number {
+    if (!this.pdfdocument) throw new Error("Document not loaded");
+
+    return this.pdfdocument.countPages();
   }
 }