Mengenal Konsep Reactive Programming dan Kaitannya dengan Flutter BLoC (Bahasa)
Beberapa minggu terakhir ini Saya sedang mempelajari Flutter dan tertarik dengan BLoC Pattern. Tulisan ini merupakan catatan bagi programmer pemula seperti Saya yang sedang mempelajari konsep Flutter BLoC Pattern dan Reactive Programming. Bagi para programmer, ketika pertama kali mempelajari Reactive Programming mungkin akan mengalami kesulitan karena akan mendapatkan istilah-istilah baru, untuk itu Saya akan jelaskan istilah-istilah tersebut secara sederhana.
Apa itu reactive programming?
Reactive Programming merupakan pembahasan yang sering dibahas beberapa tahun kebelakang dan sudah banyak diimplementasikan. Contoh sederhana penerapan reactive programming adalah double tap pada postingan instagram serta jumlah retweet pada twitter yang terus bertambah secara real time.
Menurut @andrestaltz Reactive Programming adalah:
“ Reactive programming is programming with asynchronous data stream. “
Apa itu Asynchronous?
Jika pada Synchronous hasil kode dieksekusi secara berurutan sesuai penulisan kode, maka hasil eksekusi Asynchronous tidak selalu berurutan sesuai penulisan kode tetapi berdasarkan waktu pemrosesan kode. Karena untuk memulai perintah baru Asynchronous tidak menunggu perintah sebelumnya selesai.
Analogi:
Synchronous dapat dianalogikan seperti antrian pada ATM, kita harus menunggu orang di depan kita selesai melakukan transaksi sebelum kita mendapat giliran.
Asynchronous dapat dianalogikan seperti memesan makanan di rumah makan, kita tidak harus menunggu pesanan orang lain selesai tetapi pesanan mana yang lebih cepat dimasak yang akan disajikan terlebih dulu.
Lalu apa itu Stream?
Stream dapat dianalogikan sebagai pipa, seperti gambar berikut:
Stream dapat diartikan sebagai aliran data. Pada Rx stream sering disebut dengan observable.
Data yang diolah pada stream dapat berupa format apapun.
Stream Controller merupakan controller stream yang dapat mengatur data yang dilisten oleh penerima. Pada Rx stream controller sering disebut dengan Subject.
Subject terdiri dari Publish Subject, Replay Subject, dan Behavior Subject.
Stream Transformer adalah proses memodifikasi data pada stream.
Analogi :
Observable: dapat dianalogikan sebagai profesor yang menjelaskan suatu topik.
Publish Subject: dapat dianalogikan sebagai mahasiswa yang telat datang, mahasiswa tersebut hanya ingin mendengarkan materi dari saat mulai dia datang.
Replay Subject: dapat dianalogikan sebagai mahasiswa yang telat datang, tapi mahasiswa tersebut ingin mendengarkan materi dari awal.
Behavior Subject: dapat dianalogikan sebagai mahasiswa yang telat datang, tapi mahasiswa tersebut ingin mendengarkan hal-hal terbaru (bukan dari awal) yang diajarkan oleh profesor sehingga mahasiswa tersebut mendapatkan ide dari konteksnya.
Penjelasan Reactive Programming di Android lebih lengkap dibahas oleh @rohmanhakim pada artikel berikut:
Bagaimana dengan BLoC?
Jika di Android kita kenal MVVM/MVP maka di flutter kita kenal BLoC. BLoC merupakan kependekan dari Business Logic Component. Intinya BLoC bertujuan untuk memudahkan pemisahan presentation dan business logic, memfasilitasi testing dan reusable code. BLoC dikembangkan oleh @felangelov.
Konsep Dasar BLoC:
- Platform Independent, oleh karena itu bisa dilakukan sharing code antar platform.
- Input & Output, pada tulisan di atas mengenai stream yang dianalogikan seperti pipa terdapat input dan output. Input pada BLoC direpresentasikan dengan Sink dan output direpresentasikan dengan Stream.
- Close the Stream, agar tidak terjadi memory leaks maka setelah proses dikerjakan stream harus diclose.
BLoC Pattern digambarkan pada diagram berikut:
- Widgets mengirim events ke BLoC melalui Sinks,
- Widgets menerima output dari BLoC melalui streams,
- BLoC memproses business logic.
Manfaat yang bisa kita dapatkan berdasarkan prinsip di atas antara lain:
- Kita bisa mengubah business logic kapan saja dan meminimalisir aplikasi terkena resiko,
- Kita dapat merubah komponen UI tanpa merubah business logic,
- Memudahkan kita melakukan testing pada business logic.
Berikut tulisan lainnya yang Saya tulis mengenai Flutter BLoC:
Contoh penerapan BLoC Pattern pada flutter juga dibahas pada beberapa video berikut:
Jika teman-teman ingin mempelajari lebih dalam silahkan untuk membuka referensi di bawah ini.
Referensi:
https://bloclibrary.dev/#/
https://www.didierboelens.com/2018/08/reactive-programming---streams---bloc/
https://medium.com/@rohmanhakim/mengulik-reactive-programming-di-android-bagian-1-916b111c5597
https://medium.com/catatan-javascript/memahami-synchronous-dan-asynchronous-457fdd4c35d
https://blog.mindorks.com/understanding-rxjava-subject-publish-replay-behavior-and-async-subject-224d663d452f
https://medium.com/flutterpub/architecting-your-flutter-project-bd04e144a8f1
https://www.youtube.com/watch?v=LSljItPM_UE&t=241s
https://www.youtube.com/watch?v=tJpn9RwZz8Q
https://www.youtube.com/watch?v=96ykD0sacRA
https://www.youtube.com/watch?v=_eMS6thNLbY
