Skip to content

BAB 3: PERFORMANCE & LOCAL-FIRST ENGINEERING (KETAHANAN EKSTREM)

BAB 3: PERFORMANCE & LOCAL-FIRST ENGINEERING (KETAHANAN EKSTREM)

Section titled “BAB 3: PERFORMANCE & LOCAL-FIRST ENGINEERING (KETAHANAN EKSTREM)”

Arsitektur Performance & Local-First Engineering pada Gandiwa Stack merupakan spesifikasi rekayasa sistem yang memindahkan pusat kendali eksekusi data dari peladen awan (cloud server) menuju ke dalam lingkungan lokal peramban (client-side browser runtime). Mayoritas platform modern mengalami kelumpuhan operasional dan penurunan performa secara radikal saat diakses melalui perangkat keras usang berkemampuan rendah (legacy hardware) atau ketika beroperasi di bawah fluktuasi jaringan internet yang tidak stabil. Subsistem ini mengeliminasi ketergantungan konektivitas konstan melalui implementasi tiga pilar teknologi: enkripsi luring tamper-proof, orkestrasi non-blocking event loop synchronization, dan isolasi PWA App Shell yang tangguh.

3.1 Tamper-Proof Local Encryption Protocol (CryptoGuard Engine)

Section titled “3.1 Tamper-Proof Local Encryption Protocol (CryptoGuard Engine)”

Ketika fungsionalitas pengolahan data transaksional, penilaian, dan manipulasi informasi diizinkan berjalan sepenuhnya dalam kondisi luring, penyimpanan lokal peramban seperti IndexedDB menjadi sasaran empuk bagi modifikasi ilegal melalui konsol developer tools. Gandiwa Stack mengamankan integritas data tersebut menggunakan protokol kriptografi lapis bawah bernama CryptoGuard.

  • Bitisasi Enkripsi Dua Arah AES-GCM: Setiap kali data master diturunkan ke penyimpanan lokal, komponen CryptoGuard.ts melakukan proses pembungkusan (sealing) data menggunakan Web Crypto API. Algoritma yang digunakan adalah Advanced Encryption Standard dengan mode Galois/Counter Mode (AES-GCM) berbasis akselerasi perangkat keras peramban, yang secara otomatis membangkitkan vektor inisialisasi (Initialization Vector / IV) dan tag otentikasi unik untuk setiap baris data.

  • Validasi Checksum Kriptografis Otomatis: Saat konektivitas internet pulih, server komputasi tepi (Cloudflare Workers) tidak langsung menelan data yang dikirim dari klien. Server akan mengekstrak tag otentikasi dan melakukan komparasi nilai matematika checksum untuk memvalidasi apakah tanda tangan digital data tersebut telah berubah selama fase luring.

  • Mekanisme Proteksi Malicious Tampering: Jika terdeteksi adanya ketistem ketidaksesuaian bit data sekecil apa pun, fungsi unsealData akan langsung melempar pengecualian fatal berupa TAMPER_DETECTED. Sistem secara otomatis akan memutus paksa sesi login pengguna, menghapus seluruh memori IndexedDB browser, dan menolak kueri sinkronisasi ke database PostgreSQL Supabase demi menjaga kesucian pangkalan data dari manipulasi data ilegal.

3.2 Non-Blocking Local Sync Strategy (Anti-UI Freezing Event Loop)

Section titled “3.2 Non-Blocking Local Sync Strategy (Anti-UI Freezing Event Loop)”

