DEV Community: Pradnyanand Milind Pohare

The Unseen Conductor: Orchestrating App Notifications with EventBus

Pradnyanand Milind Pohare — Sat, 20 Sep 2025 18:50:04 +0000

Context and The Problem.

At my current company, we have a wholesale app designed for tier-2 or tier-3 city Kirana (grocery) stores to purchase goods at wholesale prices. Because this is a B2B integration, there are a lot of offer popups, nudges, notifications, and feedback popups each time a user opens the app. That’s a poor user experience: bombarding the user with multiple things on app startup is not ideal, and doing so all at once is particularly jarring.

To illustrate, imagine you’re using a food-delivery app that needs to show several messages: first asking for location permission, then introducing new features, then asking for a rating—all shown at once. That would be annoying.

What is EventBus ?

That is where EventBus comes into the picture. EventBus helps widgets that are not directly related or screens that aren’t dependents of each other communicate with one another.

For example.

A user completes an action on Screen A (e.g., saving a profile update), and Screen B (e.g., a settings screen) needs to be refreshed or updated to reflect this change. Instead of passing callbacks or using shared ChangeNotifiers that can become unwieldy, Screen A can fire an event, and Screen B can listen for it.

How EventBus was useful for us ?

Because there were multiple popups that were compiled and shown to the user at the same time, using EventBus allowed us to display them in a sequencing order. An additional enhancement was that once a popup is shown, we check whether the next popup in the sequence is available. This prevents the user from waiting for data to fetch for the next popup and allows it to show immediately when ready.

This is like having a smart assistant that presents a series of popup messages on your phone, one after another, in a specific order, waiting for you to close each one before showing the next.

Think of it like a queue at a restaurant where the waiter brings dishes in a specific order. The system has a list of all the popups it wants to show (A, B, C, D), but it’s smart enough to check if each popup is relevant right now. For example, if you’ve already granted location permission, it won’t show that popup again. It only shows popups that make sense for your current situation. When you close one popup, it automatically shows the next one in line, creating a smooth, organised experience instead of bombarding you with multiple popups at once.

I have added a demo implementation of EventBus in this Github repo do check that out.

Different use cases that I can think off

Changing App Theme
Scrolling/Refreshing list to top when user clicks on bottom navigation tab bar (WhatsApp, Instagram, many of such social medial app have this functionality)

Limitations of using EventBus

Debugging Complexity - Events can be fired from anywhere and received by multiple listeners anywhere else in the application. This "publish-subscribe" model can make it challenging to trace the exact path an event takes from its origin to all its destinations.
Global State Issues - Because any component can subscribe to any event, it's easy for a component to react to an event it wasn't designed to handle, leading to unexpected behaviour.

When to use EventBus ?

You have truly global, infrequent, and lightweight notifications that affect multiple
When an event can affect a varying number of components, and the publisher doesn't need to manage the list of subscribers.
In larger applications, different modules or features might need to communicate without having direct dependencies on each other.

Alternative to EventBus

Direct Method Calls / Function Callbacks - calling component directly invokes a method or passes a callback function to the component it needs to interact with.
State Management - Provider, BLoC/Cubit etc
Navigation and Route Arguments - When navigating between screens, you can pass data directly as arguments to the new route.

Bottom line: Your app shouldn’t rely solely on EventBus. Use a combination of the alternatives above as appropriate.

About Me

Why app gets slow in Debug mode, React Native

Pradnyanand Milind Pohare — Sun, 30 May 2021 15:08:53 +0000

I was in my interview phase, In one my interview the interviewer asked me "Why our app gets slow in debug mode ?". I didn't have any answer to that question then. So I said "To be honest I don't know, I have gone through this situation but I never explore the reason behind it"

Always explore the why part behind each basic things while learning.

So after the interview I started to search on google the reason behind it. And this is what I have came to know.

The Problem

When we use Debug JS Mode while developing React Native app, App gets very slow, JS Frame rate gets dropped.

Each button click and transition takes almost a couple of seconds and sometimes even more. With all this, debugging application feels like working windows vista.

What happens when We turn on Debug Mode

When we switch on Debug mode then instead of running JavaScript code in your Phone or Simulator it runs in chrome or debugger your are using on your computer. And that's why the interaction with app gets slow.

