Load website lebih cepat dengan headless CMS

Apa itu headless CMS? secara singkat inti dari headless CMS adalah memisahkan front end dengan backend dari sebuah CMS. Dalam tulisan ini CMS yang saya maksud adalah CMS seperti wordpress dan ghost. Kenapa harus dipisahkan?

CMS atau content management services, adalah sebuah website yang memberikan tampilan mudah dalam mengelola content dinamis. Misalnya membuat posting blog, menghapus, mengedit, menambah page, dll. Kebanyakan CMS seperti wordpress dan ghost, pengelolaan konten dalam 1 host yang dibedakan dari urlnya. Contohnya seperti wordpress dengan /wp-admin atau ghost dengan /ghost. Ada beberapa alasan front end dan back end ini harus dipisahkan

• Dari sudut pandang security folder seperti /wp-admin dan /ghost mudah ditebak. ketika tampil login dan password, admin page dapat dilakukan serangan untuk masuk ke dalam manajemen controlnya
• Dari sudut pandang resources. setiap kali ada request ke website, ada proses komputasi sampai menjadi kontent akhir. misalnya ada request dari user untuk membuat 1 artikel, ada proses sampai akhirnya artikel bisa ditampilkan. Jika ada banyak user dengan berbeda-beda request tentunya resource server yang digunakan akan semakin naik
• Selain kerentanan dari manajemen admin. front page dari website juga bisa diserangan untuk dilakukan deface atau mensusupi kode tertentu

Headless CMS hadir dengan konsep pemisahan backend dan frontend untuk mengatasi masalah tersebut. Front-end headless CMS menggunakan static page. Apa artinya? seluruh kontent akan dirender dahulu ke dalam file html static. Tidak ada database dan hanya web server menampilkan file html static.

Secara security tidak ada lagi admin panel, html static sulit untuk disusupi kode jahat, tidak ada akses ke database karena filenya ke static. Secara resources lebih hemat karena tidak perlu database dan load html lebih ringan karena tidak ada proses komputasi untuk mengolah kontent.

Bagaimana caranya membuat headless CMS?

Dari yang saya lakukan kurang lebih penjelasannya seperti ini

1. Saya jalankan CMS dalam hal ini saya menggunakan ghost, di laptop saya. Saya menambahkan post, hapus post, dll di localhost ghost yang sudah saya buat
2. Saya mengunakan static page generator yaitu gatsby. Fungsi gatsby adalah menarik semua kontent di localhost ghost saya lalu membuat file html masing-masing kontent saling terintegrasi
3. Saya publish static contentnya di github. Jadi setiap kali ada perubahan saya harus push ke github
4. Untuk webservernya saya menggunakan cloudflare pages. Salah satu fitur dari cloudflare adalah auto sync dengan github. Jadi ketika github ada perubahan baik itu penambahan postingan, delete. dll maka cloudflare page akan melakukan sinkronisasi.

Dengan cara ini maka administrasi untuk pengelolaan konten terpisah di localhost saya, karena tidak terexpose public maka kecil kemungkinkan dilakukan hack. File static tersimpan di cloudflare pages yang sifatnya read only dan hanya bisa dirubah dari github. Cara ini mengurangi potensi situs untuk disusupi script malware ataupun dilakukan deface. Server cloudflare yang tersebar membuat sulit untuk melakukan deface dan menanamkan script malware.

Apakah cara ini cocok untuk semua website CMS?

Jika pengelolan konten dilakukan secara tim, kita masih bisa host CMS-nya secara private dan masing-masing user di dalam team akses menggunakan VPN. Tetapi salah satu kelemahannya adalah tidak bisa interaktif, misalnya ada menu user bagi pembaca yang bisa menambahkan komen, subscript konten, dll. Ini agak susah karena kontenya dinamis, meskipun bisa dijuga untuk part tertentu dibuat page dinamanis dan dipasang menggunakan API.

Cara ini sangat cocok untuk website yang jarang ada perubahan maupun penambahan konten atau website yang tidak ada interaktif dengan user

Terima kasih semoga bisa menjadi inspirasi untuk diterapkan