Applying Camunda for Conditional UI Flow

Camunda 8 Topics Discussion & Questions
1

Hello team,

We are currently applying Camunda to implement a conditional UI Flow for end-users.

Specifically, as illustrated in the diagram belows:

Luồng Camunda Demo.drawio
Luồng Camunda Demo.drawio961×1027 46.1 KB

We have a React application that handles the UI, where users go through a series of steps. The visibility of each subsequent step depends on the input provided in the previous step.

Our current approach is as follows:

Each time the user clicks “Next” on the interface:

  • The Backend For Frontend (BFF) temporarily saves the user’s requests to the database & do some validation check
  • Next, it interacts with Camunda to start or continue the process until it pauses at a User Task.
  • At this point, the backend calls the Tasklist API to retrieve the current User Task information (we use the screen name as the User Task name) and returns this to the React app. The mechanism here is interval repeat call Tasklist API until its return data then BFF send user task information back to react app
  • The React app receives the screen name and renders the corresponding UI

At the moment, this mechanism is worked but it has one major issue: Performance

We conduct a performance test by simulate 500 users to do this form repeatedly (using JMeter & API Calls) over 15 minutes

We observed that to switch between steps form, it tooks 5-6 seconds on average at the first 100 users → when it goes to 500 users, its 10s which is really bad for user experience

Check the response time, we don’t see any bottlenecks in backend or database, but realize that

to get next user task during the process execution, the BFF normally need to call API Tasklist 6-10 times (each time was quite fast, around <400ms, but aggregately, it’s a huge amount of execution times)

We want to achieve <1s switching between step form.
So our goal when optimization is try to reduce the numbers of API call from BFF to Tasklist, but the Tasklist need to have data in elastichsearch in order to return data for BFF which depends on zeebe’s stream exporter (if my assumption is right)

So my question would be:

  • Is there any docs that have guideline for optimize zeebe & elastich integration, especially to decrease export time
  • Or there is another way for BFF to call Zebee directly to get user tasks instead of tasklist/operate

Other informations:

  • We check the execution time of job worker handle system task → it’s < 1s on average, so this maybe not a starting point for us
  • Hardware requirement: we follow the recommendation from official document for self-managed
2

Hi @hieudvm, welcome to the forums! What you are running into is likely due to the exporter. There are several discussions in the forums around this (here’s one comprehensive thread). Essentially, when you query the API, you querying cold storage (by default Elasticsearch), which requires data to be exported to it first.

For a better, scalable solution, I would recommend one of two approaches:

  1. Use execution listeners to push the state of the process to your application. There are two downsides to this approach: first, you have to set the execution listener on every task you need to monitor; and second, they don’t support user tasks yet (support for user task listeners is coming in 8.8). However, while you’re currently using user tasks, you might be able to use different task types depending on your needs.
  2. Use a custom exporter that triggers events in your application based on the exported data.
3

Thanks @nathan.loding

We’re trying the approach to move on to Camunda 8.8 to utilize the user task listener approach, look likes this solution works in our context

Thank you for your support