search

slaylines / harp.gl-react-example

Example of React app with harp.gl.
https://www.harp.gl
Apache License 2.0
11 stars 3 forks source link

Significant performance drop when using built app #6

Closed harrycollin closed 3 years ago

harrycollin commented 4 years ago

I've noticed after building the app there are huge performance problems. I initially noticed this on my own app but came back here as I used this as an initial reference a long time ago. It appears to have happened since upgrading from harp 0.14.0. What do you think is going wrong?

nzjony commented 4 years ago

I can reproduce this when running yarn build and serving the directory.

mkalygin commented 4 years ago

@harrycollin do you think it's related to React in any way? Do you experience slow build times using harp.gl without React?

harrycollin commented 4 years ago

@mkalygin I believe it's related this . The guys at Here think it's because react-scripts transpiles to es5. Check here. As for using harp.gl without react it appears to be fine, the bottleneck appears to be with compilation.

mkalygin commented 3 years ago

@harrycollin ok, this makes sense. Does the browserlist fix help? If so, I think I can include it in this example repo to fix the build performance issue.

harrycollin commented 3 years ago

@harrycollin I've only done an initial test and it does appear to work. Hopefully this is the solution!

mkalygin commented 3 years ago

Ok, I'm specifically linking the solution here for future reference.

mkalygin commented 3 years ago

@harrycollin that's weird. I already have this in the package.json. It doesn't look like it works. Does it?

robertoraggi commented 3 years ago

@mkalygin is your app using create-react-app or babel to transpile the code? if this is the case try to add the following snippet to the package.json of your app

  "browserslist": {
    "production": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
harrycollin commented 3 years ago

@mkalygin I used this exact snippet and it worked much better.

mkalygin commented 3 years ago

Ok, thanks @harrycollin @robertoraggi. I've fixed package.json in https://github.com/slaylines/harp.gl-react-example/commit/6dbdf5a84d2439be499f1a5e32478124f9cbc4f4. I'm closing this issue. Let me know if I can help in any way.