Enable Angular Universal with a PHP backend

[jeffwhelpley]

This should be possible, but a lot more time needed to experiment and create a proof of concept.

[tbosch]

I have a design for this already. See https://docs.google.com/document/d/1a3LDFEi6xV9vNNZxjoRwIw-Z3pgj_HAZXCJe8-gkAeA/edit

On Tue, Feb 23, 2016 at 5:58 PM Jeff Whelpley notifications@github.com wrote:

This should be possible, but a lot more time needed to experiment and create a proof of concept.

— Reply to this email directly or view it on GitHub https://github.com/angular/universal/issues/281.

[jeffwhelpley]

Sweet! Thanks for the link.

[b-strauss]

Hi, I would like to take a look at this. My idea is to write a PHP extension, that uses PHP-CPP to embed JXcore. JXcore is a node.js fork, unfortunately from an older branch (v0.10.40), but it claims to be easily embeddable. Is angular using any features that are incompatible with this node version? I'm no c++ expert, and I have no idea when I will have some first results and how the performance would be, but the possible simplicity of just adding a file to your php extension folder seems worth a try. If nothing speaks against it I will start working on it. The result would probably be usable with any javascript code, not only angular.

[jeffwhelpley]

@manekinekko I thought I remembered you saying there is another approach for PHP integration than the one @b-strauss is suggesting, right?

[jeffwhelpley]

But, FYI, @b-strauss it is not that ideal being on that old a version of node. v0.10.x is pretty stable so it may work, but we should check to see if there are other options if possible.

[manekinekko]

@jeffwhelpley I was referring to https://github.com/phpv8/v8js

@b-strauss I am afraid v0.10.x is not compatible with the build system of Angular2 but I may be wrong. I just run the Universal starter with node v0.10.42 I everything just blew up. See screenshots.

Beside the version of NPM shipped with Node v0.10.42 seems to be deprecated.

If we can get the latest version of Node running with JXCore, that would be an interesting solution to explore.

[b-strauss]

@manekinekko It looks like they are working on Node v4 integration. https://github.com/jxcore/jxcore/issues/535

Maybe node.js can directly be compiled into a library? Seems like atom does this. See: https://github.com/nodejs/node/issues/2953

[b-strauss]

I just realized the PHP-CPP people have also written a PHP-JS bridge.

http://www.php-javascript.com/

[manekinekko]

@b-strauss thanks for your feedbacks and researches. Good find for php-js, it looks like Nashorn for Java 8. Funny ^^

IMHO, I think we shouldn't be focusing on writing a nodejs/v8 wrapper for PHP. We should use whatever the industry is using. We could however provide an extension for PHP that acts like a bridge for Angular2 Universal (that's the big picture). So, to me, we would explore the following solutions:

1. v8js
2. jxcore (node v4+)
3. php-javascript

Remember that we want the developer to just drop the Universal deps into her/his projects and things would work automagically. That'd be the ideal solution.

@jeffwhelpley @tbosch your thoughts?

[jeffwhelpley]

I have no strong opinions on this as long as the implementation fits into the common standards we put in place. I don't have a ton of experience with PHP so likely we need someone to take the lead on this.

[b-strauss]

I was just able to render a simple "hello world" from a js file to the php output with v8js and its pre-built binaries for windows.

The server response time was between 90 and 140 milliseconds on my windows dell laptop. A simple php "hello world" takes about 5 to 15 milliseconds on my machine. I don't think this would be a problem if one caches the generated output on the php side.

I will take some time to write a few php and js helper classes in the next days to send data between the two and handle module path resolution.

Can someone point me to a universal example app that I could use to test this?

[jeffwhelpley]

Alright, so the PHP integration to Universal has been a back burner item for a little while but let's work on making this legit. If you just want status updates on this effort, watch this issue. If you can be more heavily involved, email me at jeff at gethuman dot com. I am in the process of organizing a quick meeting among all interested parties.

[mrjmd]

@jeffwhelpley I have been doing a little bit of work on this already and it was discussed a fair amount at ngconf a couple of weeks ago. Dropping you an email.

[TheLarkInn]

@mrjmd is that angular2-drupal repo implementing universal? I have a few devs on my team that are interested in contributing.

[TheLarkInn]

Ive found that with V8js you have to define your own module loading system in PHP. I reached out to them and was directed to this gist (if this helps anyone).

