Apakah SPA dan MPA dalam vue? Apakah perbezaan antara kedua-duanya?

Artikel ini akan memperkenalkan anda kepada halaman tunggal (SPA) dan berbilang halaman (MPA) Vue dan melihat perbezaan antara SPA dan MPA, saya harap ia akan membantu anda!

Apakah itu SPA

SPA Nama penuh ialah Single Page Application, iaitu aplikasi satu halaman. Ia juga biasanya dipanggil CSR (Penyerahan Sisi Pelanggan), iaitu pemaparan sebelah pelanggan. Sumber yang diperlukan, seperti HTML, CSS dan JS, dimuatkan dalam satu permintaan, iaitu, dimuatkan secara dinamik tanpa menyegarkan. Penyampaian Penyemak Imbas (Pelanggan), seperti namanya, bermakna semua pemaparan halaman, pemprosesan logik, penghalaan halaman dan permintaan antara muka berlaku dalam penyemak imbas. Untuk SPA, penukaran halaman adalah bertukar antara komponen atau paparan. [Cadangan berkaitan: "Tutorial vue.js"]

Ringkasnya, aplikasi SPA hanya mempunyai satu fail html Dalam vue, anda boleh menggunakan vue-router untuk menukar komponen secara setempat Muat semula seluruh halaman untuk mencapai teknologi penukaran halaman tanpa muat semula

Aplikasi SPA mengelakkan gangguan yang disebabkan oleh pemaparan halaman pada pelayan. Ini menghapuskan masalah terbesar yang biasanya dihadapi oleh dunia pembangunan web dalam menyediakan pengalaman pengguna yang lancar.

Prinsip SPA

js akan merasakan perubahan url melalui ini, anda boleh menggunakan js untuk memantau perubahan nilai cincang dalam url , melalui peristiwa onhashchange Memandangkan perubahan nilai cincang tidak akan menyebabkan penyegaran atau lompatan halaman, apabila perubahan cincang dikesan, komponen boleh ditukar secara dinamik dan teknologi penukaran halaman tanpa penyegaran boleh direalisasikan

Nota. Dalam Vue dalam vue-router tidak menyokong acara onhashchange Ia berharap anda menggunakan fungsi cangkuk dalam vue-router untuk menyelesaikan masalah

Kelebihan SPA

<.>

1. Penukaran halaman pantas

• Setiap kali halaman bertukar dan melompat, tidak perlu membuat

permintaan fail, yang menjimatkan banyak

kelewatan penghantaran Kami menukar halaman dengan cepat. htmlhttp

2. Pengalaman pengguna yang baik

• Bertukar antara serpihan halaman adalah pantas, termasuk peranti mudah alih, terutamanya apabila persekitaran rangkaian lemah, kerana komponen telah dimuatkan terlebih dahulu , tidak perlu menghantar permintaan rangkaian, jadi pengalaman pengguna adalah baik

Kelemahan SPA

1 Kelajuan pemuatan skrin pertama adalah perlahan

• Diperlukan pada skrin pertama Permintaan

sekali dan hantar permintaan

pada masa yang sama Selepas dua permintaan kembali, skrin pertama akan dipaparkan. Berbanding dengan aplikasi berbilang halaman, masa skrin pertama adalah perlahan. htmljs

2. Tidak mudah untuk SEO

• Kesan SEO adalah lemah, kerana enjin carian hanya mengenali kandungan dalam

, bukan kandungan

, dan satu halaman Kandungan aplikasi dijana oleh html pemaparan Enjin carian tidak mengenali bahagian kandungan ini dan tidak akan memberikan kedudukan yang baik Ini akan membawa kepada kedudukan halaman web yang lemah yang dibuat oleh aplikasi SPA di Baidu dan Google. jsjsApakah itu MPA

Aplikasi berbilang halaman

merujuk kepada aplikasi dengan berbilang halaman bebas (berbilang halaman html Setiap halaman mesti memuatkan js, css, dsb.) berulang kali. Sumber berkaitan. Lompatan aplikasi berbilang halaman memerlukan muat semula sumber halaman penuh. Perbezaan terbesar antara MPAMultiPage Application dan

ialah penukaran penghalaan halaman dikawal oleh lompatan dokumen penyemak imbas asli (

). Lompatan halaman mengembalikan HTML. SPAnavigating across documents

Kelebihan MPA

1 Skrin pertama dimuatkan dengan cepat

• Apabila kami melawat halaman, The. pelayan mengembalikan

dan halaman akan dipaparkan Proses ini hanya melalui satu permintaan

, jadi halaman dipaparkan dengan cepat. htmlHTTP

2. Kesan SEO adalah baik

• Apabila enjin carian menentukan kedudukan halaman web, mereka mesti memberi berat kepada halaman web berdasarkan kandungan halaman web untuk menentukan kedudukan laman web. Enjin carian boleh mengenali

kandungan, dan semua kandungan setiap halaman kami diletakkan di

, jadi aplikasi berbilang halaman jenis ini mempunyai kesan ranking SEO yang baik. htmlhtmlKelemahan MPA

1. Pensuisan halaman adalah perlahan

• Kerana setiap lompatan memerlukan penghantaran permintaan HTTP. Apabila melompat ke sana ke mari antara halaman, ketinggalan yang jelas akan berlaku, menjejaskan pengalaman pengguna.

2. Pengalaman pengguna yang buruk

• Jika rangkaian perlahan, halaman itu akan mudah tidak dimuatkan untuk masa yang lama, dan pengalaman pengguna sangat teruk

Mengapa perlu menggunakannya? menyediakan beberapa teknologi lain untuk menyelesaikan masalah ini, seperti teknologi pemaparan sisi pelayan (SSR), boleh diselesaikan dengan sempurna melalui teknologi ini, aplikasi satu halaman sebenarnya merupakan penyelesaian pembangunan halaman yang sempurna untuk bahagian hadapan -akhir.

Perbandingan antara SPA dan MPA

• Analisis perbandingan antara kedua-duanya adalah seperti yang ditunjukkan dalam jadual di bawah

Atas ialah kandungan terperinci Apakah SPA dan MPA dalam vue? Apakah perbezaan antara kedua-duanya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!