Merge pull request #231 from manNomi/fix/pupular-university-section

refactor :PopularUniversitySection 의미없는 최적화 삭제했습니다

Author: manNomi

src/app/(home)/_ui/PopularUniversitySection/index.tsx

@@ -1,62 +1,25 @@
-import dynamic from "next/dynamic";
-import { Suspense } from "react";
-
 import PopularUniversityCard from "./_ui/PopularUniversityCard";
 
 import { ListUniversity } from "@/types/university";
 
-// PopularUniversityCard를 동적 임포트
-const PopularUniversityCardDynamic = dynamic(() => import("./_ui/PopularUniversityCard"), {
-  ssr: false,
-  loading: () => (
-    <div className="relative w-[153px]">
-      <div className="h-[120px] w-[153px] animate-pulse rounded-lg bg-gray-200" />
-    </div>
-  ),
-});
-
 type PopularUniversitySectionProps = {
   universities: ListUniversity[];
 };
 
 const PopularUniversitySection = ({ universities }: PopularUniversitySectionProps) => {
-  const aboveFold = universities.slice(0, 3);
-  const belowFold = universities.slice(3);
-
   return (
     <div className="overflow-x-auto">
       <div className="flex gap-2">
-        {/* 첫 3장은 즉시 전송 – LCP 후보 */}
-        {aboveFold.map((university, index) => (
+        {universities.map((university, index) => (
           <PopularUniversityCard
-            priority={index === 0} // 첫 번째만 priority
-            loading="eager" // 즉시 로딩
-            fetchPriority="high" // 높은 우선순위
-            quality={index === 0 ? 60 : 55} // LCP는 60, 나머지는 55로 최적화
             key={university.id}
             university={university}
+            priority={index === 0} // 첫 번째만 priority로 LCP 최적화
+            loading={index < 3 ? "eager" : "lazy"} // 첫 3개는 즉시, 나머지는 지연 로딩
+            fetchPriority={index === 0 ? "high" : "low"} // 첫 번째만 높은 우선순위
+            quality={index === 0 ? 60 : 50} // 첫 번째는 고품질, 나머지는 압축
           />
         ))}
-
-        {/* 나머지는 동적 렌더링으로 위임 */}
-        {belowFold.map((university) => (
-          <Suspense
-            key={university.id}
-            fallback={
-              <div className="relative w-[153px]">
-                <div className="h-[120px] w-[153px] animate-pulse rounded-lg bg-gray-200" />
-              </div>
-            }
-          >
-            <PopularUniversityCardDynamic
-              university={university}
-              priority={false}
-              loading="lazy"
-              fetchPriority="low"
-              quality={50} // 동적 로딩 이미지는 50으로 최대 압축
-            />
-          </Suspense>
-        ))}
       </div>
     </div>
   );