Prioritize initial /grid photos

src/app/grid/page.tsx

@@ -36,7 +36,7 @@ export default async function GridPage() {
     photos.length > 0
       ? <SiteGrid
         contentMain={<div className="space-y-0.5 sm:space-y-1">
-          <PhotoGrid {...{ photos }} />
+          <PhotoGrid {...{ photos, photoPriority: true }} />
           <Suspense>
             <MorePhotosGrid
               initialOffset={INFINITE_SCROLL_MULTIPLE_GRID}

src/components/ImageSmall.tsx

@@ -7,18 +7,21 @@ export default function ImageSmall({
   alt,
   aspectRatio,
   blurData,
+  priority,
 }: {
   className?: string
   src: string
   alt: string
   aspectRatio: number
   blurData?: string
+  priority?: boolean
 }) {
   return (
     <ImageBlurFallback {...{
       className,
       src,
       alt,
+      priority,
       blurDataURL: blurData,
       placeholder: 'blur',
       width: IMAGE_SMALL_WIDTH,

src/photo/PhotoGrid.tsx

@@ -12,6 +12,7 @@ export default function PhotoGrid({
   tag,
   camera,
   simulation,
+  photoPriority,
   fast,
   animate = true,
   animateOnFirstLoadOnly,
@@ -24,6 +25,7 @@ export default function PhotoGrid({
   tag?: string
   camera?: Camera
   simulation?: FilmSimulation
+  photoPriority?: boolean
   fast?: boolean
   animate?: boolean
   animateOnFirstLoadOnly?: boolean
@@ -72,6 +74,7 @@ export default function PhotoGrid({
             camera,
             simulation,
             selected: photo.id === selectedPhoto?.id,
+            priority: photoPriority,
           }} />
         </div>).concat(additionalTile ?? [])}
     />

src/photo/PhotoSmall.tsx

@@ -15,6 +15,7 @@ export default function PhotoSmall({
   simulation,
   selected,
   showAdminMenu,
+  priority,
 }: {
   photo: Photo
   tag?: string
@@ -22,6 +23,7 @@ export default function PhotoSmall({
   simulation?: FilmSimulation
   selected?: boolean
   showAdminMenu?: boolean
+  priority?: boolean
 }) {
   return (
     <Link
@@ -48,6 +50,7 @@ export default function PhotoSmall({
         blurData={photo.blurData}
         className="w-full"
         alt={titleForPhoto(photo)}
+        priority={priority}
       />
     </Link>
   );