Shortly, I will be coding up a simple webpage with Javascript to connect to my remote website running a special in-built server. The tiny server, 200KB , and my webpage code work together to create a very simple remote desktop like experience for me. The way it works is instead of constantly making requests to the remote server or having the server constantly feed me snapshots of whats going on its desktop I have it so that the client web page only submits mouse coordinates and keystrokes when the I click or use the keyboard. Once the information is submitted the server takes a snapshot of the desktop (or identifies what has changed since the last request) and responds back to the client with an image. The image is properly positioned on the client screen to give the illusion of an updating server desktop. This approach is perfect for me, however retrieving new partial images and properly placing them on screen, which can be anywhere on a per pixel basis, has been a bit of an issue.

Because my approach to remote desktop is to return back only changed images after i click on the screen (so if i click START the request is sent to the server and eventually i get back a snapshot of only the START popup menu -- i then position this small image overtop of my larger display to give the proper illusion) I need to compose NEW <IMG> tags to allow me to display these new partial images in my client window. I'm constantly using:

var getNewServerImage = new Image()
getNewServerImage.src="http://myserver.com/GetNewImage?MyMouseX=10&MyMouseY=400";
.
.
.
(and once the newly returned image has completed loading)
.
.
clientOnScreenDisplay.innerHTML+="img src="+getNewServerImage.src+" style='position:absolute; top:"+getServerYPos+"; left:"+getServerXPos+"'>";

Thats pretty much what i do for several partial images returned from my server in order to construct the changes found on its side.

I'm worried. Is this a safe approach? Is concating to innerHTML a horrible idea to achieve this affect? Is there a better approach to all of this? I am restricted to Javascripting, Internet Explorer 5.5 or higher, Windows OS, however I can use VBScript, ActiveX components, and so forth as long as they dont cause any security risks or require pre-installing. Basically everything IE5.5 or higher comes with I'm more than happy to use as long as they can be used in a medium security setting.

I've looked into using CSS Compositor filter of IE but that seemed almost exactly like what i was doing above saving me nothing (ie. innerHTML was required to be concatted to). If it is possible I ONLY care about getting the imagery displayed in the proper location. Having it available as an object is COMPLETELY USELESS to me so if there is an approach which can help me achieve this I'd gladly be all over it.

Thanks for your thoughts!