fix: move script to head only use defer (#182)

Former-commit-id: 09040ea Former-commit-id: 71f197bbf780f5469dd3a8587a90035dde4be8c8
googlemaps · May 18, 2020 · 02e1135 · 02e1135
1 parent 041dd3c
commit 02e1135
Show file tree

Hide file tree

Showing 714 changed files with 2,588 additions and 4,710 deletions.
diff --git a/dist/samples/add-map/index.html b/dist/samples/add-map/index.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Add Map</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Set the size of the div element that contains the map */
       #map {
@@ -43,10 +47,5 @@
   </head>
   <body>
     <div id="map"></div>
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/add-map/inline.html b/dist/samples/add-map/inline.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Add Map</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Set the size of the div element that contains the map */
       #map {
@@ -43,10 +47,5 @@
   </head>
   <body>
     <div id="map"></div>
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/add-map/jsfiddle.html b/dist/samples/add-map/jsfiddle.html
@@ -5,14 +5,13 @@
     <meta charset="utf-8" />
     <title>Add Map</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
-    <!-- jsFiddle will insert css and js -->
-  </head>
-  <body>
-    <div id="map"></div>
     <script
       src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap&libraries=&v=weekly"
-      async
       defer
     ></script>
+    <!-- jsFiddle will insert css and js -->
+  </head>
+  <body>
+    <div id="map"></div>
   </body>
 </html>
diff --git a/dist/samples/add-map/sample.html b/dist/samples/add-map/sample.html
@@ -6,21 +6,18 @@
     <meta charset="utf-8" />
     <title>Add Map</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <!-- [START maps_add_map_html_head_api] -->
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
+    <!-- [END maps_add_map_htmll_head_api] -->
     <link rel="stylesheet" type="text/css" href="./style.css" />
     <script src="./app.js"></script>
   </head>
   <body>
     <!-- [START maps_add_map_html] -->
-    <!-- [START maps_add_map_html_body] -->
     <div id="map"></div>
-    <!-- [END maps_add_map_html_body] -->
-    <!-- [START maps_add_map_html_api] -->
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
-    <!-- [END maps_add_map_html_api] -->
     <!-- [END maps_add_map_html] -->
   </body>
 </html>

diff --git a/dist/samples/aerial-rotation/index.html b/dist/samples/aerial-rotation/index.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Rotating 45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Always set the map height explicitly to define the size of the div
        * element that contains the map. */
@@ -74,11 +78,5 @@
       <input type="button" value="Auto Rotate" onclick="autoRotate();" />
     </div>
     <div id="map"></div>
-
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/aerial-rotation/inline.html b/dist/samples/aerial-rotation/inline.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Rotating 45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Always set the map height explicitly to define the size of the div
        * element that contains the map. */
@@ -74,11 +78,5 @@
       <input type="button" value="Auto Rotate" onclick="autoRotate();" />
     </div>
     <div id="map"></div>
-
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/aerial-rotation/jsfiddle.html b/dist/samples/aerial-rotation/jsfiddle.html
@@ -5,18 +5,16 @@
     <meta charset="utf-8" />
     <title>Rotating 45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <!-- jsFiddle will insert css and js -->
   </head>
   <body>
     <div id="floating-panel">
       <input type="button" value="Auto Rotate" onclick="autoRotate();" />
     </div>
     <div id="map"></div>
-
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/aerial-rotation/sample.html b/dist/samples/aerial-rotation/sample.html
@@ -6,25 +6,21 @@
     <meta charset="utf-8" />
     <title>Rotating 45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <!-- [START maps_aerial_rotation_html_head_api] -->
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
+    <!-- [END maps_aerial_rotation_htmll_head_api] -->
     <link rel="stylesheet" type="text/css" href="./style.css" />
     <script src="./app.js"></script>
   </head>
   <body>
     <!-- [START maps_aerial_rotation_html] -->
-    <!-- [START maps_aerial_rotation_html_body] -->
     <div id="floating-panel">
       <input type="button" value="Auto Rotate" onclick="autoRotate();" />
     </div>
     <div id="map"></div>
-    <!-- [END maps_aerial_rotation_html_body] -->
-
-    <!-- [START maps_aerial_rotation_html_api] -->
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
-    <!-- [END maps_aerial_rotation_html_api] -->
     <!-- [END maps_aerial_rotation_html] -->
   </body>
 </html>

diff --git a/dist/samples/aerial-simple/index.html b/dist/samples/aerial-simple/index.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Always set the map height explicitly to define the size of the div
        * element that contains the map. */
@@ -42,10 +46,5 @@
   </head>
   <body>
     <div id="map"></div>
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/aerial-simple/inline.html b/dist/samples/aerial-simple/inline.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Always set the map height explicitly to define the size of the div
        * element that contains the map. */
@@ -42,10 +46,5 @@
   </head>
   <body>
     <div id="map"></div>
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/aerial-simple/jsfiddle.html b/dist/samples/aerial-simple/jsfiddle.html
@@ -5,14 +5,13 @@
     <meta charset="utf-8" />
     <title>45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
-    <!-- jsFiddle will insert css and js -->
-  </head>
-  <body>
-    <div id="map"></div>
     <script
       src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap&libraries=&v=weekly"
-      async
       defer
     ></script>
+    <!-- jsFiddle will insert css and js -->
+  </head>
+  <body>
+    <div id="map"></div>
   </body>
 </html>
diff --git a/dist/samples/aerial-simple/sample.html b/dist/samples/aerial-simple/sample.html
@@ -6,21 +6,18 @@
     <meta charset="utf-8" />
     <title>45° Imagery</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <!-- [START maps_aerial_simple_html_head_api] -->
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
+    <!-- [END maps_aerial_simple_htmll_head_api] -->
     <link rel="stylesheet" type="text/css" href="./style.css" />
     <script src="./app.js"></script>
   </head>
   <body>
     <!-- [START maps_aerial_simple_html] -->
-    <!-- [START maps_aerial_simple_html_body] -->
     <div id="map"></div>
-    <!-- [END maps_aerial_simple_html_body] -->
-    <!-- [START maps_aerial_simple_html_api] -->
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
-    <!-- [END maps_aerial_simple_html_api] -->
     <!-- [END maps_aerial_simple_html] -->
   </body>
 </html>

diff --git a/dist/samples/circle-simple/index.html b/dist/samples/circle-simple/index.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Circles</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Always set the map height explicitly to define the size of the div
        * element that contains the map. */
@@ -92,10 +96,5 @@
   </head>
   <body>
     <div id="map"></div>
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/circle-simple/inline.html b/dist/samples/circle-simple/inline.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Circles</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       /* Always set the map height explicitly to define the size of the div
        * element that contains the map. */
@@ -92,10 +96,5 @@
   </head>
   <body>
     <div id="map"></div>
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>
diff --git a/dist/samples/circle-simple/jsfiddle.html b/dist/samples/circle-simple/jsfiddle.html
@@ -5,14 +5,13 @@
     <meta charset="utf-8" />
     <title>Circles</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
-    <!-- jsFiddle will insert css and js -->
-  </head>
-  <body>
-    <div id="map"></div>
     <script
       src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap&libraries=&v=weekly"
-      async
       defer
     ></script>
+    <!-- jsFiddle will insert css and js -->
+  </head>
+  <body>
+    <div id="map"></div>
   </body>
 </html>
diff --git a/dist/samples/circle-simple/sample.html b/dist/samples/circle-simple/sample.html
@@ -6,21 +6,18 @@
     <meta charset="utf-8" />
     <title>Circles</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <!-- [START maps_circle_simple_html_head_api] -->
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
+    <!-- [END maps_circle_simple_htmll_head_api] -->
     <link rel="stylesheet" type="text/css" href="./style.css" />
     <script src="./app.js"></script>
   </head>
   <body>
     <!-- [START maps_circle_simple_html] -->
-    <!-- [START maps_circle_simple_html_body] -->
     <div id="map"></div>
-    <!-- [END maps_circle_simple_html_body] -->
-    <!-- [START maps_circle_simple_html_api] -->
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
-    <!-- [END maps_circle_simple_html_api] -->
     <!-- [END maps_circle_simple_html] -->
   </body>
 </html>

diff --git a/dist/samples/combining-data/index.html b/dist/samples/combining-data/index.html
@@ -5,6 +5,10 @@
     <meta charset="utf-8" />
     <title>Mashups with google.maps.Data</title>
     <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
+    <script
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
+      defer
+    ></script>
     <style type="text/css">
       html,
       body,
@@ -371,11 +375,5 @@
       <span id="data-value"></span>
     </div>
     <div id="map"></div>
-
-    <script
-      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCb1xprYSpXd0q_yDsJ1W2UGhfl9_YGKU0&callback=initMap&libraries=&v=weekly"
-      async
-      defer
-    ></script>
   </body>
 </html>