بهینه سازی getStaticPaths

پرسیده شده
فعالیت 1209 روز پیش
دیده شده 379 بار
0

import React from 'react'

import { useRouter } from 'next/router'

import ShopLayout from 'components/layouts/Shop'

import SingleHeader from 'components/products/single/Header'

import SingleItem from 'components/products/single'

import * as API from 'services/api'


 

export default function SingleProduct ({ product, comments }) {

const router = useRouter()

const { id } = router.query

return (

<ShopLayout title="جزئیات محصول">

<SingleHeader/>

<SingleItem product={product} comments={comments}/>

</ShopLayout>

)

}

export async function getStaticProps (context) {

const { id } = context.params

const product = await API.get(`/api/v1/products/${id}`)

const comments = await API.get(`/api/v1/products/${id}/comments`)

return {

props: {

product: product.data,

comments: comments.data

}

}

}

export async function getStaticPaths () {

const response = await API.get('/api/v1/products')

const paths = response.data.map(product => ({ params: { id: product.id } }))

return {

paths,

fallback: true

}

}

 

با سلام وقتتون بخیر

     استاد از اون جایی که با هر بار باز شدن صفحه سینگل product، تابع ()getStaticPaths یه درخاست به سمت سرور میفرسته برای گرفتن تمامی محصولات که فقط آدی را از اون ها استخراج که آیا بهینه تر نیست! که به عنوان مثال با ورود کار بر به سایت آی دی تمام محصولات را توی یک فایل یا مثلا localStorage ذخیره کنیم و توی صفحه ی سینگل در تابع ()getStaticPaths به جای ارسال درخاست تکراری به سرور از اون فایل استفاده کنیم؟ 

فایل پیوست

Soroosh
Soroosh

23 دی 99

0
حذف شده

سلام خدمت شما. لطفا برای ارسال کد حتما از بخش اضافه کردن کد ویرایشگر استفاده کنید.

نکته ای که شما گفتید قطعا می تونه یک روش بهینه باشه اما باید حواستون به تغییرات محصولات در سمت سرور باشه و مثلا بگیم هم 1 ساعت این اطلاعات به روز رسانی بشن.

فایل پیوست

کیوان علی محمدی

توسط

کیوان علی محمدی

24 دی 99

جلسه استفاده از getStaticPaths