For example you click on a button then that event gets register in app then it gets send to the debugger or chrome. So this process makes the app slow.

When you use Hermes in a production build, the bytecode is compiled in advance and can be executed quickly.

Reference from A thread -- When you use Hermes locally with Metro, Hermes is running in a lazy compilation mode. This is faster than compiling all the bytecode every time you reload from Metro, but slower than a production build. So slowness in dev mode does not necessarily means slowness in release mode. If Metro were able to compile bytecode one module at a time and deliver it incrementally to the device, this would probably help.

What can we do to fix this ?

From above section we came to know that If we switch on the debug mode the app tend to run slow. But there can be some extra factor which can make the app very slow in debug mode. So for that we can try following solutions

Remove excess amount of console logs
Check the time clocks on your phone and your computer. They should match or you can keep the phone's clock to a few seconds ahead of the computer.
Instead of chrome debugger use React Native Debugger.
Deactivate the "Slow animation" option in the debug menu.
Always try to resolve warnings if there are any.
Try solutions from this issue

Even after trying above solution if your app is running slow then you should check another app in debug mode if that one is working fine then in your first application there can be problem in code , maybe re-rendering of components happening.

I hope this blog help anyone out there.

If you want to read more Do visit my website and Don't forget to subscribe to blog you will get update whenever I upload a new one. Cheers. Cheers.

The Problem With My Website

Pradnyanand Milind Pohare — Sat, 29 May 2021 19:01:35 +0000

So in 2018, I was working on this project where I needed to integrate Paytm’s payment gateway to an app. I never used Paytm's gateway before in any of my applications. So I was researching on it a lot. After one day of research I started to work on it. In half day the integration was done, but there was an issue.

The payment was only working via paytm's wallet and not by any debit or credit card. Me and my colleague Aditya worked on it for another half day, but we did not find any solution for that. So finally we tweeted Paytm on this issue and started to wait for the response.

On the weekend me and my friend went outside for the dinner and I was trying to pay the bill by Paytm wallet but the transaction was not happening. Then a message came from the Paytm that I have to first complete Paytm KYC. And then I thought may be this the issue with my application.

So on next day me and Aditya completed our KYC. Came back to office and tried to do any random transaction on my app but still it was not showing any card option to do payments. I was very frustrated with that, we went outside where temperature was like killing our body and till my payment was not happening. We gave a break and waited for the Paytm official to contact us.

After two days Paytm’s response came and what the solution was very easy and laughable. They told that the integration you are trying is in “Test" mode, to do transaction with your debit card you have to change your paytm mode to “Transaction” mode.

I was laughing like anything because in other payment gateway like in “Instamojo” or “PayUMoney” you can use dummy debit card details to do payment and I thought it will be same with paytm too. I was wrong. HAHAHA

Always read the documentation carefully.

While writing down this blog also I was smiling becuase it was very silly mistake on my side. Well that's how you develope a mobile application I guess, by try and error. Cheers.

If you want to read more Do visit my website. Cheers.

The Problem With My Website

Pradnyanand Milind Pohare — Fri, 14 May 2021 15:12:22 +0000

Here I'm talking about my website. It's my portfolio website and one thing I was sure that I needed one. I have this one from past two years and time to time I'm trying to improve it.

The Problem

We need to improve or fix something when there is a problem. And the problem with my website was each time I used to switch to new route my component used to mount again and api call used to fire to fetch data.

Issues with this

User have to wait until component render data
API used to fire again an again to get data
Website used feel slow
All the state data used to reset

Findings

When I look online it says whenever we change path, in react it mount that component again. But I was thinking why the online website does not behave like mine one does.
I asked my friend Mohit and Anurag as both were working with React JS from couple of years.

The conclusion of the discussion was to use redux and have a state to check whether user visited that page or not and according to that in ComponentDidMount trigger animation or fetch API .

Implementation

After adding redux and all other checks in ComponentDidMount , the redux state used to reset whenever I used to change my route. I thought my be its because I'm using class component but its should not matter whether its class or functional because store should not reset because of it.

So I went to basic, I looked online How one navigate to another page. Thats where I found my mistake.I was using Anchor Element to navigate to another page where everyone was using one of the following method

