当页面重新加载时,网页在 iOS 和 OSX 上在 Safari 中冻结?

Webpage freezes in Safari on both iOS and OSX when the page reloads?

我正在使用 iPhone 11 Pro 和 iOS 15.3.1。

我想弄清楚为什么在访问我的网站时,Safari 在页面加载时大部分时间都冻结。有时页面会在我第一次访问它时加载,但在重新加载时它基本上没有交互。

当我将 iPhone 连接到 Mac 并使用 Safari 检查器连接到 iPhone 上的网页时,检查器在所有屏幕上基本上都是空白的。如果我转到“元素”选项卡,则什么也没有显示。如果我转到“控制台”选项卡并尝试执行一些 Javascript,当我按 enter 时没有任何反应。

在 OSX 上,我可以看到类似的行为,只是我实际上可以在访问页面之前打开检查器。在这种情况下,当它冻结时,我可以在“元素”选项卡中看到一些元素,仅​​此而已。我尝试在检查器中进行的任何类型的交互都没有任何反应。

我有点不知所措。如此受欢迎的 OS/Browser 的开发体验怎么会如此糟糕,我该如何解决检查器本身不起作用的问题?除了 Safari,我无法在任何其他设备上复制这种冻结。

要绝对清楚我的问题:

在检查器不再与网页交互的状态下,您在 Safari 中调试网页的流程是什么?

我对我的应用程序进行了广泛的分而治之,注释掉顶级代码并逐步取消注释,直到找到导致冻结的确切行。

似乎在 onfocus 事件处理函数中调用 HTMLInputElement.setSelectionRange() 导致 Safari 中出现无限同步循环,也许 Safari 在调用该函数时会同步模糊输入并出于某种原因重新聚焦。在页面重新加载时,Safari 试图自动专注于使用该代码的输入。至少这是我的猜测,删除 setSelectionRange() 解决了冻结问题。

幸运的是,冻结是相当一致的,所以分而治之的方法奏效了。不幸的是,检查员真的应该完成它的工作并发现页面挂起的事实并告诉我当 Javascript 被迫停止时哪个函数代码执行中断,例如 Chrome 或 Firefox 会.

除了短路测试的编程等价物之外,如果有人对在 Safari 中调试此类问题有更好的想法,我将很乐意接受答案。