Proses pemuatan data master berskala besar, seperti pengunduhan ribuan bank soal, data registrasi penduduk, atau inventaris barang, seringkali memicu pemblokiran jalur utama browser (main thread), menyebabkan aplikasi web membeku (UI freezing) dan memicu peringatan Long Task pada gawai dengan spesifikasi RAM di bawah 2 GB.

  • Segmentasi Aliran Data via Batch Chunking: Untuk mempertahankan kehalusan visual pada frekuensi mutlak 60 frame-per-second (FPS), Sistem mengadopsi mekanisme Slicing Event Loop Stream. Aliran data relasional berkapasitas besar dipisahkan secara interaktif menjadi fragmen-fragmen mikroelemen terisolasi. Penjadwalan penulisan ke memori lokal dialihkan dari Call Stack utama menuju antarmuka Task Queue peramban memanfaatkan penjadwalan asinkronus berkala, membebaskan siklus kerja CPU untuk mempertahankan responsivitas grafis peramban tetap berada di titik tertinggi

  • Pendelegasian Makrotas via SetTimeout Callback: Alih-alih melakukan penulisan database lokal secara sekuensial yang menyumbat thread utama browser, fungsi setupWizardSync.ts melepas setiap antrean batch ke dalam antrean makrotas browser menggunakan instruksi setTimeout(writeNextBatch, 0). Strategi ini memberikan waktu bernapas bagi mesin render peramban untuk tetap memproses interaksi klik, animasi mikro (micro-interactions), dan input pengguna tanpa jeda (lag).

  • Proactive Storage Persistency Guard: Melalui komponen StorageGuardService.ts, sistem secara aktif mengajukan klaim hak penyimpanan persisten kepada sistem operasi perangkat melalui pemanggilan fungsi navigator.storage.persist(). Langkah proteksi ini mencegah sistem operasi ponsel atau komputer menghapus pangkalan data IndexedDB secara sepihak ketika ruang penyimpanan internal disk pengguna mulai penuh.

  • Dynamic Eviction and Auto Recovery Check: Sistem memantau kapasitas penyimpanan secara real-time via navigator.storage.estimate(). Komponen OfflineSyncService.ts menjalankan siklus pemindaian otomatis setiap 30 detik. Jika terdeteksi adanya kehilangan data master lokal akibat pembersihan eksternal browser padahal sesi pengguna masih aktif, sistem secara instan akan mengeksekusi rutin triggerAutoRecovery untuk mengunduh ulang seluruh data secara senyap di latar belakang (background download).

3.3 Hybrid 90% Offline Architecture Capable (Service Worker Isolation)

Section titled “3.3 Hybrid 90% Offline Architecture Capable (Service Worker Isolation)”

Gandiwa Stack mengaburkan batasan antara kapabilitas aplikasi berbasis web tradisional dengan aplikasi desktop native melalui integrasi mesin Service Worker mutlak yang ditenagai oleh Serwist.

  • App Shell Isolation via Precaching: Serwist mengisolasi lembar aplikasi inti (App Shell HTML, CSS, assets) ke dalam lapisan cache terisolasi sejak kunjungan pertama. Ketika pengguna membuka aplikasi di area tanpa sinyal, Service Worker bertindak sebagai proksi internal yang pencegat seluruh request jaringan dan langsung menyajikan aset dari cache lokal, memampukan 90% durasi interaksi pengguna berjalan sepenuhnya tanpa koneksi internet.

  • Background Synchronization Pipeline: Ketika pengguna melakukan modifikasi data yang melibatkan dokumen multimedia berat saat luring, sistem tidak membatalkan aksi tersebut, melainkan memarkir seluruh payload biner ke dalam objek store penampungan sementara di IndexedDB. Begitu Service Worker menangani sinyal pemulihan jaringan internet, modul akan mengaktifkan proses Background Sync secara otomatis untuk mengalirkan data ke server komputasi tepi.

  • Pre-signed URL R2 Injection: Untuk mempertahankan disiplin alokasi memori Edge Runtime pada parameter 128 MB per eksekusi, proses pengunggahan file biner masif tidak pernah melewati peladen komputasi utama. Sisi klien akan melakukan request token otorisasi ke endpoint /api/r2/presigned untuk mendapat Pre-signed URL Cloudflare R2 secara aman. Browser kemudian mengunggah langsung file tersebut ke object storage menggunakan metode HTTP PUT dari sisi klien. Setelah proses unggah biner selesai, semua referensi tautan lokal luring diganti menjadi URL publik R2 yang asli melalui fungsi aksi otomatis, membebaskan server dari kelebihan beban komputasi penanganan file besar.

