diff --git a/ui/src/Components/MainModal/index.js b/ui/src/Components/MainModal/index.js
index 66948d4ed..bba66f8c2 100644
--- a/ui/src/Components/MainModal/index.js
+++ b/ui/src/Components/MainModal/index.js
@@ -6,12 +6,19 @@ import { observable, action } from "mobx";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faCog } from "@fortawesome/free-solid-svg-icons/faCog";
+import { faSpinner } from "@fortawesome/free-solid-svg-icons/faSpinner";
import { AlertStore } from "Stores/AlertStore";
import { Settings } from "Stores/Settings";
import { TooltipWrapper } from "Components/TooltipWrapper";
import { Modal } from "Components/Modal";
-import { MainModalContent } from "./MainModalContent";
+
+// https://github.com/facebook/react/issues/14603
+const MainModalContent = React.lazy(() =>
+ import("./MainModalContent").then(module => ({
+ default: module.MainModalContent
+ }))
+);
const MainModal = observer(
class MainModal extends Component {
@@ -49,12 +56,20 @@ const MainModal = observer(
-
+
+
+
+ }
+ >
+
+
);
diff --git a/ui/src/Components/SilenceModal/index.js b/ui/src/Components/SilenceModal/index.js
index 400a261d2..52e0ea155 100644
--- a/ui/src/Components/SilenceModal/index.js
+++ b/ui/src/Components/SilenceModal/index.js
@@ -5,16 +5,23 @@ import { observer } from "mobx-react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faBellSlash } from "@fortawesome/free-solid-svg-icons/faBellSlash";
+import { faSpinner } from "@fortawesome/free-solid-svg-icons/faSpinner";
import { AlertStore } from "Stores/AlertStore";
import { SilenceFormStore } from "Stores/SilenceFormStore";
import { Settings } from "Stores/Settings";
import { Modal } from "Components/Modal";
import { TooltipWrapper } from "Components/TooltipWrapper";
-import { SilenceModalContent } from "./SilenceModalContent";
import "./index.css";
+// https://github.com/facebook/react/issues/14603
+const SilenceModalContent = React.lazy(() =>
+ import("./SilenceModalContent").then(module => ({
+ default: module.SilenceModalContent
+ }))
+);
+
const SilenceModal = observer(
class SilenceModal extends Component {
static propTypes = {
@@ -42,12 +49,20 @@ const SilenceModal = observer(
isOpen={silenceFormStore.toggle.visible}
onExited={silenceFormStore.data.resetProgress}
>
-
+
+
+
+ }
+ >
+
+
);