Rumah  >  Artikel  >  hujung hadapan web  >  Menguasai Seterusnya.js: Perjalanan Saya dari SSG ke SSR Melalui Percubaan dan Ralat

Menguasai Seterusnya.js: Perjalanan Saya dari SSG ke SSR Melalui Percubaan dan Ralat

WBOY
WBOYasal
2024-07-30 10:09:21501semak imbas

Mastering Next.js: My Journey from SSG to SSR Through Trial and Error

Hai Kawan-kawan! Dalam blog ini saya ingin berkongsi dengan anda projek baharu seterusnya yang telah saya usahakan untuk tempoh yang lama. Ia benar-benar membawa saya kembali ke masa saya memulakan perjalanan saya dengan timbunan MERN ketika saya pernah bergelut dalam setiap projek yang saya buat tetapi setelah melalui semua kesusahan itu, saya masih boleh mengatakan bahawa terjebak pada beberapa topik masih membuat saya terkejut. .

Saya ingin berkongsi dengan anda semua tentang perbezaan antara SSG dan SSR.
Saya sedang melakukan projek kecil untuk membuat laman blog dan saya ingin menjana blog pada masa binaan tetapi Ia tidak menghasilkan dan selepas 1 minggu mencari dan merayau di internet belajar tentang perbezaan akhirnya saya faham apa perbezaannya.

pengenalan

Next.js ialah rangka kerja React yang hebat yang dibangunkan oleh vercel. Ia mempunyai beberapa ciri terbina dalam untuk meningkatkan pembangunan dan pengalaman pengguna.
Beberapa ciri ialah:

  • Rendering Statik & Pelayan Hibrid : Ia menyokong kedua-dua SSR dan SSG, membolehkan pembangun memilih mana-mana yang terbaik mengikut kes penggunaan mereka.
  • Laluan API : Ia membolehkan anda membina titik akhir API dalam apl nextjs itu sendiri yang menghapuskan keperluan untuk perkhidmatan hujung belakang yang berasingan untuk tugas API mudah.
  • Pemisahan dan Pengoptimuman Kod Automatik : Ia membahagikan kod dan hanya menghantar javasript yang diperlukan ke penyemak imbas dan mempunyai banyak pengoptimuman terbina dalam seperti pengoptimuman imej, binaan yang lebih pantas dan lain-lain.
  • Penghalaan sistem-fail : Ia mempunyai penghalaan sistem fail (mana-mana anda menggunakan penghala apl atau halaman) mencipta laluan secara automatik.
  • Sokongan TypeScript : Adalah disyorkan untuk mengekod dalam skrip taip kerana ia menangkap banyak ralat dalam masa jalan sahaja yang jika tidak digunakan boleh menyebabkan masalah dalam masa binaan.

SSG VS SSR

Penjanaan Sisi Pelayan (SSG)

SSG menjana halaman HTML statik pada masa binaan. Kandungannya telah diprapaparkan yang bermaksud ia tidak berubah sehingga anda membina semula tapak tersebut.
Ia adalah yang terbaik untuk halaman yang tidak terlalu kerap berubah seperti halaman Pemasaran atau dokumentasi yang tidak berubah terlalu kerap.
Ia pada asasnya dijana semasa masa binaan dan bersifat statik supaya ia dimuatkan dengan sangat cepat.

Dalam hal ini untuk mendapatkan laluan Dinamik yang anda ingin berikan pada masa binaan anda boleh menggunakan getStaticParams. Anda boleh membaca lebih lanjut tentang ini di sini. Pautan

Rendering Sisi Pelayan(SSR)

SSR menjana halaman HTML pada setiap permintaan. Pelayan memaparkan HTML secara dinamik untuk setiap permintaan masuk. Ia adalah yang terbaik untuk halaman yang perlu dinamik dan terkini pada setiap permintaan. Ini termasuk papan pemuka pengguna, suapan berita dan kandungan lain yang kerap berubah atau khusus pengguna.
Memandangkan HTML dijana pada setiap permintaan jadi ia lebih perlahan daripada SSG tetapi ia memastikan kandungan sentiasa segar dan terkini.

Pemikiran Akhir

Perjalanan saya dengan Next.js, SSG dan SSR telah dipenuhi dengan peluang pembelajaran. Setiap kesilapan dan cabaran telah memperdalam pemahaman saya dan meningkatkan kemahiran menyelesaikan masalah saya. Saya menggalakkan anda untuk mencuba kedua-dua SSG dan SSR dalam projek anda untuk melihat cara mereka boleh memenuhi keperluan anda dengan sebaiknya.

Terima kasih kerana membaca! Saya harap pengalaman saya membantu anda dalam perjalanan Next.js anda. Jangan ragu untuk berkongsi pengalaman anda sendiri atau bertanya soalan dalam komen di bawah. Mari kita terus belajar dan berkembang bersama-sama sebagai sebuah komuniti. Selamat mengekod!

Atas ialah kandungan terperinci Menguasai Seterusnya.js: Perjalanan Saya dari SSG ke SSR Melalui Percubaan dan Ralat. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya:JS: Petua VSCodeArtikel seterusnya:JS: Petua VSCode