<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	
	xmlns:georss="http://www.georss.org/georss"
	xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#"
	>

<channel>
	<title>Asynchronous - Inero Software - Software Consulting</title>
	<atom:link href="https://inero-software.com/tag/asynchronous/feed/" rel="self" type="application/rss+xml" />
	<link>https://inero-software.com/tag/asynchronous/</link>
	<description>We unleash innovations using cutting-edge technologies, modern design and AI</description>
	<lastBuildDate>Fri, 25 Mar 2022 12:54:01 +0000</lastBuildDate>
	<language>en-GB</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.1</generator>

<image>
	<url>https://inero-software.com/wp-content/uploads/2018/11/inero-logo-favicon.png</url>
	<title>Asynchronous - Inero Software - Software Consulting</title>
	<link>https://inero-software.com/tag/asynchronous/</link>
	<width>32</width>
	<height>32</height>
</image> 
<site xmlns="com-wordpress:feed-additions:1">153509928</site>	<item>
		<title>Java: Scheduling the execution of background tasks using Spring</title>
		<link>https://inero-software.com/java-scheduling-the-execution-of-background-tasks-using-spring/</link>
		
		<dc:creator><![CDATA[Adrian Chojnacki]]></dc:creator>
		<pubDate>Wed, 04 Nov 2020 08:47:18 +0000</pubDate>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[Company]]></category>
		<category><![CDATA[Technology]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[angular]]></category>
		<category><![CDATA[asynchronous]]></category>
		<category><![CDATA[backend]]></category>
		<category><![CDATA[big data]]></category>
		<category><![CDATA[java]]></category>
		<category><![CDATA[Quartz]]></category>
		<guid isPermaLink="false">https://sandbox-www.devel.inero.com.pl/?p=3123</guid>

					<description><![CDATA[<p>Artykuł <a href="https://inero-software.com/java-scheduling-the-execution-of-background-tasks-using-spring/">Java: Scheduling the execution of background tasks using Spring</a> pochodzi z serwisu <a href="https://inero-software.com">Inero Software - Software Consulting</a>.</p>
]]></description>
										<content:encoded><![CDATA[<h3></h3>
<div class="row"><div class="col-sm-4"></div><div class="col-sm-8">
<h3><span style="color: #800080;"><strong>Planning tasks in Java</strong></span></h3>
<p><img decoding="async" data-attachment-id="2873" data-permalink="https://inero-software.com/digital-twins-a-dynamic-software-model-of-reality/inero-glify-08-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-glyph" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" tabindex="0" role="button" class="alignleft wp-image-2873 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png" alt="Paragraph icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png 208w" sizes="(max-width: 80px) 100vw, 80px" /><a href="https://inero-software.com/angular-how-to-manage-back-end-long-running-asynchronous-tasks/">In the last post by my teammate we presented how to manage back-end long-running asynchronous tasks from the client side.</a> This approach is used especially in handling the appropriate flow of processes and the timely implementation of specific IT system services that require significant amount of computations. From the backend implementation perspective, one of the libraries that enable task scheduling and easy integration with Java Spring applications is Quartz. In the following sections of the article, the general problem of running background tasks and a use case presenting an example solution will be described.</p>
<p><img decoding="async" data-attachment-id="2770" data-permalink="https://inero-software.com/data-the-playground-of-machine-learning/inero-glify-10-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Inero Software" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-2770 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h3><span style="color: #800080;"><strong>Description of the problem</strong></span></h3>
<p><img decoding="async" data-attachment-id="2873" data-permalink="https://inero-software.com/digital-twins-a-dynamic-software-model-of-reality/inero-glify-08-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-glyph" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" tabindex="0" role="button" class="alignleft wp-image-2873 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png" alt="Paragraph icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png 208w" sizes="(max-width: 80px) 100vw, 80px" />In some cases, the specification of an IT system requires long-running tasks to be performed in background. Compared to synchronous jobs where we wait for output, background jobs allow us to move on to the next job before our primary task is finished. This can be achieved by executing independent tasks in separate threads, which inform the main thread of the application when particular background job is completed. In this case, one thread can be a code block or a method that is a separate unit of work.</p>
<p>The advantages of asynchronous job scheduling tasks include:</p>
<ul>
<li>application performance,</li>
<li>responsiveness and scalability,</li>
<li>the ability to update the progress or parameters of the task,</li>
<li>productive planning of service delivery,</li>
<li>the ability to perform the following tasks without freezing the application state.</li>
</ul>
<p>However, when running background, it is important to remember to skillfully choose between asynchronous and synchronous programming. If You are dealing with simple, short-lived calculations, it is not a good idea to use background tasks. For instance, too many asynchronous calls between main thread and background can make your code less readable, may cause slow application performance or even lead to thread lock and interrupt application lifecycle.</p>
<p>Check out how we deal with such problems in our team.</p>
<p><img decoding="async" data-attachment-id="2770" data-permalink="https://inero-software.com/data-the-playground-of-machine-learning/inero-glify-10-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Inero Software" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-2770 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h3><span style="color: #800080;"><strong>Use case, solution</strong></span></h3>
<p><img decoding="async" data-attachment-id="2873" data-permalink="https://inero-software.com/digital-twins-a-dynamic-software-model-of-reality/inero-glify-08-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-glyph" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" tabindex="0" role="button" class="alignleft wp-image-2873 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png" alt="Paragraph icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png 208w" sizes="(max-width: 80px) 100vw, 80px" />In this post, as an example of using asynchronous programming, we will use a big data download service. Let us assume that a potential user of our website would like to transfer a certain number of files using logic provided by our backend application. As it is presented in the diagram below, the user interface allows to execute task that starts to transfer the file via request made to application server. Since we expect that this task will be a long running one, our goal is to schedule this job to be performed in background thread. Let&#8217;s have a look at details:</p>
<p>&nbsp;</p>
<h3><span style="color: #800080;"><strong><img fetchpriority="high" decoding="async" data-attachment-id="3139" data-permalink="https://inero-software.com/java-scheduling-the-execution-of-background-tasks-using-spring/tasks/" data-orig-file="https://inero-software.com/wp-content/uploads/2020/10/tasks.png" data-orig-size="1294,370" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="tasks" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2020/10/tasks-300x86.png" data-large-file="https://inero-software.com/wp-content/uploads/2020/10/tasks-1030x295.png" tabindex="0" role="button" class="aligncenter wp-image-3139 size-full" src="https://inero-software.com/wp-content/uploads/2020/10/tasks.png" alt="A drawing about how the interface works" width="1294" height="370" srcset="https://inero-software.com/wp-content/uploads/2020/10/tasks.png 1294w, https://inero-software.com/wp-content/uploads/2020/10/tasks-300x86.png 300w, https://inero-software.com/wp-content/uploads/2020/10/tasks-768x220.png 768w, https://inero-software.com/wp-content/uploads/2020/10/tasks-1030x295.png 1030w, https://inero-software.com/wp-content/uploads/2020/10/tasks-1049x300.png 1049w" sizes="(max-width: 1294px) 100vw, 1294px" /></strong></span></h3>
<p>In applications based on <a href="https://spring.io/">Spring</a>, the aforementioned Quartz library is the perfect choice. It allows you to schedule tasks depending on our needs.</p>
<p>Let&#8217;s make the following assumptions:</p>
<ul>
<li>the user can order to download several files at a time,</li>
<li>in this case, the tasks will be performed sequentially,</li>
<li>the user can  (interrupt) tasks,</li>
<li>user is provided with information about tasks, such as <em>id</em> or user data, in the database.</li>
</ul>
<p>Note that with the use of Quartz, you can execute threads simultaneously, but for the purpose of this post will used the task queue. The key interfaces used in this API are <em>Scheduler</em>, <em>Job, JobDetail, JobDataMap, Trigger</em>.</p>
<p>Initially, you need to create a <em>Scheduler</em> instance as the main interaction component. This can be done by injection into a class or by using the lines of code below.</p>
<pre>SchedulerFactory schedulerFactory = new StdSchedulerFactory();
Scheduler scheduler = schedulerFactory.getScheduler();</pre>
<p>The next step is to define an example class, in this case <em>FileDownloadJob</em>, extended by the <em>QuartzJobBean</em> class, which implements the <em>Job</em> interface. The main method <em>executeInternal()</em>,  will be called by one of the <em>Scheduler</em> threads after the <em>Trigger</em> is fired. Inside it, the target action of a given task should be performed.</p>
<pre>public class FileDownloadJob extends QuartzJobBean {

   @Override
   protected void executeInternal(JobExecutionContext jobExecutionContext) throws JobExecutionExceptions{
       // target code of performed operations
   }
}
</pre>
<p>The job scheduling process consists of assigning a unique key &#8220;<em>JobKey&#8221;</em>, preparing a <em>JobDataMap</em> and building a<em> JobDetail</em> instance. Assuming the &#8220;<em>task&#8221;</em> object is one of the records in the task database repository, the operations in question can be performed with the following lines of code.</p>
<pre>JobKey jobKey = JobKey.jobKey((task.getId());
</pre>
<pre>JobDataMap jobData = new JobDataMap();
jobData.putAll(new HashMap&lt;&gt;() {{
 	  put("email", user.getEmail());
  	  put("name", user.getName());
          put("progress", task.getProgress());
}});
</pre>
<pre>JobDetail jobDetail = newJob().ofType(FileDownloadJob.class)
       				.withIdentity(jobKey)
      				.setJobData(jobData)
      				.build();
</pre>
<p>If we have all the details, we can fire the trigger and plan our task.</p>
<pre>Trigger trigger = newTrigger()
       .startNow()
       .build();

scheduler.scheduleJob(jobDetail, trigger);
</pre>
<p>Returning to the assumptions of the solution, consider the possibility of deleting tasks. In the Quartz library it is possible to additionally implement the <em>InterruptableJob</em> interface in our job class.</p>
<pre>public class FileDownloadJob extends QuartzJobBean implements InterruptableJob</pre>
<p>It implements the <em>interrupt()</em> method where we can stop the job.</p>
<pre>@Override
public void interrupt() {
   _interrupted = true;
}
</pre>
<p>Assuming that the operations performed inside the job are carried out in a loop, we can check the given <em>_interrupted</em> field, and for example if it is equal to <em>True</em>, terminate the job.</p>
<pre>if (_interrupted) {
   break;
}
</pre>
<p>Of course, this is just an example of a job interruption. It is fully dependent on the operations performed within the method of execution. From the <em>Scheduler</em> side, the method shown below allows us to call the <em>interrupt()</em> method inside our <em>FileDownloadJob</em> class.</p>
<pre>scheduler.interrupt(jobKey);
</pre>
<p>Another functionality is the sequential execution of tasks. This can be implemented in various ways, such as <em>JobListener</em> or smart use of <em>JobDataMap</em>. In our use case, we choose the second option, due to the possibility of further expansion, i.e. updating progress, stopping and resuming tasks.<br />
Let&#8217;s add another field in our map and fill it with the <em>id</em> of the next job, assuming that all information about the tasks is stored in the database.</p>
<pre>jobDataMap.put("nextJob", nextTask.getId());
</pre>
<p>Thanks to this, when we finish the operation of the first job, we can check if there is a unique key in the &#8220;<em>nextJob&#8221;</em> field of <em>JobDataMap</em>. If so, we move on to the next task. If we would like to add the functionality of changing the order of task execution, we could define another &#8220;<em>previousTask&#8221;</em> field storing the <em>id</em> of the previous task. Based on this, we could define appropriate methods to modify the queue position. In addition, in our map we can store the previously mentioned information about the current data download process and update it via REST endpoints in the client interface.</p>
<p><img decoding="async" data-attachment-id="2770" data-permalink="https://inero-software.com/data-the-playground-of-machine-learning/inero-glify-10-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Inero Software" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-2770 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h3><span style="color: #800080;"><strong>Java Scheduling &#8211; Summary</strong></span></h3>
<p>Asynchronous programming is an essential element in delivering some IT system services. However, it should be remembered that the use of background tasks should be carefully selected for the problem in order to avoid unnecessary conflicts or system overload. If you are using Java, the Quartz library is a good choice that allows you to easily integrate the planning process with our application. Try this!</p>
<p></p></div><div class="col-sm-4"></div></div>
<h3></h3>
<p>Artykuł <a href="https://inero-software.com/java-scheduling-the-execution-of-background-tasks-using-spring/">Java: Scheduling the execution of background tasks using Spring</a> pochodzi z serwisu <a href="https://inero-software.com">Inero Software - Software Consulting</a>.</p>
]]></content:encoded>
					
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">3123</post-id>	</item>
		<item>
		<title>Angular: How to manage back-end long-running asynchronous tasks</title>
		<link>https://inero-software.com/angular-how-to-manage-back-end-long-running-asynchronous-tasks/</link>
		
		<dc:creator><![CDATA[Waldemar Korłub]]></dc:creator>
		<pubDate>Tue, 20 Oct 2020 13:48:28 +0000</pubDate>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[Company]]></category>
		<category><![CDATA[Technology]]></category>
		<category><![CDATA[angular]]></category>
		<category><![CDATA[asynchronous]]></category>
		<category><![CDATA[backend]]></category>
		<category><![CDATA[DeliverM8]]></category>
		<category><![CDATA[frontend]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[websockets]]></category>
		<guid isPermaLink="false">https://sandbox-www.devel.inero.com.pl/?p=3080</guid>

					<description><![CDATA[<p>Today we’re going to talk about managing back-end long-running asynchronous tasks in Angular. This term may seem long and scary to you, but don’t freak out. After reading this article you’re going to be familiar with this concept and even be able to handle this use case in your own&#8230;</p>
<p>Artykuł <a href="https://inero-software.com/angular-how-to-manage-back-end-long-running-asynchronous-tasks/">Angular: How to manage back-end long-running asynchronous tasks</a> pochodzi z serwisu <a href="https://inero-software.com">Inero Software - Software Consulting</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p><br />
Today we’re going to talk about managing back-end long-running asynchronous tasks in Angular. This term may seem long and scary to you, but don’t freak out. After reading this article you’re going to be familiar with this concept and even be able to handle this use case in your own projects.</p>
<h3><span style="color: #511b73;"><b>Why Angular?</b></span></h3>
<p>At Inero Software we are using Angular at the front-end side of most of our projects and that is not without a reason.</p>
<p><img decoding="async" data-attachment-id="2873" data-permalink="https://inero-software.com/digital-twins-a-dynamic-software-model-of-reality/inero-glify-08-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-glyph" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" tabindex="0" role="button" class="alignleft wp-image-2873 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png" alt="Paragraph icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<ul>
<li>It is suitable for big software systems because of its component-based architecture which provides a higher quality of code, better maintainability, and code reusability.</li>
<li>Native Typescript support, Typescript means Types and that means safer code.</li>
<li>Angular, unlike other frameworks, is fully stacked with predefined solutions to problems you may approach, you don’t have to think about which library to use for every single implementation case whether it be routing, reactive programming, or making Http requests.</li>
</ul>
<p><img loading="lazy" decoding="async" data-attachment-id="1596" data-permalink="https://inero-software.com/?attachment_id=1596" data-orig-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-software-glify-10" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-1596 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h3><span style="color: #511b73;"><b>What’s a back-end long-running asynchronous task?</b></span></h3>
<p><img decoding="async" data-attachment-id="2873" data-permalink="https://inero-software.com/digital-twins-a-dynamic-software-model-of-reality/inero-glify-08-2/" data-orig-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-glyph" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" data-large-file="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png" tabindex="0" role="button" class="alignleft wp-image-2873 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png" alt="Paragraph icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/10/inero-glify-08.png 208w" sizes="(max-width: 80px) 100vw, 80px" />The easiest way to understand what’s a back-end long-running asynchronous task is to explain it with an example of our product which possesses this kind of task.</p>
<p>At <a href="https://inero-software.com/inero-software-team-work/">Inero Software</a> we are developing a product called <a href="http://deliverm8.com">DeliverM8</a> which is a delivery optimization platform. It has many functionalities but let’s focus on the important one for today&#8217;s article. Imagine that you run a company that is delivering products all around the country. You need a system that would display to you how many products and which products to put onto a truck and also <i>how</i> should they be ordered so that everything fits nicely.</p>
<p>Input requires the following data:</p>
<ul>
<li>How many products should be delivered?</li>
<li>What are their sizes?</li>
<li>Where do they go? (so we know which products should be on the beginning or end of the truck etc.)</li>
</ul>
<p>The output is a 3d visualization which looks like this:</p>
<p><img loading="lazy" decoding="async" data-attachment-id="3093" data-permalink="https://inero-software.com/angular-how-to-manage-back-end-long-running-asynchronous-tasks/deliverm8_packing_example/" data-orig-file="https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example.png" data-orig-size="1280,720" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="DeliverM8_Packing_Example" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example-300x169.png" data-large-file="https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example-1030x579.png" tabindex="0" role="button" class="aligncenter wp-image-3093 size-full" src="https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example.png" alt="A visualisation of elements" width="1280" height="720" srcset="https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example.png 1280w, https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example-300x169.png 300w, https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example-768x432.png 768w, https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example-1030x579.png 1030w, https://inero-software.com/wp-content/uploads/2020/10/DeliverM8_Packing_Example-533x300.png 533w" sizes="(max-width: 1280px) 100vw, 1280px" /></p>
<p>As you may imagine &#8211; it does take time for a backend service to create output like this, the AI that stands behind <a href="https://inero-software.com/machine-learning-professionals/">DeliverM8</a> logic runs millions of operations per second in order to find the best optimal available element arrangement. This is <b>the back-end long-running asynchronous task</b>. Depending on the input this may take up to <b>10 minutes </b>and of course freezing of the frontend application until the data is retrieved is the last thing that we need, so what should we do?</p>
<p><img loading="lazy" decoding="async" data-attachment-id="1596" data-permalink="https://inero-software.com/?attachment_id=1596" data-orig-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-software-glify-10" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-1596 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h3><span style="color: #511b73;"><b>Approaches</b></span></h3>
<p>A DISCLAIMER: All examples are made with Angular, but the concepts mentioned below can easily be applied to any other frameworks/languages.</p>
<h4><span style="color: #511b73;"><b>Synchronous</b></span></h4>
<p>Probably the worst option out there but should be mentioned nevertheless. If in fact, the user shouldn’t be using the application, while he is waiting for the response, then you can just put some kind of modal loading screen while the user awaits the data and the problem is solved.</p>
<h5><span style="color: #511b73;">How:</span></h5>
<p>You send a single POST request that tells the backend to start the calculations and return the data within the response of the beforementioned request.</p>
<h5><span style="color: #511b73;"><b>Example:</b></span></h5>
<pre>public loadTrucks(loadTruckData): Observable&lt;Route[]&gt; {
return this.http.post&lt;Route[]&gt;('/api/load-trucks', loadTruckData);
}
</pre>
<p><img loading="lazy" decoding="async" data-attachment-id="1596" data-permalink="https://inero-software.com/?attachment_id=1596" data-orig-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-software-glify-10" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-1596 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h4><span style="color: #511b73;"><b>Polling</b></span></h4>
<p>Now polling is a slightly better option if the user wants to use the application while the data is loading and you don’t have that much time to invest in the solution and/or your backend is not providing you with WebSockets then polling is the way to go.</p>
<p>Polling means checking the status of (a backend endpoint in this case ), especially as part of a repeated cycle. Translating it to front-end language means making a get request every few seconds to see if the asynchronous task is finished. For backend that would mean creating a new GET endpoint that would return the calculated data. (if in fact it has been calculated before)</p>
<p>Not the most elegant solution out there but still pretty usable!</p>
<h5><span style="color: #511b73;"><b>How:</b></span></h5>
<p>We make one POST request that informs the backend to start the calculations and one more GET request to get the output data.</p>
<p>One of the ways of polling is combining RxJs’s <i>timer</i> with <i>switchMap</i>. Also remember to unsubscribe, because all sorts of intervals can easily produce memory leaks, in this example, we are using <i>takeUntil</i> operator that unsubscribes from the observable when it’s component is destroyed.</p>
<h5><span style="color: #511b73;"><b>Example:</b></span></h5>
<pre>timer(0, 5000).pipe( switchMap(() =&gt; this.truckService.getLoadedTrucks()), takeUntil(this.stopPolling) )
</pre>
<p><img loading="lazy" decoding="async" data-attachment-id="1596" data-permalink="https://inero-software.com/?attachment_id=1596" data-orig-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-software-glify-10" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-1596 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h4><span style="color: #511b73;"><b>Websockets</b></span></h4>
<p>Websocket is a communication protocol (just like HTTP) “for a persistent, bi-directional, full duplex TCP connection from a user’s web browser to a server”. Basically what it means is that with WebSockets you can send out the data from the server and receive it in your frontend application without making any unnecessary requests (like you would using polling).</p>
<p>With the Websocket approach, you would send an HTTP POST request to start calculating the truckload. And at the same time, you would establish a WebSocket connection between the Frontend application and the server so that when the backend tasks finish the output is sent through that WebSocket connection.</p>
<h5><span style="color: #511b73;"><b>How:</b></span></h5>
<p>Send HTTP POST request that informs the backend to start the calculations and listen on Websocket connection with a backend that returns data when the calculations finish</p>
<h5><span style="color: #511b73;">Example:</span></h5>
<p>At first, you connect to a WebSocket:</p>
<pre>public connect() {
const socket = new <b><i>WebSocket</i></b>(this.webSocketUri);
this.stompClient = Stomp.over(socket);
this.stompClient.connect({},
() =&gt; this.subscribe()
}

</pre>
<p>And later on, you subscribe to its values:</p>
<pre>this.stompClient.subscribe('/user/queue/truck-load-updates-queue', (msg: Stomp.Frame) =&gt; {
const msgBody = <b><i>JSON</i></b>.parse(msg.body);
...
});
</pre>
<p>The subscription above is triggered after the calculation is done.<br />
<img loading="lazy" decoding="async" data-attachment-id="1596" data-permalink="https://inero-software.com/?attachment_id=1596" data-orig-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-orig-size="208,208" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="inero-software-glify-10" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" data-large-file="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png" tabindex="0" role="button" class="aligncenter wp-image-1596 size-thumbnail" src="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png" alt="Separating icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10-80x80.png 80w, https://inero-software.com/wp-content/uploads/2018/11/inero-glify-10.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></p>
<h3><span style="color: #511b73;"><b>Conclusion</b></span></h3>
<p>That’s it!</p>
<p>I’ve described to you the problem of back-end long-running asynchronous tasks and various ways of handling them in the frontend application.</p>
<p>Websockets are the best way to go if you are struggling with this problem, but if the user doesn’t mind getting his application blocked (or maybe it is intended to block the app for the time being) for the time when the backend is performing its tasks then you can simply go with KISS principle and just make one synchronous request.</p>
<p>Polling is also an option if the developers don’t feel like implementing WebSockets and additional network movement is of no concern.</p>
<p>Thanks for reading! And I hope you liked the article 🙂</p>
<p>Artykuł <a href="https://inero-software.com/angular-how-to-manage-back-end-long-running-asynchronous-tasks/">Angular: How to manage back-end long-running asynchronous tasks</a> pochodzi z serwisu <a href="https://inero-software.com">Inero Software - Software Consulting</a>.</p>
]]></content:encoded>
					
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">3080</post-id>	</item>
	</channel>
</rss>
