feat(perf): add loading.tsx skeletons for async marketing routes

Fixes #1243

Add sibling loading.tsx files for all 6 async route segments that were
missing instant loading UI, causing blank screens during navigation on
slow networks or cold caches.

Routes covered:
- /docs/[[...slug]]   — awaits getDocPage + MDX body
- /blog               — awaits source.getPages()
- /blog/[slug]        — awaits params + MDX body
- /changelog          — awaits source.getPages()
- /free               — awaits getModels() fetch
- /free/[model_slug]  — awaits Promise.all([getModel, getAllModels])

Each loading.tsx is a Server Component returning an animate-pulse
skeleton that matches its route's layout (header, content area,
grid/table/timeline as appropriate). Uses the Skeleton component and
Tailwind classes already present in the project.

Follows the pattern established in:
- app/dashboard/[search_space_id]/logs/loading.tsx
- app/dashboard/[search_space_id]/new-chat/loading.tsx

surfsense_web/app/(home)/changelog/loading.tsx

@@ -0,0 +1,63 @@
+import { Skeleton } from "@/components/ui/skeleton";
+
+export default function ChangelogLoading() {
+	return (
+		<div className="min-h-screen relative pt-20">
+			{/* Header */}
+			<div className="border-b border-border/50">
+				<div className="max-w-5xl mx-auto relative">
+					<div className="p-6 flex items-center justify-between">
+						<div>
+							{/* Breadcrumb */}
+							<div className="flex items-center gap-2 mb-4">
+								<Skeleton className="h-4 w-10" />
+								<Skeleton className="h-4 w-3" />
+								<Skeleton className="h-4 w-20" />
+							</div>
+							<Skeleton className="h-10 w-48 mb-2" />
+							<Skeleton className="h-4 w-80" />
+						</div>
+					</div>
+				</div>
+			</div>
+
+			{/* Timeline */}
+			<div className="max-w-5xl mx-auto px-6 lg:px-10 pt-10 pb-20">
+				<div className="relative">
+					{Array.from({ length: 3 }).map((_, i) => (
+						<div key={i} className="relative flex flex-col md:flex-row gap-y-6 mb-10">
+							{/* Left: date + version */}
+							<div className="md:w-48 flex-shrink-0">
+								<Skeleton className="h-4 w-24 mb-3" />
+								<Skeleton className="h-12 w-12 rounded-xl" />
+							</div>
+
+							{/* Right: content */}
+							<div className="flex-1 md:pl-8 relative pb-10">
+								<div className="space-y-4">
+									{/* Title */}
+									<Skeleton className="h-7 w-2/3" />
+									{/* Tags */}
+									<div className="flex gap-2">
+										<Skeleton className="h-6 w-16 rounded-full" />
+										<Skeleton className="h-6 w-20 rounded-full" />
+									</div>
+									{/* Body paragraphs */}
+									<div className="space-y-2">
+										<Skeleton className="h-4 w-full" />
+										<Skeleton className="h-4 w-full" />
+										<Skeleton className="h-4 w-3/4" />
+									</div>
+									<div className="space-y-2">
+										<Skeleton className="h-4 w-full" />
+										<Skeleton className="h-4 w-5/6" />
+									</div>
+								</div>
+							</div>
+						</div>
+					))}
+				</div>
+			</div>
+		</div>
+	);
+}