GetX: konsep kunci, navigasi dan DI di Flutter

Apa itu GetX?

GetX — micro-framework all-in-one untuk Flutter yang menyelesaikan tiga tugas utama pengembangan: manajemen state (State Management), navigasi (Routing), dan injeksi dependensi (DI). GetX tidak memerlukan Stream, ChangeNotifier, Builder, atau langganan — seluruh reaktivitas disediakan oleh pembungkus Rx berdasarkan GetValue dan GetStream, yang bekerja puluhan kali lebih cepat dari ChangeNotifier.

GetX diposisikan sebagai alternatif untuk kombinasi Provider + Navigator + get_it/kiwi. Alih-alih menginstal tiga paket berbeda dan menulis 10 baris konfigurasi, GetX memberikan semuanya dalam satu paket dengan satu baris: GetMaterialApp sebagai pengganti MaterialApp. Navigasi bekerja melalui Get.to(NextScreen()) tanpa BuildContext, dan DI — melalui Get.put(Service()) tanpa pohon Provider.

Menurut Flutter Community Survey 2025, GetX digunakan di 43% proyek Flutter. Alasan utama pemilihan: ambang masuk minimal (5 menit untuk dipelajari), tanpa boilerplate (kode menjadi 60-70% lebih pendek dibandingkan Provider atau BLoC) dan pengembangan MVP yang cepat. Kritikus menunjukkan pelanggaran prinsip pemisahan tanggung jawab dan kesulitan debugging.

State reaktif: Obx dan Rx

Obx — widget reaktif GetX yang membangun ulang saat variabel Rx berubah. Obx tidak memerlukan langganan, dispose, atau fungsi Builder — cukup bungkus widget dalam Obx dan gunakan variabel Rx di dalamnya. Obx secara otomatis melacak variabel Rx mana yang digunakan dan hanya menggambar ulang saat variabel tersebut berubah.

class CounterController extends GetxController {
  final count = 0.obs;
  void increment() => count++;
}

class CounterScreen extends StatelessWidget {
  final controller = Get.put(CounterController());

  @override
  Widget build(context) => Obx(() => Text('${controller.count}'));
}

Variabel Rx: .obs — getter yang membungkus nilai apa pun ke dalam objek Rx. GetX menyediakan kelas Rx yang diketik: RxInt, RxString, RxDouble, RxBool, RxList, RxMap. Semua variabel Rx berperilaku seperti primitif biasa: count++, name.value = 'Hello', items.add(item). Perubahan secara otomatis memberi tahu pelanggan Obx.

GetBuilder — alternatif Obx tanpa Rx, bekerja melalui panggilan manual update(). GetBuilder.filter — untuk pembaruan tepat berdasarkan kunci ID. Obx lebih cepat (pelacakan dependensi otomatis), GetBuilder lebih dapat diprediksi (panggilan pembaruan eksplisit). Obx direkomendasikan untuk skenario sederhana dan GetBuilder untuk widget kompleks dengan banyak dependensi.

GetController dan siklus hidup

GetxController — kelas dasar untuk logika bisnis dengan dukungan siklus hidup. GetxController memiliki metode: onInit() (inisialisasi), onReady() (setelah frame pertama), onClose() (pembersihan sumber daya). Tidak seperti ChangeNotifier dan StateNotifier, GetxController secara otomatis mengelola langganan: saat halaman dihancurkan, semua variabel Rx dan Workers berhenti berlangganan.

class AuthController extends GetxController {
  final user = Rx<User?>(null);
  final isLoading = false.obs;

  @override
  void onInit() {
    ever(isLoading, (_) => print('Loading: $isLoading'));
    super.onInit();
  }

  Future<void> login(String email, String password) async {
    isLoading.value = true;
    user.value = await api.login(email, password);
    isLoading.value = false;
  }
}

Workers — utilitas reaktif GetX: ever (dipanggil setiap kali ada perubahan), once (hanya pada perubahan pertama), debounce (dengan penundaan), interval (tidak lebih dari N kali per detik). Workers menyelesaikan tugas-tugas umum: validasi bidang (debounce), analitik (once), sinkronisasi (ever). Workers secara otomatis berhenti berlangganan saat onClose() dipanggil, mencegah kebocoran memori.

Navigasi dan routing

Navigasi GetX tidak memerlukan BuildContext untuk berpindah antar layar. Alih-alih Navigator.push(context, MaterialPageRoute(...)) digunakan Get.to(NextScreen()) — panggilan dari mana saja, termasuk Controller tanpa akses ke BuildContext. GetX mendukung rute bernama, animasi, middleware, dan pengiriman argumen tanpa MaterialPageRoute.

// Navigasi biasa
Get.to(ProfileScreen());
Get.back();
Get.off(LoginScreen()); // ganti rute saat ini
Get.offAll(HomeScreen()); // bersihkan tumpukan

// Rute bernama
Get.toNamed('/profile', arguments: 'user123');
Get.offNamed('/login');

// Middleware
GetPage(
  name: '/profile',
  page: () => ProfileScreen(),
  middlewares: [AuthMiddleware()],
)

GetPage dan GetPages: GetX menggunakan GetPages sebagai pengganti routes di MaterialApp. Middleware — pemeriksaan otorisasi, pengalihan, analitik sebelum masuk ke layar. Transition — animasi transisi bawaan: fadeIn, zoom, leftToRight, topToBottom. Bindings — kelas yang menginisialisasi Controller dan dependensi saat masuk ke rute. Bindings memecahkan masalah inisialisasi malas: Controller hanya dibuat saat layar terbuka.

Dependency Injection dengan GetX

Get.put — pendaftaran instance di kontainer DI. Get.find — pengambilan instance dari kontainer. Get.lazyPut — inisialisasi malas (dibuat pada panggilan find pertama). Get.putAsync — inisialisasi asinkron (untuk layanan dengan init). Get.delete — penghapusan dari kontainer (dipanggil secara otomatis oleh Bindings saat rute dihancurkan).

GetX DI — kontainer DI paling sederhana di Flutter. Tanpa pohon Provider, tanpa Module, tanpa Scope. Get.put(Repository()) di Controller atau main.dart membuat objek tersedia di mana saja dalam aplikasi melalui Get.find<Repository>(). GetX DI juga mendukung penandaan (tag: 'api') dan permanensi (permanent: true) untuk mencegah penghapusan.

GetX: best practices dan performa

Performa GetX didasarkan pada pembungkus Rx yang bekerja melalui GetStream — implementasi Stream khusus yang dioptimalkan untuk Flutter. Menurut benchmark GetX, variabel Rx 2-3 kali lebih cepat dari ChangeNotifier dan 5-7 kali lebih cepat dari BLoC pada pembaruan yang sering (30+ fps). GetX tidak menggunakan BuildContext untuk langganan, yang menghilangkan pembangunan ulang pohon widget saat navigasi.

Best practices: gunakan GetBuilder sebagai pengganti Obx untuk widget dengan banyak elemen anak (daftar, tabel). Pisahkan Controller berdasarkan modul fungsional, bukan satu Controller besar per halaman. Gunakan Bindings untuk inisialisasi Controller, bukan Get.put di metode build. GetView — StatelessWidget yang dipersingkat dengan akses ke Controller melalui controller tanpa Get.find.

Keterbatasan yang diketahui: GetX menggunakan variabel global (Get.find, Get.to), yang dapat mempersulit pengujian. Mocking dependensi melalui GetX memerlukan Get.replace() atau Get.reset() antar pengujian. Untuk isolasi, disarankan Get.testMode = true. GetX tidak disarankan untuk aplikasi yang memerlukan arsitektur ketat dengan batas lapisan yang jelas — dalam hal ini, BLoC atau Riverpod dengan pembuatan kode lebih disukai.