- Serverless sebenarnya tidak berarti tidak ada server, melainkan hanya berarti menggunakan server milik orang lain
- Arsitektur ServerFree mengusulkan konsep menjalankan kode tanpa server backend, container, atau mesin virtual
- Dalam arsitektur ini, kode dijalankan di dalam browser dan hanya memerlukan server yang menyajikan file statis
- Menunjukkan cara mengemas web application agar dapat dijalankan di browser
- Kode frontend dibangun seperti biasa, backend dikemas lalu dijalankan di web worker, dan database menggunakan SQLite yang dikompilasi ke WebAssembly
Ide
- Diputuskan untuk membuat proyek demo melalui content marketing, dan terinspirasi dari Hacker News untuk membuat pelacak lamaran kerja yang menarik perhatian dari sisi privasi
- Proyek ini berkembang menjadi proses pengembangan arsitektur baru sambil menyelesaikan masalah seperti web worker, ketidakcocokan dokumen, dan dokumen yang hilang.
Percobaan pertama dengan arsitektur klasik (bagian yang mudah)
- Membangun aplikasi menggunakan SubZero CLI dengan mengubah skema database dan mengatur izin.
- Menyediakan fungsi CRUD dan filtering, tetapi melakukan kustomisasi UI yang lebih mirip produk daripada sekadar demo.
- Memindahkan sidebar ke bagian atas untuk mengurangi ruang kosong yang terbuang di sebelah kiri.
- Menambahkan komponen Show, Create, Edit, List ke halaman "Opportunities".
- Menerapkan alur filtering yang kompleks tanpa menyentuh kode backend.
- Meningkatkan dashboard untuk menampilkan data relevan seperti "peluang terbuka", "rata-rata progres / lamaran", dan "rata-rata hari setelah melamar".
- Untuk deployment produksi, membangun Docker image, melakukan seed database, dan menjalankan container.
- Menjaga file database SQLite tetap berada di luar container agar data tetap persisten.
- Menggunakan Turso DB untuk menyelesaikan masalah persistensi dan backup database SQLite.
Beralih ke arsitektur ServerFree (bagian yang menarik)
- Menggunakan SQLite yang dikompilasi ke WebAssembly sebagai database.
- Menggunakan OPFS(Origin-Private FileSystem) untuk menyimpan data.
- Menjalankan kode backend di web worker untuk mencegah pemblokiran UI thread.
- Mengganti Express dengan itty-router untuk memastikan kompatibilitas browser.
- Menggunakan service worker untuk mencegat dan memproses request antara UI dan backend.
- Mewujudkan komunikasi yang andal antara service worker dan web worker melalui main thread.
- Menghapus kode terkait autentikasi dari main thread(UI).
- Data disimpan di komputer pengguna dan tidak dikirim ke server.
Kesimpulan
- Arsitektur ini sangat berguna terutama ketika data pelanggan bersifat independen dan tidak perlu dibagikan antar pengguna.
- Karena tidak ada server backend, biaya hosting berkurang, privasi data diperkuat, dan keamanan ditingkatkan.
- Dengan menggunakan alat seperti Electric, sebagian database dapat disinkronkan ke klien dan sebagian request/query dapat diproses di browser
1 komentar