From 7ce03988dd409b6dc4e60ac0b38e0dd4c8aa550f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20K=C4=99drzy=C5=84ski?= <kedrzu@gmail.com>
Date: Fri, 10 Sep 2021 14:11:36 +0200
Subject: [PATCH 1/2] Disable hydration after full page load

---
 src/utils/disabled.js          | 16 ++++++++++++++++
 src/utils/hydration-blocker.js | 17 +++++++++++++----
 src/utils/nonce.js             |  4 ----
 3 files changed, 29 insertions(+), 8 deletions(-)
 create mode 100644 src/utils/disabled.js

diff --git a/src/utils/disabled.js b/src/utils/disabled.js
new file mode 100644
index 0000000..bbd3784
--- /dev/null
+++ b/src/utils/disabled.js
@@ -0,0 +1,16 @@
+const isServer = typeof window === `undefined`;
+let isPageLodaded = false;
+
+if (!isServer) {
+  // load event fires, when document with all scripts is loaded,
+  // so after hydration process is finished
+  window.addEventListener(`load`, () => {
+    isPageLodaded = true;
+  });
+}
+
+export function isHydrationDisabled() {
+  // Hydration may be disabled because we are in SSR context
+  // or page was fully loaded & hydrated, so it's not needed anymore
+  return isServer || isPageLodaded;
+}
diff --git a/src/utils/hydration-blocker.js b/src/utils/hydration-blocker.js
index e1ff3c9..58efc50 100644
--- a/src/utils/hydration-blocker.js
+++ b/src/utils/hydration-blocker.js
@@ -1,21 +1,30 @@
 import { makeHydrationObserver } from './hydration-observer';
 import { makeHydrationPromise } from './hydration-promise';
 import { makeNonce } from './nonce';
+import { isHydrationDisabled } from './disabled';
 
 export function makeHydrationBlocker(component, options) {
   return Object.assign({
     mixins: [{
       beforeCreate() {
         this.cleanupHandlers = [];
-        const { hydrate, hydrationPromise } = makeHydrationPromise();
-        this.Nonce = makeNonce({ component, hydrationPromise });
-        this.hydrate = hydrate;
-        this.hydrationPromise = hydrationPromise;
+
+        if (isHydrationDisabled()) {
+          this.Nonce = component;
+        } else {
+          const { hydrate, hydrationPromise } = makeHydrationPromise();
+          this.Nonce = makeNonce({ component, hydrationPromise });
+          this.hydrate = hydrate;
+          this.hydrationPromise = hydrationPromise;
+        }
       },
       beforeDestroy() {
         this.cleanup();
       },
       mounted() {
+        // hydration is disabled
+        if (!this.hydrate) return;
+
         if (this.$el.nodeType === Node.COMMENT_NODE) {
           // No SSR rendered content, hydrate immediately.
           this.hydrate();
diff --git a/src/utils/nonce.js b/src/utils/nonce.js
index d873b16..5150d00 100644
--- a/src/utils/nonce.js
+++ b/src/utils/nonce.js
@@ -1,5 +1,3 @@
-const isServer = typeof window === `undefined`;
-
 function isAsyncComponentFactory(componentOrFactory) {
   return typeof componentOrFactory === `function`;
 }
@@ -12,7 +10,5 @@ function resolveComponent(componentOrFactory) {
 }
 
 export function makeNonce({ component, hydrationPromise }) {
-  if (isServer) return component;
-
   return () => hydrationPromise.then(() => resolveComponent(component));
 }

From c93eb790e6d7a7209060b51a7e0ede9d6e944cf6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20K=C4=99drzy=C5=84ski?= <kedrzu@gmail.com>
Date: Mon, 20 Sep 2021 10:36:42 +0200
Subject: [PATCH 2/2] fixed a bug found

---
 src/LazyHydrate.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/LazyHydrate.js b/src/LazyHydrate.js
index a3ca4f9..54df35a 100644
--- a/src/LazyHydrate.js
+++ b/src/LazyHydrate.js
@@ -78,7 +78,7 @@ export default makeHydrationBlocker(Placeholder, {
     triggerHydration: {
       immediate: true,
       handler(isTriggered) {
-        if (isTriggered) this.hydrate();
+        if (isTriggered && this.hydrate) this.hydrate();
       },
     },
   },