From 8e4d1cba00b48bc52dc406956a245856c489e48a Mon Sep 17 00:00:00 2001
From: Sorin Davidoi <sorin.davidoi@gmail.com>
Date: Wed, 24 May 2017 17:55:00 +0200
Subject: Lazy load toots using IntersectionObserver (#3191)

* refactor(components/status_list): Lazy load using IntersectionObserver

* refactor(components/status_list): Avoid setState bottleneck

* refactor(components/status_list): Update state correctly

* fix(components/status): Render if isIntersecting is undefined

* refactor(components/status): Recycle timeout

* refactor(components/status): Reduce animation duration

* refactor(components/status): Use requestIdleCallback

* chore: Split polyfill bundles

* refactor(components/status_list): Increase rootMargin to 300%

* fix(components/status): Check if onRef is not defined

* chore: Add note about polyfill bundle splitting

* fix(components/status): Reduce animation duration to 0.3 seconds
---
 app/javascript/packs/application.js | 29 +++++++++++++++++++++++++----
 1 file changed, 25 insertions(+), 4 deletions(-)

(limited to 'app/javascript/packs')

diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index ca6b476e1..01c28e768 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -1,9 +1,30 @@
 import main from '../mastodon/main';
 
-if (!window.Intl || !Object.assign || !Number.isNaN ||
-    !window.Symbol || !Array.prototype.includes) {
-  // load polyfills dynamically
-  import('../mastodon/polyfills').then(main).catch(e => {
+const needsBasePolyfills = !(
+  window.Intl &&
+  Object.assign &&
+  Number.isNaN &&
+  window.Symbol &&
+  Array.prototype.includes
+);
+
+const needsExtraPolyfills = !(
+  window.IntersectionObserver &&
+  window.requestIdleCallback
+);
+
+// Latest version of Firefox and Safari do not have IntersectionObserver.
+// Edge does not have requestIdleCallback.
+// This avoids shipping them all the polyfills.
+if (needsBasePolyfills) {
+  Promise.all([
+    import('../mastodon/base_polyfills'),
+    import('../mastodon/extra_polyfills'),
+  ]).then(main).catch(e => {
+    console.error(e); // eslint-disable-line no-console
+  });
+} else if (needsExtraPolyfills) {
+  import('../mastodon/extra_polyfills').then(main).catch(e => {
     console.error(e); // eslint-disable-line no-console
   });
 } else {
-- 
cgit