Enable Angular Universal with a Java backend

[jeffwhelpley]

There are a couple potential ways to do this through Nashorn. Opening this issue to start the discussion and plan out how we can achieve this goal.

[cheungtitus]

@jeffwhelpley thanks for starting this and your referral to the doc at https://docs.google.com/document/d/1a3LDFEi6xV9vNNZxjoRwIw-Z3pgj_HAZXCJe8-gkAeA/edit#. This is awesome. Given Spring has already gone GA supporting Script Based Templating on Nashorn, just wondering if compatibility with Spring is part of the plan? @sdeleuze at the Spring team does intend to support Angular 2 server side rendering as mentioned on SPR-13508 so it'd be good to see the two teams are joined up and collaborating on this front. Maybe we can invite Sébastien to discuss on the next meet up?

[jeffwhelpley]

@tbosch what do you think?

[sdeleuze]

Hey, indeed we would like to experiment with Spring support for Angular 2 server-side rendering as part of our Spring Framework 5 roadmap, and that would be awesome to be able to discuss that with you. You can find some information about our current support for isomorphic/universal applications here.

Script loader extension to load JS and resource files from the classpath is also a key topic I would be interested to discuss with you.

[manekinekko]

@jeffwhelpley last week I started POC'ing Universal on Spring. I basically wanted to write a renderer for Spring. My work is based on the work of @sdeleuze and other resources I found on the Internet. However, I was quickly blocked, because SystemJS (and even Webpack) are not supported by Nashorn.

Here is my repo for this POC: https://github.com/manekinekko/angular2-springboot-engine (BTW, I am not a Java guy so the code may seem messy or not well designed ^^)

Here is the issue I opened for SystemJS: https://github.com/systemjs/systemjs/issues/1113

@sdeleuze I tried to contact one of your french colleagues at Pivotal, I met at DevFest Paris this year (Brian Clozel) without any success :)

[sdeleuze]

@manekinekko Thanks for your feedback and experiment. I will have a look shortly. @bclozel reached me about you but we just had not the time to plan a meeting before our vacations.

[manekinekko]

@sdeleuze I suspected Brian was on vacation ^^ You can ping me if you need more info, we are on the same time zone

[ryancampbell]

Hey there, I'm very interested in this as well (using the latest Grails with Angular Universal). Has anyone made further progress with this?

[jeffwhelpley]

There are people working on this, but I have been out of it for a couple weeks getting ready for ng-conf. I will sync up with everyone next week and post a status here.

[ryancampbell]

Awesome thanks @jeffwhelpley I would be interested in helping as well just don't want to duplicate work if it's already being tackled

[jeffwhelpley]

@ryancampbell I will take you up on this! Let me get back in sync with Brad on this and will reach out to you within a week or so.

[sdeleuze]

I would be very interested by an update as well since we are close to begin active work on Spring Framework 5 where we would like to experiment and potentially provide support for Angular 2 running on Nashorn.

[cheungtitus]

@sdeleuze that'd be good. @jeffwhelpley sorry I started experimenting with Spring 4's Script Based Templating a couple of months ago but haven't gotten it to work yet, and then have been occupied with multiple family events. It'd be good to indeed have us all get synced up somehow.

[manekinekko]

@sdeleuze check this my repo. We are having issues with the module loader, see more details here.

[sdeleuze]

@manekinekko Interesting, I guess we need to find the right polyfill to make it work ...

[jeffwhelpley]

I am in the process of pulling together all interested parties in the Java-Universal integration. There are a couple internal folks at Google in addition to all of you in the community that have posted here (and many more I talked to at ng-conf last week). This effort has been moving along somewhat slowly up to now, but it is time to make it legit. I think the first step will be a quick meeting of people who may be interested in contributing to this effort. If you want to simply get updates on the status, then watch this issue. If you want to be more heavily involved, email me at jeff at gethuman dot com.

[TheLarkInn]

Also interested in doing this in house, so +1

[bennylut]

