iOS/WKWebView 上 SVG 的随机故障渲染
Random glitchy rendering of SVG on iOS/WKWebView
我们在基于 WKWebView 的 iOS 应用程序中显示 SVG 图标时遇到奇怪的间歇性（非常偶然）渲染故障。
当它确实发生时，它似乎可能与 CSS 有关，因为如果我在调试页面时在 Safari 中随机更改（甚至完全不相关）CSS 类 ，故障可以随机消失或回来。不过，它似乎既没有韵律也没有理由，而且我们还没有任何方法可以可靠地重现它。
只是想知道是否有人有任何想法或者以前可能遇到过。
如您所见，有几种故障：明显的乱码图标，而且应该只有 一个 指标选项卡。那部分特别奇怪，因为 "Metrics" 标签只是文本，甚至不是图标的一部分！
如果我调试该元素，它在调试器中看起来应该是这样。该元素具有正确的背景图像 url 并且标签是它应该的（我什至可以将鼠标悬停在元素树中的标签上，它会突出显示页面上的标签，即使文本完全错误） .不知何故，它似乎在实际渲染中完全搞砸了。
所以我们最终解决了这个问题，结果发现它与 SVG 没有任何关系。罪魁祸首实际上是正在应用的 CSS 灰度滤镜，可能与我们正在做的其他事情结合使用。
简而言之，删除灰度滤镜修复了错误的渲染。
我们在基于 WKWebView 的 iOS 应用程序中显示 SVG 图标时遇到奇怪的间歇性（非常偶然）渲染故障。
当它确实发生时，它似乎可能与 CSS 有关，因为如果我在调试页面时在 Safari 中随机更改（甚至完全不相关）CSS 类 ，故障可以随机消失或回来。不过，它似乎既没有韵律也没有理由，而且我们还没有任何方法可以可靠地重现它。
只是想知道是否有人有任何想法或者以前可能遇到过。
如您所见，有几种故障：明显的乱码图标，而且应该只有 一个 指标选项卡。那部分特别奇怪，因为 "Metrics" 标签只是文本，甚至不是图标的一部分！
如果我调试该元素，它在调试器中看起来应该是这样。该元素具有正确的背景图像 url 并且标签是它应该的（我什至可以将鼠标悬停在元素树中的标签上，它会突出显示页面上的标签，即使文本完全错误） .不知何故，它似乎在实际渲染中完全搞砸了。
所以我们最终解决了这个问题，结果发现它与 SVG 没有任何关系。罪魁祸首实际上是正在应用的 CSS 灰度滤镜，可能与我们正在做的其他事情结合使用。
简而言之，删除灰度滤镜修复了错误的渲染。