{"action":"created","issue":{"url":"https://api.github.com/repos/jhipster/generator-jhipster/issues/7864","repository_url":"https://api.github.com/repos/jhipster/generator-jhipster","labels_url":"https://api.github.com/repos/jhipster/generator-jhipster/issues/7864/labels{/name}","comments_url":"https://api.github.com/repos/jhipster/generator-jhipster/issues/7864/comments","events_url":"https://api.github.com/repos/jhipster/generator-jhipster/issues/7864/events","html_url":"https://github.com/jhipster/generator-jhipster/issues/7864","id":335801255,"node_id":"MDU6SXNzdWUzMzU4MDEyNTU=","number":7864,"title":"React slow to load in production","user":{"login":"mraible","id":17892,"node_id":"MDQ6VXNlcjE3ODky","avatar_url":"https://avatars3.githubusercontent.com/u/17892?v=4","gravatar_id":"","url":"https://api.github.com/users/mraible","html_url":"https://github.com/mraible","followers_url":"https://api.github.com/users/mraible/followers","following_url":"https://api.github.com/users/mraible/following{/other_user}","gists_url":"https://api.github.com/users/mraible/gists{/gist_id}","starred_url":"https://api.github.com/users/mraible/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mraible/subscriptions","organizations_url":"https://api.github.com/users/mraible/orgs","repos_url":"https://api.github.com/users/mraible/repos","events_url":"https://api.github.com/users/mraible/events{/privacy}","received_events_url":"https://api.github.com/users/mraible/received_events","type":"User","site_admin":false},"labels":[{"id":641492557,"node_id":"MDU6TGFiZWw2NDE0OTI1NTc=","url":"https://api.github.com/repos/jhipster/generator-jhipster/labels/React","name":"React","color":"bfdadc","default":false},{"id":780119360,"node_id":"MDU6TGFiZWw3ODAxMTkzNjA=","url":"https://api.github.com/repos/jhipster/generator-jhipster/labels/v5","name":"v5","color":"2de583","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":9,"created_at":"2018-06-26T12:42:36Z","updated_at":"2018-06-28T06:58:13Z","closed_at":null,"author_association":"CONTRIBUTOR","body":"##### **Overview of the issue**\r\n\r\nI created an example app, blog post, and screencast about how to develop a Photo Gallery PWA with React and JHipster.\r\n\r\nBlog: https://developer.okta.com/blog/2018/06/25/react-spring-boot-photo-gallery-pwa\r\nScreencast: https://youtu.be/GlJWUqy1SJM\r\nSource: https://github.com/oktadeveloper/okta-react-photo-gallery-example\r\nHeroku: https://gallery-pwa.herokuapp.com/\r\n\r\nYou can see from the screencast and Heroku that i18n translations are slow to load and performance is poor. If I run Lighthouse on Heroku (after it wakes from sleeping), it scores a 39 for performance.\r\n\r\n<img width=\"1396\" alt=\"screen shot 2018-06-26 at 6 28 50 am\" src=\"https://user-images.githubusercontent.com/17892/41911678-8bd823ce-790a-11e8-8185-6f2431309984.png\">\r\n\r\n##### **Motivation for or Use Case**\r\n\r\nI think we can do better.\r\n\r\n##### **Reproduce the error**\r\n\r\nCreate a React app with JHipster 5, deploy it to Heroku, test it with Lighthouse.\r\n\r\n##### **JHipster Version(s)**\r\n\r\n```\r\ngallery@0.0.0 /Users/mraible/dev/okta/okta-react-photo-gallery-example\r\n└── (empty)\r\n\r\n```\r\n\r\n\r\n##### **JHipster configuration, a `.yo-rc.json` file generated in the root folder**\r\n\r\n\r\n<details>\r\n<summary>.yo-rc.json file</summary>\r\n<pre>\r\n{\r\n  \"generator-jhipster\": {\r\n    \"promptValues\": {\r\n      \"packageName\": \"com.okta.developer\",\r\n      \"nativeLanguage\": \"en\"\r\n    },\r\n    \"jhipsterVersion\": \"5.0.1\",\r\n    \"applicationType\": \"monolith\",\r\n    \"baseName\": \"gallery\",\r\n    \"packageName\": \"com.okta.developer\",\r\n    \"packageFolder\": \"com/okta/developer\",\r\n    \"serverPort\": \"8080\",\r\n    \"authenticationType\": \"oauth2\",\r\n    \"cacheProvider\": \"ehcache\",\r\n    \"enableHibernateCache\": true,\r\n    \"websocket\": false,\r\n    \"databaseType\": \"sql\",\r\n    \"devDatabaseType\": \"h2Disk\",\r\n    \"prodDatabaseType\": \"postgresql\",\r\n    \"searchEngine\": false,\r\n    \"messageBroker\": false,\r\n    \"serviceDiscoveryType\": false,\r\n    \"buildTool\": \"maven\",\r\n    \"enableSwaggerCodegen\": false,\r\n    \"clientFramework\": \"react\",\r\n    \"useSass\": false,\r\n    \"clientPackageManager\": \"yarn\",\r\n    \"testFrameworks\": [\r\n      \"protractor\"\r\n    ],\r\n    \"jhiPrefix\": \"jhi\",\r\n    \"enableTranslation\": true,\r\n    \"nativeLanguage\": \"en\",\r\n    \"languages\": [\r\n      \"en\",\r\n      \"fr\"\r\n    ],\r\n    \"herokuDeployType\": \"git\",\r\n    \"herokuAppName\": \"gallery-pwa\"\r\n  }\r\n}\r\n</pre>\r\n</details>\r\n\r\n\r\n##### **JDL for the Entity configuration(s) `entityName.json` files generated in the `.jhipster` directory**\r\n\r\n<details>\r\n<summary>JDL entity definitions</summary>\r\n\r\n<pre>\r\nentity Album (album) {\r\n  title String required,\r\n  description TextBlob,\r\n  created Instant\r\n}\r\nentity Photo (photo) {\r\n  title String required,\r\n  description TextBlob,\r\n  image ImageBlob required,\r\n  height Integer,\r\n  width Integer,\r\n  taken Instant,\r\n  uploaded Instant\r\n}\r\nentity Tag (tag) {\r\n  name String required minlength(2)\r\n}\r\nrelationship ManyToOne {\r\n  Album{user(login)} to User,\r\n  Photo{album(title)} to Album\r\n}\r\nrelationship ManyToMany {\r\n  Photo{tag(name)} to Tag{photo}\r\n}\r\n\r\npaginate Album with pagination\r\npaginate Photo, Tag with infinite-scroll\r\n\r\n</pre>\r\n</details>\r\n\r\n\r\n##### **Environment and Tools**\r\n\r\njava version \"1.8.0_144\"\r\nJava(TM) SE Runtime Environment (build 1.8.0_144-b01)\r\nJava HotSpot(TM) 64-Bit Server VM (build 25.144-b01, mixed mode)\r\n\r\ngit version 2.14.1\r\n\r\nnode: v9.8.0\r\n\r\nnpm: 6.1.0\r\n\r\nyeoman: 2.0.2\r\n\r\nyarn: 1.7.0\r\n\r\nDocker version 18.03.1-ce, build 9ee9f40\r\n\r\ndocker-compose version 1.21.1, build 5a3f1a3\r\n\r\n**Related:** `jhipster info` seems to work for getting the version on Linux, but not on Mac. Notice that it says (empty) for the JHipster version."},"comment":{"url":"https://api.github.com/repos/jhipster/generator-jhipster/issues/comments/400932578","html_url":"https://github.com/jhipster/generator-jhipster/issues/7864#issuecomment-400932578","issue_url":"https://api.github.com/repos/jhipster/generator-jhipster/issues/7864","id":400932578,"node_id":"MDEyOklzc3VlQ29tbWVudDQwMDkzMjU3OA==","user":{"login":"atomfrede","id":203401,"node_id":"MDQ6VXNlcjIwMzQwMQ==","avatar_url":"https://avatars2.githubusercontent.com/u/203401?v=4","gravatar_id":"","url":"https://api.github.com/users/atomfrede","html_url":"https://github.com/atomfrede","followers_url":"https://api.github.com/users/atomfrede/followers","following_url":"https://api.github.com/users/atomfrede/following{/other_user}","gists_url":"https://api.github.com/users/atomfrede/gists{/gist_id}","starred_url":"https://api.github.com/users/atomfrede/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/atomfrede/subscriptions","organizations_url":"https://api.github.com/users/atomfrede/orgs","repos_url":"https://api.github.com/users/atomfrede/repos","events_url":"https://api.github.com/users/atomfrede/events{/privacy}","received_events_url":"https://api.github.com/users/atomfrede/received_events","type":"User","site_admin":false},"created_at":"2018-06-28T06:58:13Z","updated_at":"2018-06-28T06:58:13Z","author_association":"MEMBER","body":"Regarding font awesome I will try to update to the latest version later. According to https://github.com/FortAwesome/react-fontawesome/issues/70#issuecomment-399874742 the treeshaking problems should be resolved, which will reduce the bundle size a lo I guess. \r\n\r\nWhen it comes to lodash there is some 3rd party lib that depends on lodash (maybe it is even jhipster-react). I tried lodash-es and that seems to work fine with regards to treeshaking and imports. "}}
{"actor":{"display_login":"atomfrede"}}