Optimize JS (#1528)

* Remove unused cshtml template

* Move main js to head with `defer`

* Split web components into its own file

* Add bundle analyzer

Author: reakaleek

src/Elastic.Documentation.Site/Assets/custom-elements.ts

@@ -0,0 +1 @@
+import './web-components/VersionDropdown'

src/Elastic.Documentation.Site/Assets/main.ts

@@ -7,7 +7,6 @@ import { initNav } from './pages-nav'
 import { initSmoothScroll } from './smooth-scroll'
 import { initTabs } from './tabs'
 import { initTocNav } from './toc-nav'
-import './web-components/VersionDropdown'
 import 'htmx-ext-head-support'
 import 'htmx-ext-preload'
 import 'htmx.org'

src/Elastic.Documentation.Site/Layout/_Footer.cshtml

@@ -1,6 +1,5 @@
 @inherits RazorSlice<Elastic.Documentation.Site.GlobalLayoutViewModel>
 
-
 <footer class="py-12 px-6 w-full mx-auto bg-ink-dark">
 	<div class="max-w-(--max-layout-width) w-full mx-auto">
 	<div class="text-grey-20 text-[12px]">
@@ -34,5 +33,3 @@
 	</div>
 	</div>
 </footer>
-
-<script src="@Model.Static("main.js")"></script>

src/Elastic.Documentation.Site/Layout/_Head.cshtml

@@ -8,6 +8,8 @@
 		<link rel="preload" href="@fontFile" as="font" type="font/woff2" crossorigin>
 	}
 	<link rel="stylesheet preload" as="style" type="text/css" href="@Model.Static("styles.css")" crossorigin/>
+	<script src="@Model.Static("custom-elements.js")" defer></script>
+	<script src="@Model.Static("main.js")" defer></script>
 	@if (Model.CanonicalBaseUrl is not null)
 	{
 		<link rel="canonical" href="@Model.CanonicalUrl" />

src/Elastic.Documentation.Site/Layout/_Scripts.cshtml

@@ -12,6 +12,10 @@
     "fmt:write": "prettier --write ."
   },
   "targets": {
+    "customElements": {
+      "distDir": "_static",
+      "source": "Assets/custom-elements.ts"
+    },
     "js": {
       "distDir": "_static",
       "source": "Assets/main.ts"
@@ -33,6 +37,7 @@
     "@emotion/css": "11.13.5",
     "@emotion/react": "11.14.0",
     "@eslint/js": "9.30.1",
+    "@parcel/reporter-bundle-analyzer": "2.15.4",
     "@r2wc/react-to-web-component": "2.0.4",
     "@tailwindcss/postcss": "4.1.11",
     "@trivago/prettier-plugin-sort-imports": "5.2.2",