diff --git a/package-lock.json b/package-lock.json
index 8596acf..adc1bfc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,7 +23,8 @@
 				"react": "^18.3.1",
 				"react-dom": "^18.3.1",
 				"react-router-dom": "^6.28.0",
-				"shelljs": "^0.8.5"
+				"shelljs": "^0.8.5",
+				"web-vitals": "^4.2.4"
 			},
 			"devDependencies": {
 				"cross-env": "^7.0.3",
@@ -2976,21 +2977,6 @@
 			"integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
 			"license": "ISC"
 		},
-		"node_modules/fsevents": {
-			"version": "2.3.3",
-			"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
-			"integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-			"dev": true,
-			"hasInstallScript": true,
-			"license": "MIT",
-			"optional": true,
-			"os": [
-				"darwin"
-			],
-			"engines": {
-				"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
-			}
-		},
 		"node_modules/function-bind": {
 			"version": "1.1.2",
 			"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -7168,6 +7154,11 @@
 				"node": ">= 8"
 			}
 		},
+		"node_modules/web-vitals": {
+			"version": "4.2.4",
+			"resolved": "https://registry.npmjs.org/web-vitals/-/web-vitals-4.2.4.tgz",
+			"integrity": "sha512-r4DIlprAGwJ7YM11VZp4R884m0Vmgr6EAKe3P+kO0PPj3Unqyvv59rczf6UiGcb9Z8QxZVcqKNwv/g0WNdWwsw=="
+		},
 		"node_modules/webidl-conversions": {
 			"version": "7.0.0",
 			"resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
diff --git a/package.json b/package.json
index 4026d43..53bdbd6 100644
--- a/package.json
+++ b/package.json
@@ -44,7 +44,8 @@
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
 		"react-router-dom": "^6.28.0",
-		"shelljs": "^0.8.5"
+		"shelljs": "^0.8.5",
+		"web-vitals": "^4.2.4"
 	},
 	"devDependencies": {
 		"cross-env": "^7.0.3",
diff --git a/src/App/Agate-App.js b/src/App/Agate-App.js
index d807577..3e3e7a1 100644
--- a/src/App/Agate-App.js
+++ b/src/App/Agate-App.js
@@ -64,6 +64,7 @@ const AgateApp = kind({
 		<Router>
 			<div {...props}>
 				<Routes>
+					<Route path="/" element={<OverallView />} />
 					<Route path="/arcPicker" element={<ArcPicker />} />
 					<Route path="/arcSlider" element={<ArcSlider />} />
 					<Route path="/bodyText" element={<BodyText />} />
@@ -112,6 +113,9 @@ const AgateApp = kind({
 					<Route path="/windDirectionControl" element={<WindDirectionControl />} />
 				</Routes>
 			</div>
+			<div id="FCP"></div>
+			<div id="LCP"></div>
+			<div id="INP"></div>
 		</Router>
 	)
 });
diff --git a/src/App/Sandstone-App.js b/src/App/Sandstone-App.js
index 1d83089..4d65709 100644
--- a/src/App/Sandstone-App.js
+++ b/src/App/Sandstone-App.js
@@ -68,6 +68,7 @@ const SandstoneApp = kind({
 		<Router>
 			<div {...props}>
 				<Routes>
+					<Route path="/" element={<OverallView />} />
 					<Route path="/alert" element={<Alert />} />
 					<Route path="/button" element={<Button />} />
 					<Route path="/bodyText" element={<BodyText />} />
@@ -120,6 +121,9 @@ const SandstoneApp = kind({
 					<Route path="/wizardPanels" element={<WizardPanels />} />
 				</Routes>
 			</div>
+			<div id="FCP"></div>
+			<div id="LCP"></div>
+			<div id="INP"></div>
 		</Router>
 	)
 });
diff --git a/src/index.js b/src/index.js
index 34bfb81..ba69a6d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,6 +1,7 @@
 import {createRoot} from 'react-dom/client';
 import AgateApp from './App/Agate-App.js';
 import SandstoneApp from './App/Sandstone-App.js';
+import reportWebVitals from './reportWebVitals';
 
 let appElement;
 
@@ -21,3 +22,10 @@ if (typeof window !== 'undefined') {
 }
 
 export default appElement;
+
+reportWebVitals((value) => {
+	const vitals = document.getElementById(value.name);
+	vitals.innerHTML = value.value;
+
+	console.log(value);
+});
\ No newline at end of file
diff --git a/src/reportWebVitals.js b/src/reportWebVitals.js
new file mode 100644
index 0000000..f1d128e
--- /dev/null
+++ b/src/reportWebVitals.js
@@ -0,0 +1,11 @@
+const reportWebVitals = onPerfEntry => {
+    if (onPerfEntry && onPerfEntry instanceof Function) {
+      import('web-vitals').then(({ onINP, onFCP, onLCP }) => {
+        onINP(onPerfEntry);
+        onFCP(onPerfEntry);
+        onLCP(onPerfEntry);
+      });
+    }
+  };
+
+export default reportWebVitals;