DEV Community

eeatsyahrini
eeatsyahrini

Posted on

The Secret of Flowork OS's Dual Engine: Lightweight UI, Brutal Backend

#go #python #flowork

Yo, fellow developers! Pernah nggak lo dapet komplain dari user kayak gini: "Bang, tiap buka web lu, kipas laptop gue langsung bunyi kayak mau *take-off!"*

Atau lo ngerasa animasi hover di tombol UI lo jadi patah-patah (janky) pas web app lo lagi asyik nge-proses atau nge-filter data ribuan baris?

Kalau lo pernah ngalamin itu, welcome to the club. Itu adalah kelemahan absolut dari arsitektur Single Engine yang dipakai mayoritas Web App tradisional. Browser dipaksa jadi superhero: dia yang harus nge-render DOM, dia yang ngurus state management, dia juga yang disuruh nge-parsing JSON ber-megabyte-megabyte di memori yang sama (Single-Thread Javascript).

Hasilnya? Browser ngambek, frame rate drop, dan memori bocor (memory leak).

Di Flowork OS, kita ogah kompromi soal performa. Makanya kita nerapin arsitektur yang kita sebut Dual Engine. Mari kita bedah rahasia gimana Flowork OS bisa punya UI yang seringan kapas, tapi punya backend lokal yang sebrutal bulldozer.

🎭 Engine 1: The Featherweight UI (Murni & Ringan)

Di ekosistem Flowork OS, bagian depan (UI) punya satu aturan mutlak: Jangan pernah sentuh proses berat!

Web UI kita dibangun menggunakan murni HTML, CSS, dan Vanilla JS. Nggak ada virtual DOM yang membebani memori, nggak ada bundler raksasa. Tugas Frontend Engine ini cuma dua:

  1. Menerima input dari user (klik, ketik, swipe).
  2. Nge-render animasi dan UI se-mulus mungkin di 60fps konstan.

Ketika user ngeklik tombol "Download Video YouTube" atau "Scan System Info", Web UI nggak akan mengeksekusi logika itu sendirian. Alih-alih membebani V8 Engine bawaan Chrome, JS kita bakal ngirim "surat perintah" ke Engine kedua lewat jalur P2P WebSocket.

// Contoh di Frontend (Vanilla JS via systemBridge.js)
// UI cuma merintahin, sisanya tinggal duduk manis nunggu hasil
async function getSystemInfo() {
  ui.showLoading(); // UI tetep smooth

  try {
    // Tembak surat perintah ke Brutal Backend via P2P
    const sysData = await FloworkBridge.executeNode('sys-info', {
      mode: "full_scan"
    });

    ui.renderDashboard(sysData); // Render pas udah mateng
  } catch (err) {
    ui.showToast("Gagal mengambil data sistem");
  }
}
Enter fullscreen mode Exit fullscreen mode

🦾 Engine 2: The Brutal Backend (Golang + Python/Native)

Ini dia bintang utamanya. Di belakang layar PC user, ada Local Node Engine yang dikomandoi oleh Golang (via executor.go) yang siap ngerjain tugas-tugas "kotor" dan brutal.

Misalnya, lo mau nge-fetch video dari YouTube yang butuh manipulasi buffer gede, atau lo mau baca data hardware lokal (CPU/RAM usage). Browser sandbox nggak bakal ngizinin lo ngelakuin ini. Tapi Brutal Backend kita bisa!

Ketika executor.go nerima perintah dari Web UI, dia langsung ngebangunin script Python (atau C++) yang ada di folder node aplikasi, misalnya apps/sys-info/script.py atau nodes/yt-downloader.

📜 Hukum Kontrak: schema.json

Biar Featherweight UI dan Brutal Backend nggak miskomunikasi, Flowork OS pakai kontrak ketat bernama schema.json. File ini mastiin format data yang dikirim JS sama persis dengan yang diharapkan Python, dan output Python bisa langsung dibaca JS tanpa error.

Gini kira-kira bentuk eksekusi di sisi Brutal Backend (Python) yang dieksekusi oleh Golang:

# File: apps/sys-info/script.py (Backend Lokal)
import sys
import json
import psutil # Library native OS (Nggak mungkin jalan di Web murni)

def scan_system():
    # Mengakses data hardware secara brutal dan cepat
    cpu_usage = psutil.cpu_percent(interval=1)
    ram = psutil.virtual_memory()

    return {
        "status": "success",
        "data": {
            "cpu_usage_percent": cpu_usage,
            "total_ram_gb": round(ram.total / (1024**3), 2),
            "free_ram_gb": round(ram.available / (1024**3), 2)
        }
    }

if __name__ == "__main__":
    try:
        # Eksekusi dan lempar hasil mentahnya ke stdout untuk ditangkap Golang P2P
        result = scan_system()
        print(json.dumps(result))
    except Exception as e:
        print(json.dumps({"status": "error", "message": str(e)}))
        sys.exit(1)
Enter fullscreen mode Exit fullscreen mode

Karena eksekusi psutil di atas berjalan di process OS yang terpisah (lewat Python lokal), tab browser user nggak akan pernah nge-freeze. Animasi loading spinner di UI lo bakal tetep muter dengan mulus tanpa putus-putus.

⚖️ Keuntungan Absolut Arsitektur Ini

Pemecahan Dual Engine ini bukan sekadar gaya-gayaan. Ini ngebawa dampak masif buat developer dan user:

  1. Anti-Freeze UI: Logika sinkronus yang berat nggak lagi memblokir Main Thread di browser.
  2. Akses Hardware Tak Terbatas: Web app lo sekarang punya kekuatan setara aplikasi Desktop Native karena backend-nya dieksekusi langsung di OS lokal.
  3. Bahasa Pemrograman Paling Tepat untuk Tugasnya: UI pakai Vanilla JS yang cepat untuk render, Backend pakai Python/C++ yang emang jagonya buat data processing atau hardware access. Lo nggak perlu maksa JS buat ngerjain hal yang bukan keahliannya.
  4. Efisiensi Memori (Thermal Friendly): Karena kita pakai Golang buat P2P dan skrip berjalan di process terpisah, garbage collector OS lokal bekerja lebih efisien dibanding garbage collector milik V8 Chrome. Laptop user bakal tetep adem.

🎯 Kesimpulan

Membangun aplikasi dengan Flowork OS berarti lo berhenti memperkosa browser buat ngelakuin semua hal sendirian. Lo membagi beban kerja secara elegan: biarkan JS menjadi seniman yang melukis UI yang indah (Featherweight UI), dan biarkan Golang + Python menjadi kuli panggul yang mengangkat beban berat (Brutal Backend).

Penasaran mau ngerasain langsung gimana mulusnya aplikasi yang dibangun dengan arsitektur ini? Atau mau nyumbang node Python lo sendiri ke ekosistem kita?

Cek dokumentasi lengkapnya dan mulai build aplikasi hybrid pertama lo di floworkos.com. Jangan biarkan limitasi browser mematikan ide gila lo! 🚀💻

Top comments (0)