Load DOM then manipulate during long-running operation

Question

I'm writing a .aspx page that contains several different steps and in one of those steps is a long-running operation (syncing information with a web-service). So when the page starts to load that step it will obviously get hung during that operation and not completely load a page and then when it is finished with the sync it finishes loading the page. During this long-running operation I would like to have a progress bar that get's updated as the sync is running too. The tricky thing, I think, is that the long-operation is server-side and not JavaScript.

The website is essentially set up as follows (I can't show actual code really, which I realize isn't helpful):

Dim ourObject as New OurObject(...)
ourObject.AddSiteHeader()

'Series of If statements to determine the step

ElseIf currentStep = "This Value"
'Long-running operation step
End If

ourObject.AddSiteFooter()
ourObject.Kill()
ourObject = Nothing

With that setup the issue is that during the process the page doesn't load, then like switches to the partially loaded webpage, then finished spontaneously when the sync is over. Which is expected, but not what I'm looking for.

Then I tried this.

Dim ourObject as New OurObject(...)
ourObject.AddSiteHeader()

'Series of If statements to determine the step

ElseIf currentStep = "This Value"
Response.Flush()
'Long-running operation step
End If

ourObject.AddSiteFooter()
ourObject.Kill()
ourObject = Nothing

Which helps load the page partially from the start, but then it get's hung up during the process still, again expected but not desired.

Last thing I've tried really is this:

Dim ourObject as New OurObject(...)
ourObject.AddSiteHeader()

'Series of If statements to determine the step

ElseIf currentStep = "This Value"
ourObject.AddSiteFooter()
Response.Flush()
'Long-running operation step
End If

If currentStep <> "This Value"
    ourObject.AddSiteFooter()
End If
ourObject.Kill()
ourObject = Nothing

Which get's me the closest because it actually loads the full page and then does the operation, however it does not work completely because even though the full page loads, it doesn't look right (it looks scrunched? best way I can put it) until after the process finished. But even if it did look right, since I've loaded the footer, I wouldn't be able to manipulate the DOM (right? I'm still pretty new to web development so trying to figure things out).

A few of my other ideas that I've had is by making the long-running process use asynchronous calls and do things with that, but I don't know what I'd do past that. I've also thought about some how doing things with JavaScript or using AJAX, but not sure how to integrate those in terms of the process either.

Does anyone have any suggestions on what to do given how things are kind of set up?

Oh, and the last idea I had was to split the long-running process up into multiple calls to the webpage and just execute different parts of it each time. Though, I'd have to do a big restructure of things if I do it that way, but if that's the only way, then so be it.

Thanks for any help though, I appreciate it. Hopefully I explained this well enough...

Answer 1

You can try making your tasks Asynchronous on your server side code(http://www.hanselman.com/blog/TheMagicOfUsingAsynchronousMethodsInASPNET45PlusAnImportantGotcha.aspx and http://www.asp.net/web-forms/tutorials/aspnet-45/using-asynchronous-methods-in-aspnet-45 are good things to look at). In short, this will let you fire off a bunch of tasks all at once, but not load the page until complete. Currently your code is firing off a task.. waiting.. completing.. then moving to the next (1, then 2, then 3, then 4, then 5). ASync let's you say (1,2,3,4,5 GO... wait for all).

If you want some UI improvements instead to showcase where you are in the process.. you may be better suited to having a basic web front end, and some WCF services in the background that kick off the processes, of which your front end UI can periodically poll and show an updated progress.. jQuery can make this trivial to do.. setting up your back end services would be the hard work.

All that being said, I used to write stuff like this with ASP.NET years ago, and found that over time, ASP.NET isn't really suited for long running operations like this. It's not that you can't do it.. you obviously can of course, but IIS is build for quick in\quick out HTTP Requests and Responses. A long running operation like this chews up available connections and eats up server memory. If you have the option, I recommend you put these operations in.. at the very least.. some service layer. If you don't need a UI at all to showcase this stuff.. use a console project. It's 95% the same code, but the server manages starting and completing it much better than a long running ASP.NET web page.

Hope this helps!