actually turn on ssg, I think

Author: jahooma

web/src/app/api/agents/route.ts

@@ -264,15 +264,16 @@ export async function GET() {
 
     const response = NextResponse.json(result)
 
-    // Add cache headers for CDN and browser caching
+    // Add optimized cache headers for better performance
     response.headers.set(
       'Cache-Control',
-      'public, max-age=600, s-maxage=600, stale-while-revalidate=600'
+      'public, max-age=300, s-maxage=600, stale-while-revalidate=3600'
     )
 
-    // Add additional headers for better CDN caching
+    // Add compression and optimization headers
     response.headers.set('Vary', 'Accept-Encoding')
     response.headers.set('X-Content-Type-Options', 'nosniff')
+    response.headers.set('Content-Type', 'application/json; charset=utf-8')
 
     return response
   } catch (error) {

web/src/app/store/loading.tsx

@@ -0,0 +1,56 @@
+export default function StoreLoading() {
+  return (
+    <div className="container mx-auto py-8 px-4">
+      <div className="max-w-7xl mx-auto">
+        {/* Header skeleton */}
+        <div className="mb-12">
+          <div className="flex items-center justify-between mb-4">
+            <div>
+              <div className="h-10 w-64 bg-muted animate-pulse rounded mb-2" />
+              <div className="h-6 w-96 bg-muted animate-pulse rounded" />
+            </div>
+          </div>
+        </div>
+
+        {/* Search and filters skeleton */}
+        <div className="mb-8">
+          <div className="flex flex-col md:flex-row gap-4 items-stretch md:items-center md:justify-end">
+            <div className="w-full md:flex-1 md:max-w-[200px]">
+              <div className="h-10 bg-muted animate-pulse rounded" />
+            </div>
+            <div className="flex gap-3 w-full md:w-auto">
+              <div className="h-10 w-40 bg-muted animate-pulse rounded" />
+              <div className="h-10 w-32 bg-muted animate-pulse rounded" />
+            </div>
+          </div>
+        </div>
+
+        {/* Editor's choice skeleton */}
+        <div className="mb-12">
+          <div className="mb-6">
+            <div className="h-8 w-48 bg-muted animate-pulse rounded mb-2" />
+            <div className="h-4 w-full max-w-2xl bg-muted animate-pulse rounded" />
+          </div>
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+            {Array.from({ length: 3 }).map((_, i) => (
+              <div key={i} className="h-56 bg-muted animate-pulse rounded-lg" />
+            ))}
+          </div>
+        </div>
+
+        {/* All agents skeleton */}
+        <div className="mt-12">
+          <div className="mb-6">
+            <div className="h-8 w-32 bg-muted animate-pulse rounded mb-2" />
+            <div className="h-4 w-80 bg-muted animate-pulse rounded" />
+          </div>
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+            {Array.from({ length: 12 }).map((_, i) => (
+              <div key={i} className="h-56 bg-muted animate-pulse rounded-lg" />
+            ))}
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}

web/src/app/store/page.tsx

@@ -83,6 +83,8 @@ export const metadata: Metadata = {
 
 // Enable static site generation with ISR
 export const revalidate = 60 * 10 // Revalidate every 10 minutes
+export const dynamic = 'force-static'
+export const fetchCache = 'force-cache'
 
 // Generate static params for common search/sort combinations
 export async function generateStaticParams() {