FAQ BAB 3: PERFORMANCE & LOCAL-FIRST ENGINEERING

Section titled “FAQ BAB 3: PERFORMANCE & LOCAL-FIRST ENGINEERING”

Q: Apa yang terjadi secara teknis jika pengguna mencoba memodifikasi data di IndexedDB melalui DevTools browser? A: Setiap data yang disimpan ke IndexedDB dibungkus menggunakan enkripsi AES-GCM via Web Crypto API, yang secara otomatis menghasilkan Initialization Vector (IV) dan authentication tag unik per baris data. Jika pengguna memodifikasi byte manapun di dalam database lokal, tag autentikasi tidak akan cocok saat proses dekripsi. Fungsi unsealData pada komponen CryptoGuard.ts akan melempar pengecualian TAMPER_DETECTED, yang secara otomatis memicu penghapusan seluruh memori IndexedDB dan pemutusan sesi login.

Q: Bagaimana Gandiwa Stack mencegah aplikasi web membeku saat memuat ribuan baris data ke IndexedDB sekaligus? A: Sistem mengimplementasikan strategi Batch Chunking menggunakan mekanisme setTimeout(writeNextBatch, 0) di dalam fungsi setupWizardSync.ts. Alih-alih menulis seluruh dataset sekaligus yang akan memblokir main thread browser, setiap batch berisi 100 baris data dilepas ke dalam macrotask queue browser. Ini memberikan celah bagi mesin render untuk memproses animasi, input klik, dan interaksi pengguna di antara setiap siklus penulisan data.

Q: Berapa persentase fungsionalitas aplikasi yang dapat berjalan dalam kondisi tanpa koneksi internet pada Gandiwa Stack? A: Gandiwa Stack mencapai kapabilitas operasional luring sebesar 90% dari total durasi interaksi pengguna. Service Worker yang ditenagai Serwist mengisolasi seluruh aset App Shell ke dalam lapisan cache terisolasi sejak kunjungan pertama. Fungsionalitas yang memerlukan koneksi aktif hanya meliputi sinkronisasi data ke server dan pengunggahan file media besar , yang ditangani secara otomatis oleh mekanisme Background Sync begitu koneksi pulih.

Q: Bagaimana sistem menangani pengunggahan file berukuran besar tanpa membebani memori Cloudflare Workers? A: Proses pengunggahan file biner tidak pernah melewati API Route Cloudflare Workers. Sisi klien terlebih dahulu melakukan POST ke endpoint /api/r2/presigned untuk mendapatkan Pre-signed URL Cloudflare R2. Browser kemudian mengunggah langsung file tersebut ke object storage menggunakan HTTP PUT dari sisi klien. Seluruh beban transfer data ditanggung langsung oleh infrastruktur Cloudflare R2, mempertahankan ketersediaan penuh memori komputasi Workers untuk logika bisnis.

Q: Apa yang dilakukan sistem jika data master lokal terhapus oleh sistem operasi saat pengguna sedang aktif? A: Modul OfflineSyncService.ts menjalankan siklus pemindaian otomatis setiap 30 detik. Jika sistem mendeteksi ketidaksesuaian antara keberadaan token sesi Supabase Auth yang masih aktif dengan ketiadaan data master di IndexedDB , yang mengindikasikan penghapusan sepihak oleh OS , fungsi triggerAutoRecovery dieksekusi secara instan. Sistem mengunduh ulang seluruh data master yang hilang di latar belakang tanpa memutus aktivitas interaksi pengguna yang sedang berjalan.


  • Implementasi Kasus Nyata: Untuk melihat bagaimana protokol ketahanan luring ini diimplementasikan secara nyata pada sistem manajemen sekolah, lihat Studi Kasus SchoolOS di Bab 9.1.
  • Gamifikasi RPG Offline: Pelajari tentang rekayasa mesin gamifikasi luring yang berjalan secara real-time di sisi klien pada Data Recovery & RPG Ledger di Bab 7.