{"id":4067,"date":"2017-02-09T15:53:18","date_gmt":"2017-02-09T15:53:18","guid":{"rendered":"https:\/\/www.ckl.io\/?p=4067"},"modified":"2022-07-01T17:44:21","modified_gmt":"2022-07-01T17:44:21","slug":"reactivex-and-async-programming","status":"publish","type":"post","link":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/","title":{"rendered":"My experience with ReactiveX and asynchronous programming"},"content":{"rendered":"

As a software developer, I must deal with asynchronous programming on a daily basis. In order to provide the best user experience possible, all tasks like performing a server request, getting data from my database, waiting for some background process to finish or downloading an image should be executed asynchronously.<\/p>\n

Even with some years of experience, I sometimes forget the syntax for a particular asynchronous call. How should I implement the callback for a specific task and how should I handle the error if anything goes wrong? There are hundred of ways of dealing with responses, and as a developer it\u2019s my job to know which one fits best in every situation. When I first read about ReactiveX I thought: \u201cGreat, another asynchronous API to memorize\u2026\u201d. Well, I couldn\u2019t be more wrong.<\/p>\n

<\/p>\n

The ReactiveX (or Rx) API standardizes all the asynchronous processes with a very simple syntax: onNext()<\/code>, onError()<\/code> and onCompletion()<\/code>. No more having to know the exact code syntax to handle that callback that I only write twice a year. Not to mention that the code looks way more beautiful because of all the boilerplate I don\u2019t have to write anymore.<\/p>\n

It is based on three main ideas: the Observer pattern, the Iterator pattern and functional programming. The Observer pattern is an awesome way to deal with asynchronous tasks: every time a new event is triggered on the observable it notifies all its receivers. The Iterator pattern allows a better decoupling between the observable object\u2019s type and the algorithms, thus allowing it to be used in a wider range of scenarios. Functional programming not only makes the code more concise, but it also helps a lot on these concurrent scenarios. Those ideas combined make ReactiveX a great way to deal with asynchronous programming.<\/p>\n

It\u2019s a pretty straightforward API, once you understand how observables, observers, operators and schedulers work. Let\u2019s take a deep breath and dive right into it.<\/p>\n

\"deep<\/p>\n

Observables and observers<\/h2>\n

This part is quite simple: observables will emit events, as I mentioned before, and some other objects (called observers) will subscribe to those observables and will handle those emitted events.
\nPiece of cake, isn\u2019t it? If you’re familiar with JavaScript front-end development<\/a>, you’re probably very used to this pattern already.<\/p>\n

Operators<\/h2>\n

Here is where a great deal of the Rx magic happens.
\nLet\u2019s say that you want to listen to changes on a search field: get the user input, create a request for your backend and present the search results to the user. You know that you shouldn\u2019t react to every single new character the user types in, or a fast typing user would create tons of requests in a very short period of time, which would be harder to handle and also put a lot of pressure on the backend. What could you do in this case? Probably create a timed task that checks every couple of seconds if the search field has any changes, and if it does, send the search request. This implies in more code, and more room for bugs (in my experience, timers are a great source of issues). What if I told you ReactiveX can handle all of that with a single line of code? Seems like magic, right?
\nI\u2019m talking about operators now. Most of these guys operate on an observable and return another observable, allowing you to chain multiple of them to achieve the desired behavior. In the search field example I mentioned before a single debounce operator would achieve the behavior we wanted.<\/p>\n

\"debounce\"<\/p>\n

The debounce operator filter all the events that are triggered in a time window. After the window ends, it maps the last triggered event that happened to the new observable.<\/p>\n

There are operators that can create, transform, filter, combine observables and much more. You can have a pretty good idea on how to use them here<\/a>.<\/p>\n

Schedulers<\/h2>\n

Schedulers make me want to use Rx for every single async task I have.
\nSome special operators take schedulers as a parameter to allow multithreading in the cascade of operators. This allows Rx to start handling an event emitted by an observable on a thread, process part of it on another thread and present the result on a third thread.<\/p>\n

\"\"<\/p>\n

Each color represents a thread where the operators will perform their transformations. The process starts on the blue thread because there is a subscribeOn(blue)<\/code> somewhere in the loop (this operator can only appear once). Each time an observeOn()<\/code> appears, the processing thread for the processes below it changes, this way most of the mapping happens on the orange thread and the last chained observable will be observed on the pink thread.<\/p>\n

This may sound like a lot of threads, but the first time you start a network request on a I\/O thread, process the response on a background thread and update the views on the main thread with just three extra operators, you’ll see how valuable schedulers are.<\/p>\n

Where can I use ReactiveX?<\/h2>\n

You may be wondering: will ReactiveX fit on my project? The answer is probably yes. It has been implemented on many different languages and platforms \u2013 you can check them here<\/a>. Don\u2019t panic if you don\u2019t find your language or platform there, you can probably find a project on GitHub<\/a> that already implemented a library for you.<\/p>\n

Happy coding!<\/p>\n","protected":false},"excerpt":{"rendered":"

As a software developer, I must deal with asynchronous programming on a daily basis. In order to provide the best user experience possible, all tasks like performing a server request, getting data from my database, waiting for some background process to finish or downloading an image should be executed asynchronously. Even with some years of experience, […]<\/p>\n","protected":false},"author":65,"featured_media":4098,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[432,7],"tags":[],"class_list":["post-4067","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-engineering","category-opinion"],"yoast_head":"\nMy experience with ReactiveX and asynchronous programming<\/title>\n<meta name=\"description\" content=\"Writing beautiful and simple asynchronous programming code with ReactiveX to provide the best user experience possible.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"My experience with ReactiveX and asynchronous programming\" \/>\n<meta property=\"og:description\" content=\"Writing beautiful and simple asynchronous programming code with ReactiveX to provide the best user experience possible.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\" \/>\n<meta property=\"og:site_name\" content=\"Cheesecake Labs\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/cheesecakelabs\" \/>\n<meta property=\"article:published_time\" content=\"2017-02-09T15:53:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-07-01T17:44:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2000\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Cheesecake Labs\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@cheesecakelabs\" \/>\n<meta name=\"twitter:site\" content=\"@cheesecakelabs\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\"},\"author\":{\"name\":\"Natan Grando\"},\"headline\":\"My experience with ReactiveX and asynchronous programming\",\"datePublished\":\"2017-02-09T15:53:18+00:00\",\"dateModified\":\"2022-07-01T17:44:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\"},\"wordCount\":915,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png\",\"articleSection\":[\"Engineering\",\"Opinion\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\",\"url\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\",\"name\":\"My experience with ReactiveX and asynchronous programming\",\"isPartOf\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png\",\"datePublished\":\"2017-02-09T15:53:18+00:00\",\"dateModified\":\"2022-07-01T17:44:21+00:00\",\"author\":{\"@type\":\"person\",\"name\":\"Natan Grando\"},\"description\":\"Writing beautiful and simple asynchronous programming code with ReactiveX to provide the best user experience possible.\",\"breadcrumb\":{\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage\",\"url\":\"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png\",\"contentUrl\":\"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png\",\"width\":2000,\"height\":720,\"caption\":\"ReactiveX\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cheesecakelabs.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"My experience with ReactiveX and asynchronous programming\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/#website\",\"url\":\"https:\/\/cheesecakelabs.com\/blog\/\",\"name\":\"Cheesecake Labs\",\"description\":\"Nearshore outsourcing company for Web and Mobile design and engineering services, and staff augmentation for startups and enterprises..\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/cheesecakelabs.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"name\":\"Natan Grando\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cheesecakelabs.com\/blog\/#\/schema\/person\/image\/\",\"url\":false,\"contentUrl\":false,\"caption\":\"Natan Grando\"},\"description\":\"10 years of experience in Marketing and Sales in the Technology sector. My main purpose is help, support and structure efficient operations and also develop independent and multidisciplinary teams.\",\"url\":\"https:\/\/cheesecakelabs.com\/blog\/autor\/natan\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"My experience with ReactiveX and asynchronous programming","description":"Writing beautiful and simple asynchronous programming code with ReactiveX to provide the best user experience possible.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/","og_locale":"en_US","og_type":"article","og_title":"My experience with ReactiveX and asynchronous programming","og_description":"Writing beautiful and simple asynchronous programming code with ReactiveX to provide the best user experience possible.","og_url":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/","og_site_name":"Cheesecake Labs","article_publisher":"https:\/\/www.facebook.com\/cheesecakelabs","article_published_time":"2017-02-09T15:53:18+00:00","article_modified_time":"2022-07-01T17:44:21+00:00","og_image":[{"width":2000,"height":720,"url":"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png","type":"image\/png"}],"author":"Cheesecake Labs","twitter_card":"summary_large_image","twitter_creator":"@cheesecakelabs","twitter_site":"@cheesecakelabs","twitter_misc":{"Written by":null,"Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#article","isPartOf":{"@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/"},"author":{"name":"Natan Grando"},"headline":"My experience with ReactiveX and asynchronous programming","datePublished":"2017-02-09T15:53:18+00:00","dateModified":"2022-07-01T17:44:21+00:00","mainEntityOfPage":{"@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/"},"wordCount":915,"commentCount":0,"image":{"@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage"},"thumbnailUrl":"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png","articleSection":["Engineering","Opinion"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/","url":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/","name":"My experience with ReactiveX and asynchronous programming","isPartOf":{"@id":"https:\/\/cheesecakelabs.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage"},"image":{"@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage"},"thumbnailUrl":"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png","datePublished":"2017-02-09T15:53:18+00:00","dateModified":"2022-07-01T17:44:21+00:00","author":{"@type":"person","name":"Natan Grando"},"description":"Writing beautiful and simple asynchronous programming code with ReactiveX to provide the best user experience possible.","breadcrumb":{"@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#primaryimage","url":"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png","contentUrl":"https:\/\/ckl-website-static.s3.amazonaws.com\/wp-content\/uploads\/2017\/02\/Banner_reactive6.png","width":2000,"height":720,"caption":"ReactiveX"},{"@type":"BreadcrumbList","@id":"https:\/\/cheesecakelabs.com\/blog\/reactivex-and-async-programming\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cheesecakelabs.com\/blog\/"},{"@type":"ListItem","position":2,"name":"My experience with ReactiveX and asynchronous programming"}]},{"@type":"WebSite","@id":"https:\/\/cheesecakelabs.com\/blog\/#website","url":"https:\/\/cheesecakelabs.com\/blog\/","name":"Cheesecake Labs","description":"Nearshore outsourcing company for Web and Mobile design and engineering services, and staff augmentation for startups and enterprises..","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cheesecakelabs.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","name":"Natan Grando","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cheesecakelabs.com\/blog\/#\/schema\/person\/image\/","url":false,"contentUrl":false,"caption":"Natan Grando"},"description":"10 years of experience in Marketing and Sales in the Technology sector. My main purpose is help, support and structure efficient operations and also develop independent and multidisciplinary teams.","url":"https:\/\/cheesecakelabs.com\/blog\/autor\/natan\/"}]}},"_links":{"self":[{"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/posts\/4067","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/users\/65"}],"replies":[{"embeddable":true,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/comments?post=4067"}],"version-history":[{"count":1,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/posts\/4067\/revisions"}],"predecessor-version":[{"id":10318,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/posts\/4067\/revisions\/10318"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/media\/4098"}],"wp:attachment":[{"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/media?parent=4067"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/categories?post=4067"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cheesecakelabs.com\/blog\/wp-json\/wp\/v2\/tags?post=4067"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}