move %sapper.scripts% to <head> with defer

bleucitron · bleucitron · commit 6488501d2d6e · 2020-03-16T23:40:21.000+01:00
diff --git a/runtime/src/server/middleware/get_page_handler.ts b/runtime/src/server/middleware/get_page_handler.ts
@@ -289,7 +289,7 @@ export function get_page_handler(
 					script += `var s=document.createElement("script");try{new Function("if(0)import('')")();s.src="${main}";s.type="module";s.crossOrigin="use-credentials";}catch(e){s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main","${main}")}document.head.appendChild(s)`;
 				}
 			} else {
-				script += `</script><script src="${main}">`;
+				script += `</script><script src="${main}" defer>`;
 			}
 
 			let styles: string;
diff --git a/site/src/template.html b/site/src/template.html
@@ -38,15 +38,14 @@
 	<!-- This contains the contents of the <svelte:head> component, if
 	     the current page has one -->
 	%sapper.head%
+	<!-- Sapper creates a <script> tag containing `app/client.js`
+			 and anything else it needs to hydrate the app and
+			 initialise the router -->
+	%sapper.scripts%
 </head>
 <body>
 	<!-- The application will be rendered inside this element,
 	     because `app/client.js` references it -->
 	<div id='sapper'>%sapper.html%</div>
-
-	<!-- Sapper creates a <script> tag containing `app/client.js`
-	     and anything else it needs to hydrate the app and
-	     initialise the router -->
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/basics/src/template.html b/test/apps/basics/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/credentials/src/template.html b/test/apps/credentials/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/css/src/template.html b/test/apps/css/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/custom-extension/src/template.html b/test/apps/custom-extension/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/encoding/src/template.html b/test/apps/encoding/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/errors/src/template.html b/test/apps/errors/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/export-multiple-entry/src/template.html b/test/apps/export-multiple-entry/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/export-queue/src/template.html b/test/apps/export-queue/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/export-webpack/src/template.html b/test/apps/export-webpack/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/export/src/template.html b/test/apps/export/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/ignore/src/template.html b/test/apps/ignore/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/layout/src/template.html b/test/apps/layout/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/preloading/src/template.html b/test/apps/preloading/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/redirects/src/template.html b/test/apps/redirects/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/scroll/src/template.html b/test/apps/scroll/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/session/src/template.html b/test/apps/session/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/with-basepath/src/template.html b/test/apps/with-basepath/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/with-sourcemaps-webpack/src/template.html b/test/apps/with-sourcemaps-webpack/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>
diff --git a/test/apps/with-sourcemaps/src/template.html b/test/apps/with-sourcemaps/src/template.html
@@ -6,9 +6,9 @@
 	%sapper.base%
 	%sapper.styles%
 	%sapper.head%
+	%sapper.scripts%
 </head>
 <body>
 	<div id='sapper'>%sapper.html%</div>
-	%sapper.scripts%
 </body>
 </html>

Original file line number	Diff line number	Diff line change
`@@ -289,7 +289,7 @@ export function get_page_handler(`
`289`	`289`	script += `var s=document.createElement("script");try{new Function("if(0)import('')")();s.src="${main}";s.type="module";s.crossOrigin="use-credentials";}catch(e){s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main","${main}")}document.head.appendChild(s)`;
`290`	`290`	`}`
`291`	`291`	`} else {`
`292`		- script += `</script><script src="${main}">`;
	`292`	+ script += `</script><script src="${main}" defer>`;
`293`	`293`	`}`
`294`	`294`
`295`	`295`	`let styles: string;`