Javascript Realtime Render?

So, I was wondering if the following is possible…

I want to use MathML or maybe javascript graphics and essentially create a real-time math preview. So I want to have a text box where you insert your source code, and I want the preview box to update automatically.

For example, say I want the preview box to refresh every time the user enters a space character. Is there a way to get only the new source code entered to render in the preview box without having to re-render the entire preview every time?

For example, if a user types 2x^3, I want the math equivalent to show up in the preview window. If a user then types in " + 2x" I want just the " + 2x" part to be drawn right next to the already-drawn “2x^3”.

Is this possible? Or is the only way to re-render the entire preview every time the user types in a new term? I would like to only change what the user has edited. If a user edits the middle of the math, then I have no choice and have to re-render everything after what the user has just edited, but when the user is editing the math at the very end, can I not just tag it on to the end and render just that little piece?

It might be possible that way, but what seems to provide better control for the user could be to have them save the graph as a layer.