﻿ Html4JavaUXStudy2014 - NetBeans Wiki




Very nice thing was the ability to do re-study - once the study was over, I improved the javadoc and ansked Denis' guys to look whether the HTML4Java API is any better. It was, but there were still few glitches - I fixed them in version 0.8.




  1. Creating own application in Java that renders through HTML.
  2. Animating an HTML page from Java via knockout bindings:
  3. Communicating with a server using JSON & REST or WebSockets
  5. Interact with JavaScript from Java


Creating own application in Java that renders through HTML

Comments related to the first task:

Eclipse is Broken





Not a JavaEE Technology!


Done: Described various packaging options.

Why Model Annotation at All?



Understanding Knockout.js





netscape.javascript.JSException: Error: Unable to parse bindings.
Message: ReferenceError: Can't find variable: on;


Understanding Maven


Done: Should always replace the x.y with appropriate version in the documentation.


Done: The desktop version requires JDK7 and JavaFX. Documented.

Animating an HTML page from Java via knockout bindings



Note added: Probably talk more about knockout.js and warn that this is not JavaEE




[ERROR] Failed to execute goal org.apache.maven.plugins:maven-compiler-
Main.java:[23,8] error: cannot find symbol




Communicating with a server using JSON & REST or WebSockets


  "files": {
    "gistfile1.cs": {
      "filename": "gistfile1.cs",
      "type": "text/plain",
      "language": "C#",
      "size": 139










Invalid: The documentation for OnReceive annotation already contains non-array example!

Too cryptic error message:

java.lang.Exception: [object XMLHttpRequestProgressEvent]
at org.netbeans.html.ko4j.LoadJSON.notifyError(LoadJSON.java:187)


/** Generates class Resp which is a Java representation
* of appropriate JSON object sent from the server.
@Model(className="Resp", properties={
static class RespImpl {

Action: Investigate, improve error messages.

Create a Java API wrapper for some JavaScript library




Document: Fixed the example, but possibly enlarge it.

From eclipse it is giving a

at test.Task4Model$TaskJS.chkAge(Native Method)

Action: Investigate the sample.

Error message:
at org.apidesign.html.boot.spi.Fn$1.invoke(Fn.java:152)
at com.atelles.Mul.multiply(Mul.java)
at com.atelles.BoxModel.showBoxPosition(BoxModel.java:34)


Interact with JavaScript from Java


at test.Task5Model.usefulModify(Native Method)
at test.Task5Model.chkage(Task5Model.java:28)

Done: The file really needs to be postprocessed by one of the Maven tasks.













Yes. In Task1 I had created a simple html form with four input texts and a Submit button, I was not able to bind it to the code. Documentation was not sufficient in covering all types of bindings, and I had to resort to searching examples to get a hint on what to do. Also in some cases like @OnReceive and @JavaScriptResource the trace is difficult to debug.


Fortunately, I managed to run the project in NetBeans IDE 8, so debugging and testing were very easy. Well, I am fantasizing now, but as soon as html file and model file are tied together logically, so it would be great if a developer has an ability to see the two files on the same screen simultaneously and see the final result on the same screen like in Knockout.js tutorial http://learn.knockoutjs.com/#/?tutorial=intro. But of course it is not critical. As I said, debugging and testing process was very smooth.


Well, I was debugging, caught breakpoint, but got “Java Quit unexpectedly” so that “emulated” browser just closed when I tested json data retrieval. If you are using some IDE like Eclipse which do a lot of possibilities for debugging. While testing from maven scripts, it was very difficult to debug as parsing through crash dump and finding the reason was time consuming. Initially I had faced a problem with using the api in eclipse project, however after importing the annotation rendering api (net.java.html.json-0.7.5.jar) into eclipse, I was able to use the API easily into my IDE and the development/debugging and testing pace increased significantly. Also I did not find any default logging mechanism apart from the stacktrace generated.

No. I didn’t know how to debug, so I had to put System.out in some points to understand what was going on. Using BrowserBuilder instead of a real browser didn’t help. For every change I made I had to recompile and launch BrowserBuilder, and there are the issues I wrote on Task2 about recompile errors I usually get.


  1. More simple language should be used.
  2. Some comprehensive examples.
  3. Definitely requires getting started tutorial.


  1. Specify clear prerequisites for the API: Maven, Knockout.js knowledge, some IDE that supports Maven projects.
  2. Provide consistent cross-referenced documentation with a clear starting point.
  3. For every API feature provide valuable example, from start to finish, not just pieces of code that were pulled out from some context.
  4. I still don’t understand how to use the API without Maven. Is it possible at all? Maybe you should consider adding some info on that.
  5. Maybe you should consider adding some information on internals of the library: at least some basic information on how it works.

  1. HTML has vast number of tags and events and properties, it is not possible to list all but currently documentation has so few code snippets for different elements. Although the online examples are very helpful and clear a lot of concepts.
  2. Add more information on annotations.
  3. Logging and error messages for runtime exceptions is a problem, a lot of time I had to browse through the whole of stacktrace to understand where the problem is.

  1. A complete example of using an external js library.
  2. Instructions of how to debug.
  3. How to deploy to a web container.
  4. Missing the @ on the Including JavaScript Libraries section (fixed)
  5. Example of how to consume a JSON that is not an array.


In fact, I haven’t much experience with html rendering technologies, because I am mostly a non-UI guy. But I have some experience with internal home-grown rendering technologies and they all were bad: difficult to use, maintain and test. Your API seems very powerful for me, but I am afraid, just for now I wouldn’t like use it in our production environment because of the lack of the documentation and the lack of personal experience with it. I am just simple not sure if I could do something that goes beyond the API examples.

Some other API available to render html pages using java are Java Server Faces API, CSSBox, Cobra & LoboBrowser (part of Lobo project), Flying Saucer Project. I would use Flying Saucer or LoboBrowser. Flying Saucer project provides an ability to render XHTML and with a pretty advanced features to filter with facilities of pdf, image, graphics conversion. LoboBrowser is full browser written in java that supports HTML4, Javascript and CSS and allows rendering at different levels. This again goes against the ease of simply importing an API versus switching to a different browser interface altogether.

I think the salient point of html4j is it's lightweight and ease of use. All I had to do was import a few libraries into my eclipse project, write shorter code using annotations, learn binding techniques (which has to be done anyways for all technologies) and get started, so maybe I would consider it. There is Cobra platform, it is also a lightweight API which enables html4, Javascript & CSS rendering. But I won’t choose it because of their documentation is not elaborate and online samples are limited.

At the current stage I wouldn’t use this framework. You have to show upfront how to do two very important tasks that I didn’t learn:

  • How to integrate with a real use case scenario: show how to deploy to Tomcat, how/when do I applyBindings?
  • How to debug properly: easy of debugging is a critical aspect for me.




Good review. It shows the common problems people run into (Maven, Eclipse, debugging) as well as misunderstanings (this is not a JavaEE technology, but client one). There are clearly things that should be better documented and explicitly explained.

We use the feedback to make the API more usable.

Not logged in. Log in, Register
