diff --git a/src/app/App.js b/src/app/App.js
index 668b287..e72534a 100644
--- a/src/app/App.js
+++ b/src/app/App.js
@@ -2,10 +2,12 @@ import React from "react";
 import { ApolloProvider } from "@apollo/react-hooks";
 import { CSSReset, ThemeProvider, theme } from "@chakra-ui/core";
 import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
+import loadable from "@loadable/component";
 
 import apolloClient from "./apolloClient";
-import HomePage from "./HomePage";
-import WardrobePage from "./WardrobePage";
+
+const WardrobePage = loadable(() => import("./WardrobePage"));
+const HomePage = loadable(() => import("./HomePage"));
 
 /**
  * App is the entry point of our application. There's not a ton of exciting
diff --git a/src/app/HomePage.js b/src/app/HomePage.js
index 4106b20..90d284f 100644
--- a/src/app/HomePage.js
+++ b/src/app/HomePage.js
@@ -141,7 +141,12 @@ function SubmitPetForm() {
 
   const onSubmit = (e) => {
     e.preventDefault();
+
     loadPet({ variables: { petName } });
+
+    // Start preloading the WardrobePage, too!
+    // eslint-disable-next-line no-unused-expressions
+    import("./WardrobePage");
   };
 
   return (