Preload on css resources

Change-Id: I33540c285362091d006700a797eae537e429be24
diff --git a/resources/com/google/gerrit/httpd/raw/PolyGerritIndexHtml.soy b/resources/com/google/gerrit/httpd/raw/PolyGerritIndexHtml.soy
index b182309..757c167 100644
--- a/resources/com/google/gerrit/httpd/raw/PolyGerritIndexHtml.soy
+++ b/resources/com/google/gerrit/httpd/raw/PolyGerritIndexHtml.soy
@@ -94,7 +94,7 @@
 
   // RobotoMono fonts are used in styles/fonts.css
   {if $useGoogleFonts}
-    <link rel="preload" href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,500,700|Roboto:400,500,700&display=swap" as="style">
+    <link rel="preload" as="style" href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,500,700|Roboto:400,500,700&display=swap">
   {else}
     // @see https://github.com/w3c/preload/issues/32 regarding crossorigin
     <link rel="preload" href="{$staticResourcePath}/fonts/RobotoMono-Regular.woff2" as="font" type="font/woff2" crossorigin="anonymous">{\n}
@@ -103,9 +103,9 @@
     <link rel="preload" href="{$staticResourcePath}/fonts/Roboto-Regular.woff" as="font" type="font/woff" crossorigin="anonymous">{\n}
     <link rel="preload" href="{$staticResourcePath}/fonts/Roboto-Medium.woff2" as="font" type="font/woff2" crossorigin="anonymous">{\n}
     <link rel="preload" href="{$staticResourcePath}/fonts/Roboto-Medium.woff" as="font" type="font/woff" crossorigin="anonymous">{\n}
+    <link rel="preload" as="style" href="{$staticResourcePath}/styles/fonts.css">{\n}
   {/if}
-  <link rel="stylesheet" href="{$staticResourcePath}/styles/fonts.css">{\n}
-  <link rel="stylesheet" href="{$staticResourcePath}/styles/main.css">{\n}
+  <link rel="preload" as="style" href="{$staticResourcePath}/styles/main.css">{\n}
 
   <script src="{$staticResourcePath}/bower_components/webcomponentsjs/webcomponents-lite.js"></script>{\n}
 
@@ -121,6 +121,14 @@
 
   <link rel="import" href="{$staticResourcePath}/elements/gr-app.html">{\n}
 
+  // Now use preloaded resources
+  {if $useGoogleFonts}
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,500,700|Roboto:400,500,700&display=swap">{\n}
+  {else}
+    <link rel="stylesheet" href="{$staticResourcePath}/styles/fonts.css">{\n}
+  {/if}
+  <link rel="stylesheet" href="{$staticResourcePath}/styles/main.css">{\n}
+
   <body unresolved>{\n}
   <gr-app id="app"></gr-app>{\n}
 {/template}