Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Apakah projek ssr react?

Apakah projek ssr react?

WBOY
Lepaskan: 2022-04-19 13:39:48
asal
2547 orang telah melayarinya

Sebagai tindak balas, ssr ialah singkatan daripada "Rendering Sisi Pelayan", yang bermaksud pemaparan bahagian pelayan ssr menjadikan komponen yang sama ke dalam rentetan HTML bahagian pelayan dan menghantarnya ke penyemak imbas, menggunakan teg statik ini; "Aktifkan" sebagai aplikasi interaktif sepenuhnya pada pelanggan.

Apakah projek ssr react?

Persekitaran pengendalian tutorial ini: Sistem Windows 10, bertindak balas versi 17.0.1, komputer Dell G3.

Apakah projek SSR React?

SSR: Rendering Sisi Pelayan

Penyambungan data dan HTML selesai pada bahagian pelayan , dan pelayan Pelanggan mengembalikan HTML yang disambung, dan klien hanya perlu memaparkannya.

Banyak projek bahagian hadapan kini adalah aplikasi satu halaman Untuk mencapai pengalaman pengguna yang baik dan memisahkan bahagian hadapan dan bahagian belakang, kami akan mencipta program pelanggan bebas secara berasingan. Kini terdapat banyak rangka kerja yang matang untuk membina aplikasi pelanggan Kami boleh menggunakannya secara langsung dan mengubah suainya untuk memenuhi keperluan projek.

Secara lalai, komponen boleh dikeluarkan dalam penyemak imbas untuk menjana DOM dan mengendalikan DOM untuk mencapai interaksi pengguna. Walau bagaimanapun, kadangkala mungkin untuk menjadikan komponen yang sama seperti rentetan HTML sebelah pelayan, menghantarnya terus ke penyemak imbas, dan akhirnya "mengaktifkan" penanda statik ini menjadi aplikasi interaktif sepenuhnya pada klien. Ini adalah pemaparan sebelah pelayan. .

Mengapa menggunakan SSR

Berbanding dengan SPA tradisional (Aplikasi Halaman Tunggal), kelebihan pemaparan sebelah pelayan (SSR) terutamanya:

SEO yang lebih baik, kerana perangkak enjin carian boleh melihat halaman yang diberikan sepenuhnya secara langsung.

Halaman aplikasi satu halaman meminta data melalui ajax dan menjana halaman secara dinamik Walau bagaimanapun, kerana perangkak enjin carian tidak boleh merangkak kandungan yang dihasilkan oleh JS, mereka tidak boleh merangkak apa-apa apabila menemui projek aplikasi satu halaman tidak kondusif untuk SEO, dan SSR akan menjana halaman di bahagian pelayan dan menghantarnya kepada pelanggan, dan halaman lengkap akan dilihat Ia lebih mudah untuk SEO untuk halaman seperti tentang, halaman kenalan, dll.

Selesaikan masalah skrin putih pada skrin pertama. Untuk keadaan rangkaian yang perlahan atau peranti yang lembap, tidak perlu menunggu semua JavaScript selesai memuat turun dan melaksanakan sebelum memaparkan penanda yang diberikan pelayan, jadi pengguna anda akan melihat halaman yang dipaparkan sepenuhnya dengan lebih cepat. Selalunya menghasilkan pengalaman pengguna yang lebih baik.

Apabila aplikasi satu halaman dimuatkan buat kali pertama, js berpakej (requirejs atau webpack berpakej) perlu dihantar ke penyemak imbas sebelum aplikasi boleh dimulakan, yang akan menjadi agak perlahan. Jika halaman web pra-diberikan pada bahagian pelayan dan dihantar terus ke penyemak imbas, pengguna akan melihat halaman yang diberikan sepenuhnya dengan lebih cepat, yang biasanya menghasilkan pengalaman pengguna yang lebih baik.

Aliran kerja SSR

Apakah projek ssr react?

Seperti yang anda boleh lihat daripada gambar di atas, pelayan hanya menjana kod HTML dan bahagian hadapan akan menjana satu main.js menyediakan HTML untuk kegunaan sisi pelayan. Beginilah cara React SSR berfungsi.

Pembelajaran yang disyorkan: "tutorial video bertindak balas"

Atas ialah kandungan terperinci Apakah projek ssr react?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan