GetX: mga pangunahing konsepto, nabigasyon at DI sa Flutter

Ano ang GetX?

GetX — isang all-in-one micro-framework para sa Flutter na lumulutas sa tatlong pangunahing gawain ng pag-develop: pamamahala ng estado (State Management), nabigasyon (Routing), at dependency injection (DI). Hindi nangangailangan ang GetX ng Stream, ChangeNotifier, Builder o mga subscription — lahat ng reaktibidad ay ibinibigay ng Rx-pambalot batay sa GetValue at GetStream, na gumagana nang sampu-sampung beses na mas mabilis kaysa ChangeNotifier.

Ang GetX ay nakaposisyon bilang alternatibo sa kombinasyon ng Provider + Navigator + get_it/kiwi. Sa halip na mag-install ng tatlong magkakaibang package at magsulat ng 10 linya ng configuration, ang GetX ay nagbibigay ng lahat sa isang kahon na may isang linya: GetMaterialApp sa halip na MaterialApp. Gumagana ang nabigasyon sa pamamagitan ng Get.to(NextScreen()) nang walang BuildContext, at DI — sa pamamagitan ng Get.put(Service()) nang walang Provider tree.

Ayon sa Flutter Community Survey 2025, ang GetX ay ginagamit sa 43% ng mga proyektong Flutter. Mga pangunahing dahilan ng pagpili: minimal na threshold ng pagpasok (5 minuto para matutunan), kawalan ng boilerplate (umiikli ang code ng 60-70% kumpara sa Provider o BLoC) at mabilis na pag-develop ng MVP. Itinuturo ng mga kritiko ang paglabag sa prinsipyo ng paghihiwalay ng responsibilidad at kahirapan sa debugging.

Reaktibong estado: Obx at Rx

Obx — ang reaktibong widget ng GetX na nag-rebuild kapag nagbago ang mga Rx-variable. Hindi nangangailangan ang Obx ng subscription, dispose o mga function ng Builder — sapat na upang balutin ang widget sa Obx at gumamit ng Rx-variable sa loob. Awtomatikong sinusubaybayan ng Obx kung aling mga Rx-variable ang ginagamit at nagre-redraw lamang kapag nagbago ang mga ito.

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}'));
}

Mga Rx-variable: .obs — getter na bumabalot sa anumang halaga sa isang Rx-object. Nagbibigay ang GetX ng mga naka-type na Rx-klase: RxInt, RxString, RxDouble, RxBool, RxList, RxMap. Lahat ng Rx-variable ay kumikilos tulad ng mga ordinaryong primitibo: count++, name.value = 'Hello', items.add(item). Ang pagbabago ay awtomatikong nag-aabiso sa mga subscriber ng Obx.

GetBuilder — alternatibo sa Obx nang walang Rx, gumagana sa pamamagitan ng manu-manong pagtawag ng update(). GetBuilder.filter — para sa tumpak na pag-update ayon sa mga ID-key. Mas mabilis ang Obx (awtomatikong pagsubaybay ng dependency), mas predictable ang GetBuilder (malinaw na pagtawag ng pag-update). Inirerekomenda ang Obx para sa mga simpleng senaryo at GetBuilder para sa mga kumplikadong widget na may maraming dependency.

GetController at siklo ng buhay

GetxController — base na klase para sa lohika ng negosyo na may suporta sa siklo ng buhay. Ang GetxController ay may mga pamamaraan: onInit() (inisyalisasyon), onReady() (pagkatapos ng unang frame), onClose() (paglilinis ng mga mapagkukunan). Hindi tulad ng ChangeNotifier at StateNotifier, awtomatikong namamahala ang GetxController ng mga subscription: kapag nawasak ang pahina, lahat ng Rx-variable at Workers ay nag-a-unsubscribe.

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 — mga reaktibong utility ng GetX: ever (tinatawag sa bawat pagbabago), once (sa unang pagbabago lamang), debounce (may pagkaantala), interval (hindi hihigit sa N beses bawat segundo). Nilulutas ng Workers ang mga karaniwang gawain: validation ng field (debounce), analytics (once), synchronization (ever). Awtomatikong nag-a-unsubscribe ang Workers kapag tinawag ang onClose(), na pumipigil sa mga tagas ng memorya.

Nabigasyon at pagruruta

Nabigasyon ng GetX ay hindi nangangailangan ng BuildContext para sa paglipat sa pagitan ng mga screen. Sa halip na Navigator.push(context, MaterialPageRoute(...)) ay ginagamit ang Get.to(NextScreen()) — pagtawag mula sa kahit saan, kabilang ang Controller na walang access sa BuildContext. Sinusuportahan ng GetX ang mga pinangalanang ruta, animation, middleware at pagpapadala ng argumento nang walang MaterialPageRoute.

// Karaniwang nabigasyon
Get.to(ProfileScreen());
Get.back();
Get.off(LoginScreen()); // palitan ang kasalukuyang ruta
Get.offAll(HomeScreen()); // linisin ang stack

// Mga pinangalanang ruta
Get.toNamed('/profile', arguments: 'user123');
Get.offNamed('/login');

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

GetPage at GetPages: Ginagamit ng GetX ang GetPages sa halip na routes sa MaterialApp. Middleware — pagsusuri ng awtorisasyon, mga redirect, analytics bago pumasok sa screen. Transition — mga built-in na animation ng paglipat: fadeIn, zoom, leftToRight, topToBottom. Bindings — klase na nag-i-initialize ng Controller at mga dependency kapag pumapasok sa ruta. Nilulutas ng Bindings ang problema ng lazy initialization: ang Controller ay nilikha lamang kapag bukas ang screen.

Dependency Injection gamit ang GetX

Get.put — pagrerehistro ng instance sa DI-container. Get.find — pagkuha ng instance mula sa container. Get.lazyPut — lazy initialization (nilikha sa unang pagtawag ng find). Get.putAsync — asynchronous na inisyalisasyon (para sa mga serbisyo na may init). Get.delete — pagtanggal mula sa container (awtomatikong tinatawag ng Bindings kapag nawasak ang ruta).

GetX DI — ang pinakasimpleng DI-container sa Flutter. Walang Provider tree, walang Module, walang Scope. Ang Get.put(Repository()) sa Controller o main.dart ay ginagawang available ang object kahit saan sa application sa pamamagitan ng Get.find<Repository>(). Sinusuportahan din ng GetX DI ang pag-tag (tag: 'api') at permanensya (permanent: true) upang maiwasan ang pagtanggal.

GetX: best practices at pagganap

Pagganap ng GetX ay batay sa mga Rx-pambalot na gumagana sa pamamagitan ng GetStream — sariling implementasyon ng Stream na na-optimize para sa Flutter. Ayon sa GetX benchmarks, ang Rx-variable ay 2-3 beses na mas mabilis kaysa ChangeNotifier at 5-7 beses na mas mabilis kaysa BLoC sa mga madalas na pag-update (30+ fps). Hindi ginagamit ng GetX ang BuildContext para sa mga subscription, na nag-aalis ng pag-rebuild ng widget tree sa panahon ng nabigasyon.

Best practices: gamitin ang GetBuilder sa halip na Obx para sa mga widget na may maraming elemento ng anak (mga listahan, talahanayan). Hatiin ang mga Controller ayon sa functional na mga module, hindi isang malaking Controller bawat pahina. Gamitin ang Bindings para sa inisyalisasyon ng Controller, hindi Get.put sa build method. GetView — isang pinaikling StatelessWidget na may access sa Controller sa pamamagitan ng controller nang walang Get.find.

Mga kilalang limitasyon: Gumagamit ang GetX ng mga global variable (Get.find, Get.to), na maaaring magpahirap sa pag-test. Ang pag-mock ng mga dependency sa pamamagitan ng GetX ay nangangailangan ng Get.replace() o Get.reset() sa pagitan ng mga test. Para sa paghihiwalay, inirerekomenda ang Get.testMode = true. Hindi inirerekomenda ang GetX para sa mga application na nangangailangan ng mahigpit na arkitektura na may malinaw na mga hangganan ng layer — sa kasong ito, mas gusto ang BLoC o Riverpod na may code generation.