16 Jun 2014

Giving feedback during a long running task

Some tasks take a long time, there is no avoiding it.
Some factors are under your control and can be optimised, such as your data caching. Others are not, for example external services.

When considering what if any feedback to give to the users, you need to consider the following:

  • What is the most time the user should go without any feedback?
  • What happens if the user is left without feedback for too long and tries to refresh the page?
  • Can the task be broken down into discrete steps?
  • Can the steps run in parallel or do they need to execute in a sequence?
  • Do all steps need to complete?

Short transactions
A lot of web transactions are simple one step transactions. The user posts data to the web server, it performs a simple operation then redirects the user to another page which shows the result.
This pattern is described here: http://en.wikipedia.org/wiki/Post/Redirect/Get

PostRedirectGet_DoubleSubmitSolution

If the task takes a short amount of time (e.g. 10 seconds), then a wait cursor or ‘Please wait’ message would be the simplest feedback you could do.
Note: duplicate transactions are possible if the user re-posts the page before processing completes. This scenario must therefore be handled with code on the server.

Click to see a Demo: /mvc/Feedback/PostRedirectGet

 

Long transactions
A long running task could be one that takes more than 10 seconds. The task could run in the background on the server and the user be redirected to a ‘holding’ page.
When the task is running the user would like to see feedback.
To give the user this feedback the client must either pull or server must push this information. This should happen every few seconds until the task completes.
This could be described as a Post / Redirect / Get / Redirect / Get pattern.

PRGRG

A simple example of the client pulling the data would be to reload the page from the server every few seconds. When the background task was complete, there would be a redirect to the results page.

Click to see a Demo: /mvc/Feedback/PostRedirectGetRedirectGet

Another solution would be to use JavaScript to make periodic Ajax requests to the server.

A server push solution could use Signal R, which allows the server to push progress data to the client to display to the user.
http://en.wikipedia.org/wiki/Comet_(programming)

Click to see a Demo: /mvc/Feedback/SignalR



Real World Example
‘comparethemarket.com’ is a comparison site which provides car insurance quotes.
After you request a quote, a list is built on the page while you wait. After about 45 seconds the search is stopped and the results are shown.

This all happens in a single browser page and could be classified as a mini single page application (SPA). It works using JavaScript as follows:
1. Block the page displaying ‘Searching…’
2. Post the request for quotes to the server.
3. Request new quotes from the server in JSON.
4. If the server provides quotes they are added to the page and the search feedback is updated.
5. If the response Indicates that the search has not finished then sleep for 5 seconds then go back to step 3.
6. Unblock the page.

1. CTm1

2. CTm2

3-5. CTm3

6. CTm4

. Calls

blog comments powered by Disqus

Image attribution: "Feedback" by Dennis Skley is licensed under CC BY 2.0

About Me


My first computer was a Commodore VIC-20, I had great fun trying to code text adventures and side scrolling shoot ‘em ups in BASIC. This helped me lead the way as the first in my school to pass a computer exam.

Currently I work as a Senior Software Engineer in Bedford for a FTSE 100 Company. Coding daily in C#, JavaScript and SQL. Outside of work I work on whatever is interesting me at that time.