1.Link

 <Link to="/path" className="btn btn-primary">Navigate</Link>

2.Redirect (From react-router)

<Redirect to='/myComponent' />

3.Using history prop

props.history.push('/path')

I ended up using history prop to navigate between my pages. So the combination of redux state check and navigating using history prop I'm able solve my problem.

Things Improved

No multiple calls to API for data
User does not have to wait

Maybe I'm right maybe I'm wrong but for now It's how I resolved it. Do let me know guys if you hsave any other solution by commenting below.

If you want to read more Do visit my website. Cheers.

The Right Decision

Pradnyanand Milind Pohare — Sat, 14 Mar 2020 15:07:13 +0000

It was the last week of August, I was At T.I.M.E Institute preparing for CAT 2018. It was the main reason for me to come to Pune. One day I was going through my Internshala Profile and I started to apply for internship. Arcanheim Softworks was one of the companies I applied to, and even got a call from them the very next day. I remember vividly, I was in my bed, watching Casey Neistat's videos on Youtube when I saw my mail notification from Internshala, I have an interview next day in the afternoon at Arcahnheim Softworks. Literally a lot of thoughts were going through my mind. What should I do?, Should I go for the interview or not?, what If I got selected?. Surely I would have to quit TIME, that too after paying the entire, Non-refundable fees. I still remember, I switched off my laptop and took a nap(Its something I do when I find myself in a position like this :p). The next morning I woke up and thought to myself why not just go for the interview?, It will be a good experience. I put on my formals and went for the Interview, thanks to Ola’s share cab, it took me two hours to reach just nine km, I thought I’m screwed.

I was in the Building but Couldn’t find the office. The HR who contacted me for the interview, her number was also out of reach, so I went on google, got the C.E.O’s number and asked for the direction and came on the third floor of RK1 building in Rasta Peth, Pune. I was outside of the office, Obviously a little nervous knocked on the door and Aastha (HR) opened the door and asked me to sit on the sofa. I was wearing formals, which I don’t like to wear, I was without a belt and the shirt which was white at some point of time, which was now pale yellow. They called me inside, I went directly to The Interview room, sat on the chair and waited for the interviewer to come. Till then I took out my phone, launched my Tree Identifier application, and took a photo of the plant which was behind me. It had a complicated name. Sumeet and Aditya were the two guys who took my Interview. They started with the question “What Type of application I have made so far?“, and personally I liked the starting question. Because in most of the interviews The Interviewer starts with a question like "Tell me about yourself?".

I’m not against the question, but I prefer the person interviewing me to have more interest in my work more than me as a person, especially at the start of an interview. I might be wrong, I might be right. It's my personal opinion. Then my interview went ahead, I showed them all my IOS applications and talked about my Interest. I was aware that its a gaming company and was wondering what project would I be working on as an intern. I was happy to know that I will be working in the Android Development area. In between questions they both were looking in screen and I was looking outside, checking out what other people are working on and whether they were wearing formals in office, HAHAHA I was more curious about that. My Interview got over, they asked me “Do you have any questions?” and my question was “Do you have any dress code to follow in office”. The answer was “NO”, And we all smiled on that.
My interview was over, I took the lift, went down, booked a cab, Again the Ola share cab, and while listening to some old Hindi songs, I was thinking about how the interview went. I was hoping to get this internship so that I will start working rather than going to a coaching class.

I never thought of doing an internship after college, but I was more curious to start work. They sent me a mail and it was about result of the interview which would be out tomorrow. Guess what next day I got a call from Mayuraj(C.E.O), and he told me that I’m selected as an Android Developer. I still remember he asked me on phone “Are you happy?” and I was like “Hell Yeah, I’m Happy”. The First Week Of September I joined the company and as I expected, On the very first day I was working on my first project in Android. This was my interview experience, which I wanted to share with you all, to give you all a message that anything is possible in life, Life is full of surprises. This was my chance to do what I wanted to do from my college time and I took it. I left the coaching and started going to work each day and I'm very thankful for my parents for that because they always trusts my decision.

If you guys have any questions, you can ask me in the comment section or on my Linkedin. Doing what you love will make life better and work will not feel like work.

If you want to read more Do visit my website. Cheers.

