我在这里有点困惑。当我调试 React Native 应用程序时,我通常同时启用热重载和实时重载。我想知道它们之间有什么区别?
文件更改时,实时重新加载会重新加载或刷新整个应用程序。例如,如果您在导航中有四个链接并保存了更改,则实时重新加载将重新启动应用程序并将应用程序加载回初始路线。
热重载只会刷新已更改的文件,而不会丢失应用程序的状态。例如,如果您在导航中有四个链接并保存了对某些样式的更改,则状态不会更改,但新样式将出现在页面上,而无需导航回您所在的页面,因为您仍然会在同一页上。
两者都可以使用 CMD+D / CMD+CTRL+Z / Shake Gesture menu
启用。两者都使用 watchman 来监听文件的变化。
实时重新加载会重新加载整个应用程序。
热重载背后的想法是保持应用程序运行并注入您在运行时编辑的文件的新版本。这样,您就不会丢失任何状态,这在您调整 UI 时特别有用。所以它只重新加载您更改更多信息的页面here
Hot Reload:
热重载用于仅刷新代码更改的文件
Live Reload:
Live Reload 用于刷新整个应用程序,它不关心文件更改来自哪个。
两者的区别在于,Live Reloading 会重新加载你的整个应用程序。就像,好吧,文件改变了,重新加载整个应用程序。热重新加载不会重新加载您的整个应用程序。它只是修补已更改的代码并将状态保留在您的应用程序中。
在开发 React-Native 应用程序时,您需要查看代码更改,而要查看代码更改,React-Native 中有两个选项。
注意: 这两个(热重载和实时重载)功能在 0.62 版本的 react-native 中合并为 fast refresh
,如果您使用的是低于此的版本,那么这两个(热重载和实时重载) ) 将可用。
您可以探索此问题以获取有关快速刷新和热重载的更多信息Difference between hot reload and fast refresh in react-native
1. 热重载
热重载只是根据新的代码更改显示代码更改,而无需从头开始重新启动应用程序,其影响仅对更改的代码或更改仅适用于特定组件。
注意:如果您深入导航,热重载有时将不起作用。
2.实时重新加载
有时我们可能需要 Live Reload 来测试我们的代码,比如导航,所以 Live reload 在这种情况下很有帮助,所以它会在代码更改时重新加载整个应用程序。
热重载只是根据新的代码更改显示代码更改,而不需要从头重新启动应用程序,它只影响更改的代码。但是在添加/更改 JS 代码时仅对组件进行样式设置会产生问题。对于 Live reload 或 rr 效果很好
Hot Reload:Hot Reload 仅用于刷新代码更改的文件 Live Reload:Live Reload 用于刷新整个应用程序。