docserver: Load JS async defer since it really isn't required and it was blocking the loading of the rest of the page. BUG=skia: Review-Url: https://codereview.chromium.org/1926683002

diff --git a/doc/Makefile b/doc/Makefile
index b10a9ed..68d31e7 100644
--- a/doc/Makefile
+++ b/doc/Makefile

@@ -5,8 +5,8 @@
 # into third_party/bower_compoents via bower, or in node_modules.
 CORE_SOURCE_FILES = node_modules/native-promise-only/npo.js \
   ${BOWER_DIR}/google-code-prettify/bin/prettify.min.js \
-	../res/js/common.js
-
+	../res/js/common.js \
+	./res/js/docs.js
 
 default: core_js res/css/docs.css
 	go install -v ./go/docserver

diff --git a/doc/res/js/docs.js b/doc/res/js/docs.js
new file mode 100644
index 0000000..be5c6f1
--- /dev/null
+++ b/doc/res/js/docs.js

@@ -0,0 +1,60 @@
+sk.DomReady.then(function() {
+  prettyPrint();
+
+  // Open the side drawer with the navigation menu.
+  $$$('button').addEventListener('click', function(e) {
+    $$$('#drawer').classList.add('opened');
+    e.stopPropagation();
+  });
+
+  // Close the side drawer.
+  $$$('body').addEventListener('click', function() {
+    $$$('#drawer').classList.remove('opened');
+  });
+
+  // highlightNav highlights where we are in the navigation.
+  var highlightNav = function() {
+    $$('#drawer li a').forEach(function(e) {
+      if (e.dataset.path == window.location.pathname) {
+        e.classList.add('selected');
+        $$$('title').innerText = e.innerText;
+      } else {
+        e.classList.remove('selected');
+      }
+    });
+  }
+
+  // Shortcut the links and handle them via XHR, that way we only
+  // pay the loading time once, yet still retain full URLs.
+  $$('#drawer li a').forEach(function(e) {
+    e.addEventListener('click', function(e) {
+      // Preserve query parameters as we navigate.
+      var q = window.location.search;
+      var url = e.target.dataset.path;
+      if (q != "") {
+        url += q;
+      }
+      sk.get('/_'+url).then(function(content) {
+        window.history.pushState(null, null, url);
+        highlightNav();
+        $$$('html #content').innerHTML = content;
+        $$$('html #page').scrollIntoView();
+        prettyPrint();
+      });
+      e.preventDefault();
+    });
+  });
+
+  highlightNav();
+});
+
+(function() {
+  var cx = '009791159600898516779:8-nlv0iznho';
+  var gcse = document.createElement('script');
+  gcse.type = 'text/javascript';
+  gcse.async = true;
+  gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
+    '//cse.google.com/cse.js?cx=' + cx;
+  var s = document.getElementsByTagName('script')[0];
+  s.parentNode.insertBefore(gcse, s);
+})();

diff --git a/doc/templates/index.html b/doc/templates/index.html
index 98ff385..451bc56 100644
--- a/doc/templates/index.html
+++ b/doc/templates/index.html

@@ -8,7 +8,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="google-site-verification" content="pwqU0tZr1xJubovbW73M6WGA2IIygCYPBkB6O4kzbYI" />
     <meta name="google-site-verification" content="pIHubYTE28EzwOWGWmHyNmxRNA6yclJyxSymw6uX8b8" />
-    <script src="/res/js/core.js"></script>
+    <script async src="/res/js/core.js"></script>
     <link href="/res/css/docs.css" rel="stylesheet" />
   </head>
   <body>
@@ -16,18 +16,6 @@
       <div id=drawer drawer vertical layout>
         <img src="/res/img/logo.png" width=204 height=91>
 
-        <script>
-          (function() {
-            var cx = '009791159600898516779:8-nlv0iznho';
-            var gcse = document.createElement('script');
-            gcse.type = 'text/javascript';
-            gcse.async = true;
-            gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
-              '//cse.google.com/cse.js?cx=' + cx;
-            var s = document.getElementsByTagName('script')[0];
-            s.parentNode.insertBefore(gcse, s);
-          })();
-        </script>
         <gcse:searchbox-only></gcse:searchbox-only>
 
         {{.Nav}}
@@ -46,57 +34,5 @@
         </div>
       </div>
     </div>
-
-    <script>
-      sk.DomReady.then(function() {
-        prettyPrint();
-
-        // Open the side drawer with the navigation menu.
-        $$$('button').addEventListener('click', function(e) {
-         $$$('#drawer').classList.add('opened');
-         e.stopPropagation();
-        });
-
-        // Close the side drawer.
-        $$$('body').addEventListener('click', function() {
-         $$$('#drawer').classList.remove('opened');
-        });
-
-        // highlightNav highlights where we are in the navigation.
-        var highlightNav = function() {
-          $$('#drawer li a').forEach(function(e) {
-            if (e.dataset.path == window.location.pathname) {
-              e.classList.add('selected');
-              $$$('title').innerText = e.innerText;
-            } else {
-              e.classList.remove('selected');
-            }
-          });
-        }
-
-        // Shortcut the links and handle them via XHR, that way we only
-        // pay the loading time once, yet still retain full URLs.
-        $$('#drawer li a').forEach(function(e) {
-          e.addEventListener('click', function(e) {
-            // Preserve query parameters as we navigate.
-            var q = window.location.search;
-            var url = e.target.dataset.path;
-            if (q != "") {
-              url += q;
-            }
-            sk.get('/_'+url).then(function(content) {
-              window.history.pushState(null, null, url);
-              highlightNav();
-              $$$('html #content').innerHTML = content;
-              $$$('html #page').scrollIntoView();
-              prettyPrint();
-            });
-            e.preventDefault();
-          });
-        });
-
-        highlightNav();
-      });
-    </script>
   </body>
 </html>