javascript - iOS 9 safari webkit 仅在 iPad 上崩溃(iPhone 工作正常)
<p><p>我有一个使用 python/django 后端的网络应用程序，并在前端使用了大量的 CSS3 动画和大量的 javascript。这个问题让我有点抓狂，所以我只是想看看是否有人对此有任何想法。</p>
<p>该站点在运行 iOS 9.2 的 iPad mini 上使 webkit 崩溃。 safari 和 chrome 都崩溃了。 Safari 提供以下通知:</p>
<pre><code>A problem occurred with this webpage so it was reloaded
</code></pre>
<p>崩溃发生在内容显示之后，还没有触及任何东西。有时它会重新加载直到:</p>
<pre><code>A problem repeatedly occurred on ...
</code></pre>
<p>其他时候，它最终会加载页面，然后在滚动页面后崩溃。在极少数情况下，网站会在清除浏览器缓存后正常运行。</p>
<p>它在这些设备上完美运行:</p>
<ul>
<li>iPhone 3 iOS 7</li>
<li>iPhone 4 iOS 7</li>
<li>iPhone 5 iOS 9.2</li>
<li>iPhone 6 iOS 9.2</li>
<li>安卓</li>
<li>Windows 手机</li>
<li>所有 Windows 和 Mac 桌面 Chrome、Safari、IE、Firefox</li>
</ul>
<p>没有明显的内存泄漏，如时间轴所示，包括页面加载和滚动站点内容，动态地将 javascript 对象和元素添加到 dom:
<a href="/image/lqCOb.png" rel="noreferrer noopener nofollow"><img src="/image/lqCOb.png" alt="Page load and scrolling through site"/></a> </p>
<p>导致问题的一般过程:</p>
<ul>
<li>收集包含带有 css backgound-image:url() 元素的现有 DOM 元素</li>
<li>从 DOM 中删除现有元素。</li>
<li>然后将元素插入到新容器元素中的 DOM 中</li>
</ul></p>
<br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
<p><p>我相信我找到了错误...</p>
<p>显然 Safari 9(仅限 iPad)在应用 css 时不喜欢它 <code>transform:translate3d();</code>在包含 css 的元素上 <code>background-image:url(),</code>用<code>z-index:-1;</code> </p>
<ul>
<li><p>删除 translate3d 改善了问题，但性能
太可怕了，仍然会随机崩溃。</p></li>
<li><p>删除背景图像完全解决了这个问题，但是
要求。</p></li>
<li><p>最后，我能够保留背景图像和 translate3d
只要我删除了 z-index。</p></li>
</ul>
<p>简而言之，如果您在 ipad 上的 Safari 9 中遇到一致的崩溃，请尝试删除所有负 z-index，看看是否能解决问题。</p></p>
<p style="font-size: 20px;">关于javascript - iOS 9 safari webkit 仅在 iPad 上崩溃(iPhone 工作正常)，我们在Stack Overflow上找到一个类似的问题：
<a href="https://stackoverflow.com/questions/34144988/" rel="noreferrer noopener nofollow" style="color: red;">
https://stackoverflow.com/questions/34144988/
</a>
</p>
页:
[1]