j2v8 (https://github.com/eclipsesource/J2V8) just added support for linking (using jni) node.js into java applications - this may help reducing the amount of effort required for the port (instead of adapting nashorn) didn't test it myself yet though..

[irbull]

As the author of J2V8 I'll mention a few things. J2V8 is a set of Java bindings for V8. It exposes the V8 API to Java via JNI. Yesterday I finalized the support for node.js with J2V8. This means you start node itself (not just V8), execute scripts on node, and access the node message loop. You can also register Java methods to invoke when a JS Function is called, and you can call JS functions from Java. You can also get JS Objects and traverse them in Java. I haven't published binaries of the node integration yet, but I have the code to do that (I've built it on Linux and Mac, I'll try Windows next).

[TheLarkInn]

@irbull could you paste a link to the repository? Excellent work!

[TheLarkInn]

Nvm I see it above.

[ryancampbell]

Nice work!

[TheLarkInn]

Only because I don't know Java, would you be willing to boilerplate this?

[bennylut]

I will try to make a small "hello angular-universal/j2v8" prototype and post here how it goes

[jeffwhelpley]

@bennylut that would be awesome. I am trying to get everyone together interested in this topic, but it looks like a lot of the Googlers won't be available until after Google I/O which is next week. So, I will get something on the calendar for the following week and in the meantime try to document the integration spec.

[cheungtitus]

@bennylut @irbull The J2V8 is amazing. This looks really similar to handlebars.java in that we can run the JS inside Java. Also nice is the callback. Wow. I wrote a Angular2 based front end served by a Spring 4 back end with mock data a few months ago. Will try out J2V8 to see how it goes by having it rendered on the back end instead. BTW I happen to notice the POM artifacts doesn't have the Linux version listed. @sdeleuze does this mean we need to have a J2V8ViewResolver for Spring 5?

[salmar]

@bennylut sounds great. We'll have the Spring I/O conference next week in Barcelona, would be nice to show some initial work on that direction.

[sdeleuze]

@bennylut Currently I guess the answer is yes, but ideally what I would prefer is using J2V8 through JSR 223 that we support natively. As you can see in ScriptTemplateView, we use ScriptEngine#eval(), Invocable#invokeFunction(), Invocable#invokeMethod(). @irbull Do you think that could be doable in theory?

In any case, I think both Nashorn (that is now quite good in latest Java 8 builds, and continue to evolve as part of upcoming Java 9 release to support ES6) and J2V8 are interesting to support. Usually with Nashorn, the trick is to load a small polyfil before the JS library to create (like this one for React) some JS global variables.

[bennylut]

@sdeleuze I don't see why one will have a problem writing JSR223 compatibility layer for J2V8.

Here are my two cents about Nashorn:

Nashorn is a great project, it is much faster than rhino - still not close to v8 though. But even if you don't mind the performance differences on your server side - using it can cause major headache since for each change in angular-universal or one of its dependencies one will have to test and make sure that both nashorn and its polyfills are compatible with the changes and make the proper fixes if not.

[bennylut]

Hi all, The following is a very preliminary - (but working) prototype - please tell me what you think (only works on linux 64bit, tested on ubuntu 16.04)

https://github.com/bennylut/hello-angular2-universal-j2v8

[jeffwhelpley]

@bennylut awesome! I am going to look at it in more depth this weekend, but one quick thing. It looks like you used the Universal express engine. That is just a wrapper around Universal that helps with integration to Express. I actually don't think that is needed in this case. We should be able to ditch Express and just have the Java server talk directly to the Universal lib. I need to work on a spec to make this easier, but for now, you can look at how the express engine is integrated to Universal and do something similar:

https://github.com/angular/universal/blob/master/modules/express-engine/src/engine.ts

[bennylut]

@jeffwhelpley, you are looking at an old version - please checkout the latest one - I remove the expressEngine dependency and wrote a JavaEngine instead. I still use internally code from the expressEngine implementation though.

This repository is still under work, for example I recently added multi-node support, i.e., using multiple nodejs executions each in its own thread in order to improve rendering performance in a multi-threaded environment. You can look on the README for the state of the project in addition to a TODO list - please tell me if there are important TODO items that you think I should add.

[PatrickJS]

@bennylut great work! it looks good to me. We can probably merge JavaEngine into the repo

[bennylut]

@gdi2290, thanks - I actually wanted to try and see if I can remove the need for the "server.js" glue code - If I will succeed this may change the JavaEngine.render method a little. So please tell me before merging the JavaEngine code so I can freeze the API.

UPDATE The removal of server.js glue code can be done but after thinking about it for a while I realize that it will actually complicate stuff instead of making things easier, this is mainly because anyone can create new "server side" dependency (e.g., the LocalStorage server side counterpart) and this will be written in js. So a server specific js code will be written anyway only it will not have a single server.js entry point if I will remove it..

If anyone here is interested in this feature and think differently than me - please tell me.

[PatrickJS]

@bennylut I agree that we should keep server.ts. I like the idea of having server.ts and isolating the Java exposed methods within JavaEngine. There might be a better way of setting the template and other configuration from Java. Overall thanks! This is really exciting 👍

[Larisho]

What is the current status of this? I am very interested in using Universal with java

[sdeleuze]

I added my latest thoughts about Spring support for Angular Universal here. Any feedback welcome (here or in the JIRA issue).

[alexeagle]

Has there been any discussion of Universal for Java without Spring?

While Spring is a great framework choice for the server, it's not the only one. Some teams may already have an established server design, and just want to incrementally improve their app with pre-rendering. Taking a dependency on Spring adds complexity and is not strictly necessary.

[jeffwhelpley]

Yeah, here is a prototype using j2v8:

https://github.com/bennylut/hello-angular2-universal-j2v8

Note, though, that this prototype is using an older version of Universal and Angular itself. We wanted to hold off on the Java integration efforts until after Universal stabilized. Now that we have Universal working with the final release of Angular 2, we can revisit this effort. @alexeagle Brad gave me a heads up that you would be investigating this some more. Should we set up meeting with everyone and get this effort started again?

[alexeagle]

I found that yesterday and got it partway fixed with 2.0 final in my fork: https://github.com/alexeagle/hello-angular2-universal-j2v8

Yes, let's have the launch meeting and get it started again. I need to confirm when everyone is back from London if this will be my 80% work for the next few weeks.

BTW there is a related issue: users who define their data model in Java objects, then serialize to JSON. They'd like to type-check usages of this data in their TypeScript files and Angular templates. We should generate a .d.ts file for them. It's really similar to work we've done already for protobuf and clutz.

[olegkon]

Guys,

So is there a solution to connecting Angular2 and/or Angular Universal to Java Spring? I am very new to Angular Universal (but not to Java, Spring or Ang2).

(trying to rewrite front end of large web app from Flex to Angular2. It also has Spring4, Flex/BlazeDS/Spring bridge, connecting to heavy layer of SQL Server stored procs). So far I have written Ang2 prototype (skipping Java & Spring), (via HTTP/rxjs) calling from NodeJS server side SQL Server stored procs through MSSQL client for NodeJS. So far it has no security, plan to try JWS. Makes sense?

Please advise.

TIA, Oleg.

[MarkPieszak]

@aherreraGH Was also interested in looking into the integration, he recently got a Node instance stood up and interacting with a Java environment, so think he's already most of the way there. I can try to help show him the way the integration is being done in .NET, might help get things going!

Hopefully Universal in Java soon :taco: :taco:

[dherges]

Hi guys,

In theory there two-and-half things needed for that:

1) J2V8 running a node env /w node APIs on JVM 1b) some sort of Bridge from Spring MVC to a Renderer ... needs to -- provide context (e.g. request URL/Path), -- execute the main.js of an universal app, -- capture the rendering result and -- place the rendered contents in the app's index.html 2) Implementation of the universal app in TypeScript / ES* (requires special bootstrapping with dedicated providers afaik)

