AI 智能摘要
为什么会有这个注释提示呢,强迫症的小伙伴会觉得很多余。其中它的意思是:因为HTML太大无法处理被跳过。能不能把这个注释删掉呢,其实是可以的。这里搬主题就分享一下解决办法。
不知道大家有没有注意到,有时候在优化了一个WooCommerce商店后,在查看源代码时,每个页面的开头都会出现以下HTML注释:
Alter HTML was skipped because the HTML is too big to process!
为什么会有这个注释提示呢,强迫症的小伙伴会觉得很多余。其中它的意思是:因为HTML太大无法处理被跳过。能不能把这个注释删掉呢,其实是可以的。这里搬主题就分享一下解决办法。
![Alter HTML was skipped because the HTML is too big to process! 图片[1]-删除注释:因为HTML太大无法处理被跳过的解决办法-搬主题](https://cdn.banzhuti.com/2023/06/20230626213501219.jpg)
在排除了这个问题后,它似乎是由WebP Express WordPress插件引起的,当启用了Alter HTML功能,并设置了Replace image URLs for pages that have a huge number of DOM elements:
![Alter HTML was skipped because the HTML is too big to process! 图片[2]-删除注释:因为HTML太大无法处理被跳过的解决办法-搬主题](https://cdn.banzhuti.com/2023/06/20230626213508819.jpg)
除了评论标签之外,这也意味着WebP Express插件并没有取代图片链接,对于支持它的浏览器来说,基本上没有做任何性能提升。
要解决这个问题,你可以调整服务器上的系统设置,或者简单地切换到用<picture>标签替换< img >标签,将网页添加到srcset.设置。
差异:
方法1:替换 <img> 标签为 <picture> 标签 | 方法2:替换图像URLs | |
|---|---|---|
| 它是如何工作的 | 它用<picture>标签取代了<img>标签,增加了两个< source >标签–一个用于原始图片,一个用于webp图片。支持webp的浏览器会选择类型属性设置为 “image/webp “的< source >标签。 | 它取代了它能找到的任何图像网址。 |
| 页面缓存 | 与页面缓存配合得很好,因为所有的浏览器都被提供相同的HTML。 | 不能与页面缓存一起使用–除非你使用的是Cache Enabler插件,它能够维护每个页面的两个缓存版本。 |
| 样式设计和javascript | 可能会因为HTML结构的改变而中断。像 “div > img “这样的选择器将不再与图片相匹配,因为现在的直接父级是 “图片”。 | 没有问题 |
| 全面性 | 只替换<img>标签 – 其他图像不受影响 | 非常全面。替换内联样式中的图像,在懒加载属性中设置的图像URL <div> 或<li>标签,等等。 |
© 版权声明
THE END























暂无评论内容