From 402a8eb47def23ffcc320e092e8afedf0a2de0fa Mon Sep 17 00:00:00 2001
From: Sebastiaan van Stijn <github@gone.nl>
Date: Fri, 16 Oct 2020 18:38:41 +0200
Subject: [PATCH] Load javascripts early, but defer execution

This moves our scripts in the head section, but use "defer" loading to allow the
browser to start loading them as soon as possible. Actual execution of deferred
scripts happens once the HTML is fully parsed.
see https://flaviocopes.com/javascript-async-defer/#with-defer-in-the-head

Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
---
 _includes/body-landing.html |  4 ----
 _includes/body.html         |  6 ------
 _includes/head.html         | 21 +++++++++++++++++++++
 3 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/_includes/body-landing.html b/_includes/body-landing.html
index 492781f433..e2bddb18b7 100644
--- a/_includes/body-landing.html
+++ b/_includes/body-landing.html
@@ -468,10 +468,6 @@
   <footer class="footer">
     {% include footer.html %}
   </footer>
-  <script src="/js/theme-switcher.js"></script>
-  <script src="/js/jquery.js"></script>
-  <script src="/js/bootstrap.min.js"></script>
-  <script defer src="/js/search.js"></script>
 
   <script>
     window.onChangeHelpTab = function (name) {
diff --git a/_includes/body.html b/_includes/body.html
index bf53ff7f12..33a9266030 100644
--- a/_includes/body.html
+++ b/_includes/body.html
@@ -73,11 +73,5 @@
         {% include footer.html %}
     </footer>
     <script>const pageURL = "{{ page.url }}";</script>
-    <script src="/js/theme-switcher.js"></script>
-    <script defer src="/js/anchorlinks.js"></script>
-    <script src="/js/jquery.js"></script>
-    <script src="/js/bootstrap.min.js"></script>
-    <script defer src="/js/docs.js"></script>
-    <script defer src="/js/search.js"></script>
     {%- include analytics/polldaddy.html -%}
 </body>
diff --git a/_includes/head.html b/_includes/head.html
index bc01ae75ca..f2aae70083 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -44,6 +44,27 @@
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+  {%- comment -%}
+  We put these scripts in the head section, but use "defer" loading to allow the
+  browser to start loading them as soon as possible. Actual execution of deferred
+  scripts happens once the HTML is fully parsed.
+  see https://flaviocopes.com/javascript-async-defer/#with-defer-in-the-head
+  {%- endcomment -%}
+  {%- if page.landing == true -%}
+  <!-- landing page scripts -->
+  <script defer src="/js/theme-switcher.js"></script>
+  <script defer src="/js/jquery.js"></script>
+  <script defer src="/js/bootstrap.min.js"></script>
+  <script defer src="/js/search.js"></script>
+  {%- else -%}
+  <script defer src="/js/theme-switcher.js"></script>
+  <script defer src="/js/anchorlinks.js"></script>
+  <script defer src="/js/jquery.js"></script>
+  <script defer src="/js/bootstrap.min.js"></script>
+  <script defer src="/js/docs.js"></script>
+  <script defer src="/js/search.js"></script>
+  {%- endif -%}
+
   {%- comment -%}
   preload fonts: https://www.freecodecamp.org/news/web-fonts-in-2018-f191a48367e8/
   we only preload the "woff2" variants, as older formats (woff, eot) are only used