If there is anything missing or wrong please feel free to comment.

You can take inspiration from https://github.com/bennylut/hello-angular2-universal-j2v8 from what I can tell is that hardest part is 1b the bridge from Java server side framework to Angular Universal (I horribly failed at that step). 1 and 2 shouldn't be too hard to get started with.

Cheers, David

On 28 Feb 2017, at 02:52, Mark Pieszak notifications@github.com wrote:

@aherreraGH Was also interested in looking into the integration, he recently got a Node instance stood up in a Java environment so think he's already most of the way there. I can try to help show him the way it's being done in .NET.

Hopefully Universal in Java soon 🌮 🌮

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

[niconavent]

Hi all! I am new in angular and am doing a research about how it can be integrated with java without a restful api. Does someone know if there is an example project that use ng4 and java as a server-side rendering backend?
I tried with https://github.com/bennylut/hello-angular2-universal-j2v8 but I am suffering errors when I try to build it. Thanks in advance.

[swaechter]

Hi Nicolas. At the moment I am prototyping a solution that relies on Spring Boot and Angular 4 (Angular CLI + ngc with AOT) that uses J2V8 for rendering the page. I hope I am able to present a working prototype within the next week.

PS: But of course you should be able to use the renderer in any other framework

[niconavent]

Hi @swaechter! Thanks for your answer and good news. I am really looking forward to your news and to see your solution. Do you have any repo to see the partial solution?

[petercn]

@swaechter Any updates on your progress? Don't mean to be annoying but I'm anxiously awaiting any kind of Java-based Angular server-side rendering solution

[petercn]

Adding @alexeagle and @jeffwhelpley to see if they have any updates as well, thanks guys

[alexeagle]

I haven't been working on this lately, will sync with @vikerman who is the current owner.

[vikerman]

hi - I am current owner. The plan is to have a solution for this by end of June but haven't started on this yet. Expect the initial solution to land somewhere in github by end of May.

[petercn]

@vikerman Thank you, much appreciated :-)