Single-Page Application vs Multiple-Page Application

-

SPA vs MPA


Aplikasi web berkembang dengan sangat cepat. berbagai inovasi telah dilakukan agar pengguna mendapatkan pengalaman yang lebih cepat dan lebih baik. diantara teknologi dalam pengembangan aplikasi web terdapat konsep Single-Page Application (SPA) dan juga Multiple-Page Application (MPA).

Single-Page Application (SPA)

Single-Page Application atau dalam bahasa indonesia Aplikasi dalam satu halaman adalah aplikasi web yang berjalan pada browser kita yang tidak membutuhkan reload halaman selama penggunaannya. Contoh SPA misalnya gmail yang kamu buka dari browser. Jika kamu mau mengamati ketika kamu membuka gmail coba klik kanan kemudian pilih View page source. Kamu akan mendapati isinya hanya berupa skrip javascript hampir tanpa tag khas html (div,span,img,br dsb). SPA untuk berpindah ke "halaman lain", SPA tidak me-reload namun hanya merubah salah satu atau beberapa elemen pada halaman yang pertama kali di load. Hal ini tentu saja menjadikan aplikasi web dengan SPA menjadi lebih cepat.

Kelebihan Single-Page Application (SPA)

Berikut beberapa kelebihan yang dimiliki oleh aplikasi dengan konsep SPA :

  1. Penggunaan aplikasi relatif lebih cepat dibandingkan dengan Multiple-Page Application.
  2. Proses debung cenderung lebih mudah melalui browser (console).
  3. Satu kode dapat digunakan untuk multiple platform. Dengan javascript kita dapat membuat website, desktop, android maupun iOS. Beberapa framework untuk membangun mobile apps dengan javascript contohnya react native dan ionic(berbasiskan angular).

Kelemahan Single-Page Application (SPA)

Walaupun terdapat kelebihan namun ada pula kekurangan dari SPA, diantaranya :

  1. Memiliki waktu inisiasi yang lebih lambat daripada Multiple-Page Application. Ini disebabkan karena browser harus mendownload aplikasi yang dijalankan. Artinya untuk load pertama kali biasanya lebih lambat dari MPA.
  2. Bergantung pada javascript. Jika user mematikan javascript maka aplikasi tidak dapat dijalankan.

Multiple-Page Application

Multiple-Page Application atau mungkin dalam bahasa indonesia Aplikasi dalam banyak halaman adalah aplikasi web yang lebih tradisional, yaitu setiap terjadi perubahan tampilan aplikasi melakukan request untuk satu halaman penuh kemudian browser me-render halaman baru dari response server. Jadi, setiap aplikasi memerlukan perubahan maka browser akan menampilkan halaman baru yang diambil penuh dari server. Hal ini menjadikan MPA tidak lebih cepat dari SPA.
Contoh MPA adalah blog ini. Ketika kamu membuka artikel baru, maka server akan memberikan halaman baru yang benar benar baru untuk kamu. Coba periksa dengan klik kanan kemudian pilih View page source. Kamu akan mendapati isinya terdapat tag tag html.

Kelebihan Multiple-Page Application

Kelebihan yang dimiliki Multiple-Page Application antara lain :

  1. Lebih mudah untuk melakukan SEO. walaupun saat ini SPA juga sudah mendukung untuk SEO.
  2. Proses inisiasi cenderung lebih cepat daripada SPA. 


Kekurangan Multiple-Page Application


  1. Untuk berganti halaman tidak secepat SPA.
  2. Proses development lebih komplek.



Komentar

Posting Komentar

Postingan populer dari blog ini

Rasanya Baru Kemarin

-
Gambar
Ditengah kesibukan koding, hari ini harus mengantar plus menunggu anak mbarep masuk kelas 1 MI. Rasanya baru kemarin, aku sarapan telur dadar buatan ibuk sebelum berangkat sekolah, berjalan santai menuju sekolah walau waktu sudah hampir jam 7 pagi sambil bawa sejumput garam yang ku untut i sepanjang perjalanan, kalau ditanya kenapa kok nguntut i garam biasanya aku jawab "ini garam beryodium,marakne pinter!" jawabku asal dengan referensi iklan garam beryodium di tv yang waktu itu sedang booming booming nya. Padahal ya sebenarnya aku suka aja sama garam... Di tempat les, Sempat juga dapat julukan si kanram "makan garam", tapi bukan karena nguntuti garam. Tapi pas ujian bahasa Indonesia ada soal apa arti "makan garam" dengan asal aku jawab "Asin!" Nah.. pas dicocokin tuh jadi bahan kecrok an pak guru dan teman2 les.. la Yang jawab gitu cuma aku.. padahal harusnya, makan garam memiliki arti "Banyak pengalaman". Hari ini, tak terasa saya su...
Baca selengkapnya

Bermain dengan Wordpress REST API v2

-
Gambar
Judulnya Bermain, berarti bukan tutorial ya. Buat kamu2 yang mau eksperimen mengakses wordpress rest api dengan php curl, mungkin ini akan bermanfaat. kemarin saya mencoba Worpress REST API yang katanya nge bug sebelumnya (tapi udah diperbaiki bungnya kok), pengen nyoba bikin aplikasi sendiri nge POST ke wordpress pakai curl. ini scriptnya : <?php $curl = curl_init(); curl_init_http($states); curl_setopt($curl, CURLINFO_HEADER_OUT, true); $url = "http://my.ipaips.com/wp-json/wp/v2/posts/"; curl_setopt($curl, CURLOPT_URL, $url); curl_setopt($curl, CURLOPT_POST, 1); curl_setopt($curl, CURLOPT_HTTPGET, 0); curl_setopt($curl, CURLOPT_HTTPAUTH, CURLAUTH_BASIC); curl_setopt($curl, CURLOPT_USERPWD, "arief:#######!@#"); curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1); curl_setopt($curl, CURLOPT_POSTFIELDS, array(  'title'=>'FIRST POST DARI REST API',  'content' => 'Lorem Ipsum dolor rest api wordpress hello wor...
Baca selengkapnya

Solusi error DexArchiveMergerException saat menggunakan flutter package cloud_firestore

-
kalau kamu pake package flutter cloud_firestore untuk akses firestore lalu menemui error : DexArchiveMergerException: Error while merging dex archieves: The number of method references in a .dex file cannot exceed 64K. ini katanya adalah bug sih.. kamu atasi masalah ini dengan menambahkan konfigurasi di build.gradle tepatnta di folder android > app > build.gradle cari defaultConfig lalu tambahkan      defaultConfig {         // tambahkan         multiDexEnabled true     } juga tambahkan pada dependencies      dependencies {          // tambahkan implementation 'com.android.support:multidex:1.0.3'      }
Baca selengkapnya