How to cache videos in a react-native project using Android's ExoPlayer cache

Pradnyanand Milind Pohare — Thu, 27 Feb 2020 18:25:51 +0000

Why we cache data?

Cache means storing data inside the memory. We access data from a server by making network calls. If we trying to access the same data again and again then making a network call each time does not make any scene. That is where cache comes to help. We store data inside memory, access them from memory, which saves the user's internet data.

Coming back to the topic of this blog, If we want to play videos inside a react-native project there is an amazing library called react-native-video. This library can be used to play videos inside Android and IOS. But there is a catch, react-native-video provides caching for IOS only, not for Android. So how can we cache videos using react-native-video inside Android?

There are two ways you can cache videos

1. react-native-video-cache

Basically react-native-video-cache creates a local proxy server to play videos using the AndroidVideoCache library and when it completes caching its serves videos through cache directory. Which is perfect, that is what we want but when I test it on BrowserStack, Videos was not playing, I was getting 502 error. Which is weird because videos were playing into an actual android device. May be browser stack does not allow us to create a local proxy server. I’m not sure if anyone has any idea please comment down below.

2. react-native-fs and react-native-fetch-blob

Both libraries use file systems to download and store data. But consider this case, You have multiple videos in a list to play but we have to wait until they get download, which is frustrating also not correct to make a user wait. It's not caching while we stream them.

So How can we cache videos while streaming?

Solution

react-native-video-android-cache

The library react-native-video provides us, two players to use Android’s default player and Android ExpoPlayer. ExoPlayer does support caching videos, So why not I make the change inside ExoPlayer which react-native-video uses.

So I looked on google for caching inside ExoPlayer and found the solution on StackOverflow. So I forked react-native-video library, created a custom class that uses CacheDataSource from ExoPlayer to cache videos. Also, I had to make a change inside ReactExoplayerView class from react-native-video, where instead of returning default mediaDataSourceFactory I had to return custom class which we have created.

I have named the forked library as react-native-video-android-cache, You can use this library to cache your videos using react-native-video in Android. You can provide maximum cache size and maximum file size.

Step 1 -
npm install --save git+https://git@github.com/paddy57/react-native-video-android-cache.git

Step2

You may need to link react-native-video to your project. Follow this link (https://github.com/react-native-community/react-native-video#android-installation)

That's it. Just observe app cache size increasing while you stream videos. I hope this library will be useful to you.

If you want to read more Do visit my website. Cheers.

How to fork GitHub repository and use as npm dependency inside a react-native project

Pradnyanand Milind Pohare — Thu, 27 Feb 2020 16:06:09 +0000

Forking is the one thing I have never used in git. Yesterday I came to know how can we use it.

Why we use a fork?

Open source is a great thing, someone writes a library, so that others can use it, others can add up to it. Let's assume you are using an open-source library in your project, the library has everything you need except that the one thing you need for your project. That's where forking comes to help. Basically forking means you are creating a copy of the open-source library, making appropriate changes, committing back or submitting a pull request to the author of the open-source library.

How to fork an open-source library

Click on the Fork button on the right top corner of open-source GitHub repository
Then clone the forked library inside your local directory
git clone "forked lib URL"
Make appropriate changes to the library and commit it
git add .
git commit -m “commit message”
git push origin master

Now all the changes you want to make in the open-source library are there, the only thing remaining is to use this forked library as a dependency in your react native project.

How to use GitHub repository as an npm dependency in a react-native?

We make changes in open source libraries because we want the library to behave different for our project. Now consider a scenario

You went to node_modules/open_source_library
You made the changes
You are done here but in the future, there will be a case where we need to delete node_modules in order to resolve Android Studio’s linking with react-native libraries.
Now you will run npm install in order to install the open-source library. All your changes now has override by the original library. This means you need to make those changes again.

That’s why we fork the library and make changes so that we can use it as an npm dependency. Only question here is "How can we so that?”

It's very simple, You just need to run following command.

You should be in your project directory
npm install --save git+https://git@your fork repository URL without https://.git

You will notice that inside package.json in the dependency section, Instead of the open-source library version you will see your fork library.

That’s it. I hope this blog will help you in any way possible.

If you want to read more Do visit my website. Cheers.