perf(templates): add defer attribute to main.js script tags

- Add defer attribute to all main.js script includes across 22 template files
- Improves page load performance by allowing HTML parsing to continue without blocking
- Maintains script execution order while enabling parallel resource loading

This optimization reduces page render blocking and improves perceived load times
across all admin and user-facing pages that include the main.js bundle.

Affected pages include: admin dashboard, library management, settings, user
management, analytics, bookshelf, collections, conflicts, custom sections,
devices, documentation, profile, progress tracking, queue, and authentication
pages (login/register).
This commit is contained in:
2026-03-12 09:04:13 -04:00
parent b754f0ddce
commit 96e206b671
21 changed files with 24 additions and 24 deletions
+3 -3
View File
@@ -10,7 +10,7 @@ templ Devices(user User, devices []handlers.DeviceInfo, pendingRegistrations []P
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Device Management - Bookhoard</title>
<script src="/static/htmx.min.js"></script>
<script src="/static/main.js"></script>
<script src="/static/main.js" defer></script>
<link href="/static/style.css" rel="stylesheet"/>
</head>
<body class="theme-{ user.Theme }" x-data="devices" x-init="setupEventDelegation()">
@@ -112,7 +112,7 @@ templ Devices(user User, devices []handlers.DeviceInfo, pendingRegistrations []P
style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border);"
/>
<button
@click="copyToClipboard(document.getElementById('sync-url-{ device.ID }').value, 'Kobo sync URL')"
@click="$store.devices.copyToClipboard(document.getElementById('sync-url-{ device.ID }').value, 'Kobo sync URL')"
class="px-3 py-2 text-xs rounded hover:opacity-80"
style="background-color: var(--accent); color: white;"
>
@@ -136,7 +136,7 @@ templ Devices(user User, devices []handlers.DeviceInfo, pendingRegistrations []P
style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border); font-family: monospace;"
/>
<button
@click="copyToClipboard(document.getElementById('auth-token-{ device.ID }').value, 'Auth token')"
@click="$store.devices.copyToClipboard(document.getElementById('auth-token-{ device.ID }').value, 'Auth token')"
class="px-3 py-2 text-xs rounded hover:opacity-80"
style="background-color: var(--accent); color: white;"
>