https://gist.github.com/stesie/c9143b98355295420470#file-example-php-L12

[john-landgrave]

I see this was last touched 7 months ago, is this being handled somewhere else (like its own repo)?

[jeffwhelpley]

@john-landgrave the prototype was built in a private repo. Much of the universal code is moving to core now, so this effort has been put on hold until that is complete.

[b-strauss]

@john-landgrave

I experimented with v8js, which is a PHP extension that includes the v8 engine. I was able to render a simple hello world string sent from js to php (90 to 140 ms response time). This basically works, although it was slower than a native php string (5 to 15 ms response time). v8js requires a custom module loader implemented via callbacks on the PHP side. I did not go so far as to implement that.

Other tools were investigated, but led nowhere.

[john-landgrave]

@jeffwhelpley and @b-strauss

Thanks for the responses guys! We're very interested in starting some work on using Angular 2+ as the basis for some WordPress themes in order to step up our offerings, but obviously the SEO impact of Angular Universal is a pretty big necessity. I'll keep an eye on news around Angular Universal and PHP.

[maximumver]

yeah, 26% of web is powered by wordpress, not even saying that PHP is realy popular too, we need Angular Universal on PHP very badly.

[drarko]

Any updates on this? Can I help with something? I have experience with PHP and its modules. I will glad to participate on this project :)

[bonatoc]

... so do I. But we need a roadmap, and a short desc of what is available, what needs to be done. Who can provide this info? Where can we start?

[killrazor]

"@jeffwhelpley jeffwhelpley commented 11 months ago

Alright, so the PHP integration to Universal has been a back burner item for a little while but let's work on making this legit. If you just want status updates on this effort, watch this issue. If you can be more heavily involved, email me at jeff at gethuman dot com. I am in the process of organizing a quick meeting among all interested parties"

[mrjmd]

This effort never really got off the ground. We had one Google hangout after ngconf last year but I think the key need was someone to champion this issue, and no one really stepped up to do that.

Here's my blog post about my initial attempts at a v8js hello world from last year:

http://mrjmd.com/angular-universal-and-php-first-adventures-v8js

I think part of what I've struggled with is the specific use case for this. Since from a cursory investigation the level of effort does not appear to be low, in my mind the use case needs to be broad / important enough to justify that effort. I'm not entirely convinced it is.

If you already have a PHP CMS like WordPress or Drupal rendering part of the page server side, can't you move your SEO concerns into the CMS? And if you're building a full headless / decoupled Angular app with a PHP API for your data store, you can use Universal without issue, correct?

All that said, ngconf is next week and if people in this thread will be there and think this is an important issue to move forward I'd be interested in being involved in further discussion about it.

[jeffwhelpley]

Greetings! Sorry for the lack of updates. The effort did indeed get derailed because shortly after ng-conf we decided that a major refactoring was needed before we opened Universal up to non-JS back ends. That refactoring took much longer than expected for a variety of reasons, but is now complete with the release of Angular v4. As you can see from this:

https://github.com/angular/universal#roadmap

We are back on the road toward integration with non-JS back ends starting with Java. PHP is on the list for Angular 5.0+, but the key thing to look out for is the Java integration because the approach being taken is one where we will have what is hopefully a generic integration for any type of back end. Once that is complete (ideally with v 4.1+), we can fire the PHP effort back up to try to build the PHP interface on top of that generic integration.

@vikerman pls correct anything I said that is invalid and add your 2 cents.

[vikerman]

We are focusing on getting the Java backend going for the next 3 months - but if someone in the community is willing to step up we can definitely work out a similar solution for PHP in parallel.

The easiest way to get this going at this point is to have a PHP<->Node.JS bridge. This is the model ASP.NET has been using. Difficulties with using just V8 - Even if we have some bundling solution to avoid module loading issues, trying to get an Angular application on vanilla V8 and having the right polyfills for node event loop and getting all these to work with Zone.js will be challenging.

[mrjmd]

@jeffwhelpley Thanks for the update! @vikerman I am interested in being involved, it would definitely help for me to follow along with the Java integration work as it happens so I have a better sense of what will be involved.

[royboy789]

@jeffwhelpley thanks! Would love to get involved in this and showcase it in some upcoming projects.

[jeffwhelpley]

@royboy789 it was great meeting you at ng-conf. Here is info about a previous attempt:

