我正在使用 React 构建一个渐进式 Web 应用程序，其概念围绕着保持计时器运行。
For context, the app is for home-brewers to keep track of when hops and other additions need to be added to their boil during their brew. Additions are added with a certain amount of time remaining in the boil, i.e. 1 oz Citra hops at 20 minutes remaining.
我使用 JavaScript 的 setInterval 来“勾选”计时器，这是一个驱动应用程序其余部分的 elapsedSeconds 状态属性。
我遇到的问题是计时器停止计时。如果我让应用程序运行，屏幕最终将锁定，或者我将切换应用程序等。服务工作人员将继续运行，并且计时器将继续滴答作响，时间很短(据我所知大约 10 分钟)正在测试中？)
我的想法是，我将在状态中存储一个纪元时间，它代表计时器启动的时间。这样，当用户“返回”PWA 时，我可以将当前纪元时间与存储的 startingEpochTime 进行比较，以获取 elapsedSeconds。但如果不需要的话，我不想在每次“滴答”时都进行这种比较。理想情况下，只有当用户从其他上下文返回应用程序且服务工作线程已经停止处理时，才会运行此比较。
我正在寻找的是执行此操作的正确方法。 window.onload 在这种情况下可以工作吗？如果我将应用程序切换到另一个应用程序 20 分钟，然后切换回我的计时器应用程序，该方法是否会再次运行？寻找此类场景的最佳实践，或任何可能对我有帮助的想法。
最佳答案
截至 2022 年，当 PWA 移至后台时，无法安排任务或保持计时器运行。
对于所有想要此功能的人，请在 Google 问题上加注星标并发表评论，要求其采取行动:https://bugs.chromium.org/p/chromium/issues/detail?id=889077
关于javascript - 在 PWA 中保持计时器运行的最佳实践，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58244539/