RE: 7.0 CE: npm-angular-portlet deployment much slower than mvc-portlet

thumbnail
Fernando Fernandez, modified 6 Years ago. Expert Posts: 401 Join Date: 8/22/07 Recent Posts

Hi all,

One of angular's strengths is how fast you can test any change on any file on a project. You just save the file and ng serve will even refresh the browser for you, within one second.

But with angular portlets it's not the same.  Just like other portlets, gradle has to build & deploy and OSGi has to stop and restart the module.

With "normal" mvc portlets, my machine deploys a small portlet in 2-3 seconds.  But with an angular portlet, it takes about 15 seconds to deploy. 

Is there any way around this, to speed up the deployment process of angular portlets (possibly other types too) ? 

TIA

Fernando

thumbnail
Ivan Zaera, modified 6 Years ago. Regular Member Posts: 119 Join Date: 10/1/13 Recent Posts

Unfortunately it's not an easy to fix problem. As you said, even if the portlet was built in 0 seconds you would still need to pack the JAR file, deploy it, and wait for OSGi to restart it :-(.

However, I think there's a watch functionality (in gradle or blade, I don't know the full details) that should make it faster, because the JAR file is installed exploded and thus, you don't need to pack it or reload the module, just tell OSGi about new changes.

And to finish with, we are working in a new functionality (for 7.1+) that allows you to develop pure Javascript portlets that can be deployed to Liferay but also run standalone while developing (by means of webpack-dev-server). See this -> https://github.com/liferay/liferay-npm-build-tools/wiki/How-to-use-generator-liferay-bundle.

Cheers,

Ivan

thumbnail
Fernando Fernandez, modified 6 Years ago. Expert Posts: 401 Join Date: 8/22/07 Recent Posts

Thanks for the confirmation, Ivan.

However, the jar+deploy seems to be reasonably fast, as the  "normal mvc" portlets show, when the new version is deployed in 2-3 seconds. My doubt is: if  the jar-building-and-deploying takes a couple of seconds, and if angular by itself takes less than a second to compile, what is the gradle task doing during the extra 10+ seconds? 

My  "jar" task output is like this:

Working Directory: C:\opt\eclipse-photon\photon-default-workspace\liferay-photon-default-workspace\modules\angled
Gradle User Home: C:\Users\xxxxx\.gradle
Gradle Distribution: Gradle wrapper from target build
Gradle Version: 3.0
Java Home: C:\Program Files\Java\jdk1.8.0_181
JVM Arguments: None
Program Arguments: None
Build Scans Enabled: false
Offline Mode Enabled: false
Gradle Tasks: jar

:modules:angled:compileJava UP-TO-DATE
:modules:angled:buildCSS UP-TO-DATE
:modules:angled:processResources
:downloadNode SKIPPED
:modules:angled:downloadNode SKIPPED
:modules:angled:expandJSCompileDependencies UP-TO-DATE
:modules:angled:npmInstall UP-TO-DATE
:modules:angled:npmRunBuild

> angled@1.0.0 build C:\opt\eclipse-photon\photon-default-workspace\liferay-photon-default-workspace\modules\angled
> tsc && babel --source-maps -d build/resources/main/META-INF/resources src/main/resources/META-INF/resources && liferay-npm-bundler

src\main\resources\META-INF\resources\js\angular-loader.js -> build\resources\main\META-INF\resources\js\angular-loader.js
src\main\resources\META-INF\resources\js\app\app.component.js -> build\resources\main\META-INF\resources\js\app\app.component.js
src\main\resources\META-INF\resources\js\app\app.module.js -> build\resources\main\META-INF\resources\js\app\app.module.js
src\main\resources\META-INF\resources\js\app\dynamic.loader.js -> build\resources\main\META-INF\resources\js\app\dynamic.loader.js
src\main\resources\META-INF\resources\js\main.js -> build\resources\main\META-INF\resources\js\main.js
Bundling 28 dependencies...
Bundling took 9ms
:modules:angled:replaceSoyTranslation UP-TO-DATE
:modules:angled:wrapSoyAlloyTemplate SKIPPED
:modules:angled:classes
:modules:angled:jar

BUILD SUCCESSFUL

Total time: 17.583 secs

 

Might there be a way of reducing this?

TIA

Fernando

thumbnail
Minhchau Dang, modified 6 Years ago. Liferay Master Posts: 598 Join Date: 10/22/07 Recent Posts

I don't know if it works with Angular portlets, but have you tried using liferay-osgi-watch? It relies on the idea that it can execute a few OSGi commands to make OSGi look at an exploded folder rather than a .jar, so if your plugin works with it, it will speed up development of anything that's heavy on Javascript and light on Java.

thumbnail
Fernando Fernandez, modified 6 Years ago. Expert Posts: 401 Join Date: 8/22/07 Recent Posts

Thanks Minhchau, I'll look into it. It seems that the solution might be to avoid depending on the IDE to detect changes and deploy.

BTW, I have another problem now, with the normal usage of the IDE: as soon as I open the app.component.ts file in eclipse, the IDE starts deploying the project over and over without changing it. If I make a small change on the file and save it it will come online eventually during this loop but it will continue to deploy over and over. This is very strange... :-/ 

I have updated both the Liferay Workspace and blade a couple of days ago (expecting the generation of an angular 6 portlet, witch did not occur, BTW).

 Any ideas?

 

TIA

Fernando

thumbnail
Minhchau Dang, modified 6 Years ago. Liferay Master Posts: 598 Join Date: 10/22/07 Recent Posts
Fernando Fernandez:

BTW, I have another problem now, with the normal usage of the IDE: as soon as I open the app.component.ts file in eclipse, the IDE starts deploying the project over and over without changing it.

That's a question for the Liferay IDE forums, or the #ide channel on Slack.

thumbnail
Fernando Fernandez, modified 6 Years ago. Expert Posts: 401 Join Date: 8/22/07 Recent Posts
Minhchau Dang:
 

That's a question for the Liferay IDE forums, or the #ide channel on Slack.


Thanks Minhchau.