英文:
Why is a React + Three/Threejs application more sluggish when deployed/in production compared to when it's running on localhost
问题
抱歉,没有提供一个示例,但是:我有一个使用Three.js的React应用程序,在我的部署站点上,与在本地开发期间运行时相比,缩放功能要差得多。它部署在https://svo.utenforuio.no上,但请注意,这是一个可能会时不时出错的测试部署。
它不应该是相同的代码吗,只是被压缩了吗?我已经搜索了很多方法,但没有答案...
我正在开发一个使用后端数据在地球上显示太阳观测的Three.js + MobX + Three.js应用程序。
英文:
Sorry, don't have a fiddle, but: I have a React application with Three.js where the zoom functionality is much poorer on my deployed site compared to when it's running on localhost during development. It's deployed on https://svo.utenforuio.no, but note that this is a test deployment which might be buggy at times.
Isn't it supposed to be the same code, just minified? I've googled a million ways, but no answer...
I'm developing a threejs + mobx + threejs application showing Solar observations on a globe using data from a backend.
答案1
得分: 0
你是在使用Next.js还是Remix?如果你在服务器上渲染React,可能是因为你的计算机规格比你部署到的服务器好。
英文:
Are you using Nextjs or Remix? If you're rendering React on the server, it might just be that your computer has better specs than the server you're deploying to
答案2
得分: 0
找到了!package.json文件中的"browserslist"设置在开发和生产环境下是不同的,因此生产部署生成的代码比在开发(本地主机)环境中使用的代码效率低。
调整"browserslist"设置(并使它们相同)解决了我的问题:
"browserslist": {
"production": [
">0.5% and not dead, last 5 chrome versions, last 5 firefox versions, last 5 safari versions, last 5 edge versions"
],
"development": [
">0.5% and not dead, last 5 chrome versions, last 5 firefox versions, last 5 safari versions, last 5 edge versions"
]
}
英文:
Found it! The "browserslist" settings in package.json were different for development vs production, so the production deployment was crating more inefficient code than what was used in the development (localhost) situation.
Tuning the browserslist settings (and making them identical) solved my problem:
"browserslist": {
"production": [
">0.5% and not dead, last 5 chrome versions, last 5 firefox versions, last 5 safari versions, last 5 edge versions"
],
"development": [
">0.5% and not dead, last 5 chrome versions, last 5 firefox versions, last 5 safari versions, last 5 edge versions"
]
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论