What Web Framework to use to implement the diff-like UI?

Question

What Web Framework would you use to realize the the interface of the following desktop application that performs side-by-side text comparison. More exactly what is in UI:

• document viewer with splitter and highlighting
• lazy loading, as documents might be very huge (10Mb each)
• left navigation bar with color marks and scrolling window
• synchronized scrolling
• hotkeys for navigation (e.g. Alt+ArrowDown = next diff)

Please, one framework per answer. Provide pros/cons of the approach.

Note: this question is a split from Vaadin alternative for heavily loaded UI, where the community tried to solve my problems with Vaadin, but I have heard no real analysis.

Answer 1

In your case, you don't have much of a choice. No matter what framework/language/compiler etc you will take, you will be coding a lot of low level stuff. So your weapon of choice will be JavaScript or GWT (the choice depends on what you prefer/have more expirience). But in any case you will be working with DOM itself a lot, using some component framework is out of question, you won't be able to get any performance out of highlevel component framework.

So my suggestion is to use JavaScript (with Google Closure for some common parts), or something else what compiles to JS (GWT, CoffeScript).

Answer 2

For such a application, webapp(inclusive with framework) is not a good candidate. This is typically desktop application!

Answer 3

I think Wicket can do the trick, using it to reuse the component used to view the two versions of the input. You will have to write a component for each element you describe and write enough Javascript to link things :

• Synchronized scrolling
• Hotkeys support

Lazy loading can be handled by a Wicket behavior, the trickiest part is the global overview with correct coloring, it will need a good brainstorming session to be really efficient.

Hope it can help...