Rumah  >  Artikel  >  hujung hadapan web  >  Rendering Sebelah Pelanggan (CSR)

Rendering Sebelah Pelanggan (CSR)

DDD
DDDasal
2024-10-25 06:50:29739semak imbas

Rendering Sisi Pelanggan (CSR) ialah teknik biasa dalam pembangunan web moden, digunakan untuk mencipta aplikasi interaktif dan dinamik. Dengan teknik ini, kami mengalih keluar tanggungjawab untuk memaparkan halaman daripada pelayan dan membawanya ke bahagian klien, membiarkan pelayan menjaga perkara yang paling penting baginya, iaitu peraturan perniagaan. Pemisahan ini membolehkan anda menawarkan pengalaman pengguna yang lebih lancar dan dinamik dan membolehkan penciptaan jenis aplikasi baharu. Kelebihannya adalah pelbagai, tetapi pada masa yang sama terdapat trade-off yang mesti dinilai dalam setiap projek sama ada ia berbaloi atau tidak menggunakan teknik ini.

Apakah itu Rendering Sebelah Pelanggan (CSR)?

Perenderan sisi pelanggan atau hanya CSR, ialah teknik pembangunan aplikasi dinamik di mana pemaparan antara muka berlaku pada bahagian pelanggan (penyemak imbas). Ini berbeza daripada cara ia dilakukan sebelum teknik ini menjadi popular, di mana pelayan bertanggungjawab untuk memaparkan halaman, mengembalikan fail HTML kepada klien dengan semua kandungan telah dipasang.

Dengan CSR kami meneruskan peranan untuk memaparkan halaman kepada penyemak imbas (pelanggan). Pelayan hanya menghantar fail HTML asas yang secara dalaman mengandungi pautan ke fail Javascript. Setelah menerima HTML ini, penyemak imbas memuat turun fail Javascript yang dirujuk yang bertanggungjawab untuk memaparkan kandungan halaman. Kelebihan CRS ialah apabila fail Javascript dimuatkan, kandungan boleh dikemas kini secara dinamik tanpa bergantung pada permintaan baharu kepada pelayan. Menjadikan pengalaman penyemakan imbas lebih lancar untuk pengguna. CSR biasanya digunakan dalam aplikasi yang memerlukan interaksi masa nyata atau kandungan yang sangat dinamik, contohnya, dalam aplikasi satu halaman (SPA). Menjadi penyelesaian untuk halaman dalaman, papan pemuka atau sistem yang tidak memerlukan SEO.

Bagaimanakah Perenderan Sebelah Pelanggan berfungsi?

Contoh aliran rendering menggunakan Rendering Sisi Pelanggan ialah:

  1. Pengguna mengakses halaman web, yang secara dalaman menghantar permintaan kepada pelayan.
    Client-Side Rendering (CSR)

  2. Pelayan menerima permintaan dan membalas dengan menghantar HTML asas yang mengandungi hampir hanya pautan ke fail JavaScript dan CSS.
    Client-Side Rendering (CSR)

  3. Pelayar memuat turun HTML ini dan, setelah selesai, menghantar permintaan baharu untuk memuat turun fail JavaScript dan CSS yang dirujuk dalam HTML.
    Client-Side Rendering (CSR)

  4. Dengan fail JavaScript telah dimuat turun, ia akan dilaksanakan dan proses pemaparan halaman akan dijalankan.
    Client-Side Rendering (CSR)

  5. Mulai saat ini, JavaScript mengawal keseluruhan aplikasi dan interaksi pengguna, mengemas kini kandungan halaman secara dinamik, tanpa permintaan baharu kepada pelayan.

Client-Side Rendering (CSR)

Kelebihan Perenderan Sebelah Pelanggan

  • Kelajuan: Navigasi antara halaman dalam CSR adalah sangat pantas, kerana tidak perlu membuat beberapa permintaan kepada pelayan selepas pemuatan awal.
  • Pengalaman Pengguna: Penggunaan CSR sangat difahami dan berfungsi dengan baik, memberikan pengalaman yang serupa dengan aplikasi asli.
  • Pemisahan Kebimbangan: CSR membolehkan pemisahan antara Front-end dan Back-end, membolehkan Front-end diurus sepenuhnya oleh JS, manakala Back-end hanya menjaga data dan logik perniagaan .

Kelemahan Perenderan Sebelah Pelanggan

  • Muatan JS yang tinggi: Dalam aplikasi besar, fail JS boleh menjadi sangat berat, yang boleh membahayakan pengalaman pengguna, terutamanya pada beban aplikasi awal.
  • Masalah SEO: Memandangkan kandungan halaman dipaparkan pada bahagian pelanggan, enjin carian mengalami kesukaran mengindeks kandungan, kerana mereka memerlukan HTML yang diberikan dan dalam aplikasi dengan CSR HTML boleh dikatakan kosong. Ini boleh menjadi kelemahan untuk aplikasi yang bergantung pada SEO seperti halaman pendaratan dan e-dagang.
  • Bergantung kepada pelanggan: Memandangkan aplikasi berjalan pada bahagian klien, terdapat pergantungan pada jumlah sumber yang dimilikinya, yang boleh menjejaskan pengalaman pengguna secara negatif jika peranti mereka mempunyai sedikit sumber. Tambahan pula, jika pelaksanaan JavaScript peranti dilumpuhkan, aplikasi tidak akan berfungsi.

Kesimpulan

Dalam artikel ini, kami membentangkan perkara penting utama tentang penggunaan CSR, membentangkan asas serta kelebihan dan kekurangannya. Melalui aliran CSR, kita mengetahui peringkat utama kitaran hayat CSR. Kita dapat melihat kepentingan JavaScript dalam menyediakan aplikasi yang berjalan sepenuhnya di sisi klien. Walaupun manfaat CSR berkaitan dengan pengalaman pengguna, jelas bahawa teknik pemaparan ini mempunyai beberapa kelemahan yang berkaitan dengan beban JavaScript yang tinggi dan masalah berkaitan SEO.

Untuk mengatasi batasan CSR, kami mempunyai penyelesaian seperti Penjanaan Tapak Statik (SSG) dan Perenderan Sebelah Pelayan (SSR). Dalam SSG, halaman dijana secara statik semasa tempoh bina, menghasilkan HTML sedia untuk dihantar kepada pelanggan. Dan dalam kes SSR, pemaparan dilakukan pada bahagian pelayan, yang bertindak balas dengan HTML yang telah diberikan kepada pelanggan.

Atas ialah kandungan terperinci Rendering Sebelah Pelanggan (CSR). 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