diff --git a/frontend/pages/product/[id].vue b/frontend/pages/product/[id].vue
index a35503b..1de326a 100644
--- a/frontend/pages/product/[id].vue
+++ b/frontend/pages/product/[id].vue
@@ -9,7 +9,9 @@ const id = route.params.id as string | undefined;
 
 const { suspense } = useGetProduct(id);
 
-onServerPrefetch(async () => {
+// ssr
+
+await useAsyncData(async () => {
     const response = await suspense();
 
     if (response.isError) {
@@ -23,7 +25,7 @@ onServerPrefetch(async () => {
 </script>
 
 <template>
-    <div class="w-full flex flex-col">
+    <div class="w-full flex flex-col gap-20">
         <ProductHero />
         <ProductVideo />
         <ProductComments />