http://mrjmd.com/angular-universal-and-php-first-adventures-v8js

(removed incorrect assumption about v8js)

[killrazor]

If I'm reading this correctly you are saying a server would need node.js and PHP running in production and have V8Js installed, correct?

[b-strauss]

@jeffwhelpley @killrazor

v8js has no nodejs runtime, it only includes V8. If you want to do anything on the javascript side (loading modules, http-requests, etc), you have to do that on the php side and send it to v8js.

[mrjmd]

@killrazor I am wondering the same thing. My understanding was that one of the primary use cases for going this route was the ability to run Universal in scenarios where you would not have nodejs in production.

But from my read of @vikerman's comment above it sounds like the difficulties of going down the pure V8 road may not be worth the effort, even with the module loading example @TheLarkInn linked.

[jeffwhelpley]

Sorry, I updated my comment. I made an incorrect assumption about how v8js works. It looks like it does actually work in the same process without spinning up a node server. My main point, though, was that the tricky part is coming up with the protocol. You can check out the .NET implementation to get a sense of the types of things that are needed:

https://github.com/aspnet/JavaScriptServices

[b-strauss]

I'm experimenting with socket connections (https://github.com/b-strauss/php-node-bridge). Unfortunately the response time is 2.33 seconds. 😐

[jeffwhelpley]

That doesn't sound right. A basic node.js API server call should respond in like 10ms. Where is that time coming from?

[b-strauss]

The problem doesn't seem to be the socket request. The problem is the \ElephantIO\Client initialization at https://github.com/b-strauss/php-node-bridge/blob/master/node-bridge/src/Client.php#L26. Unfortunately ElephantIO is not being developed any more, and I could not find any other library working with socket.io. Maybe someone could checkout the repo and test it on their machine?

[fxck]

Any updates on this?

[thorsten]

I would like to help.

[manekinekko]

@vikerman @MarkPieszak do we have any update on this?

[kenji-1996]

As someone who is using traditional hosting and wanting to know the best way to go about designing an application using angular but maintaining SEO and things I was wondering if something like this would be the solution (when/if it eventually gets done) or is there some other direction i should persue for this outcome?

[fxck]

If you care mainly about seo, use prerender.io or any other similar service, just like you would with angularjs.

[angelfraga]

https://angular.io/features 'section speed & performance' subsection 'universal':

Serve the first view of your application on node.js, .NET, PHP, and other servers for near-instant rendering in just HTML and CSS. Also paves the way for sites that optimize for SEO.

But PHP it is not implemented yet in spite of the mostly web sites are build on PHP. 🤔

Third party services aren't the solution. Are there another ideas in progress?

[bonatoc]

From this page :

V8Js is a project that allows you to install the V8 JavaScript runtime within a PHP environment and create such a sandbox. But until Vue version 2.5.0, this was still not adequate as Vue SSR required certain Node.js APIs to run correctly. The recent update has made sure the server renderer is now “environment agnostic” and can therefore be run in Node.js, V8Js, Nashorn etc.

I guess the way it is approached here should work for Angular (and Laravel). It's mainly webpack processing and building.

[krazygit]

Any news ?

[NgYueHong]

This should be Angular 6 main priority feature to develop.

[VladSuciu76]

Any news?

[vsimeonoff]

It will be very nice feature if we have Angular Universal working with PHP.

[sraja415]

Has anyone tried using any of the solutions below with any success?

https://www.npmjs.com/package/node-php

https://github.com/niutech/node.php/blob/master/README.md

https://entwickler.de/webandphp/integrating-node-js-with-php-125830.html

https://stackoverflow.com/questions/32519147/nodejs-php-and-express

https://www.npmjs.com/package/php-express

https://www.npmjs.com/package/express-php

https://github.com/alangecker/express-php

https://stackoverflow.com/questions/6836842/nodejs-expressjs-serving-php-files

https://stackoverflow.com/questions/32519147/nodejs-php-and-express

[wikycheng]

Any news for Angular server rendering with PHP?

[eddieedease]

Angular Univeral is written to work with a node.js back-end. So, when we want a php universal variant it needs to come from an 'adapter' library for PHP of nodejs. Just saying this because I get the feeling some people expect an PHP-backend only version. (So skipping nodejs entirely). I could be wrong but I think that's another beast all together. If it is for SEO reasons, maybe look for other solutions?