mipengine / mip2

MIP (移动网页加速器)通过优化网页JS、控制资源加载顺序,达到加速网页的效果。
https://www.mipengine.org/
MIT License
184 stars 49 forks source link

mip-img 是否需要提供默认图片或者备选图片的机制 #451

Closed clark-t closed 5 years ago

clark-t commented 5 years ago

要解决什么问题 mip-img 在图片链接失效时会显示浏览器默认的图片裂掉的样式,请问是否能提供某些机制,能够在图片链接失效时显示默认图片以带来更好的体验? 另外需要大家讨论下,在 MIP 的 HTML 标准里是否要求图片的链接必须生效呢?毕竟图片链接失效本身就属于一种不好的体验,所以我个人认为应该要求站长主动去替换失效图片而不是由 mip-img 去做兜底。

描述一下你理想中的解决方案

  1. 如果确定支持,可以在 mip-img 提供 fallback 之类的属性来传入备选图片 url
  2. mip-img 内部只有当图片 onload 事件触发时,再将图片插入 HTML 当中
  3. 不提供 fallback 属性,要求开发者自行写 mip-img 标签的 background-img 的 custom style 进行兜底

描述你的备选方案 清晰准确的描述你考虑的备选方案

补充信息 补充其他信息,如截图等

PengXing commented 5 years ago

我觉得备选图片没必要,理由如下:

  1. 难道这图片也要 CDN 抓过来吗?MIP CDN 绝大部分情况下是靠谱的,因此这张图片会很浪费
  2. 如果不抓过来,那图片加载失败了,去站长服务器去加载备选图片吗,那图片估计也会加载失败

补充一句:MIP CDN 是百度的 CDN,稳定性 99.99% 是肯定能保证的

因此,备选图片没必要,站长可以使用已有的 fallback 自定义加载失败的情况下怎么显示

huanghuiquan commented 5 years ago

现在有提供 fallback 的机制

<mip-img src="./xxx.jpg" layout="responsive" width="1" height="1">
    <mip-img src="./fallback.jpg" layout="fill"><mip-img>
<mip-img>
clark-t commented 5 years ago

@huanghuiquan 方式1会在显示上同时存在一张裂掉的图片和一张好的图片,另外这样两张 mip-img 嵌套会发送两张图片的请求,是否会拖慢页面加载速度?另外 mip-notsupport 是否需要默认对 mip-img 标签里的 img 进行隐藏省的裂图给显示出来?

clark-t commented 5 years ago

我觉得备选图片没必要,理由如下:

  1. 难道这图片也要 CDN 抓过来吗?MIP CDN 绝大部分情况下是靠谱的,因此这张图片会很浪费
  2. 如果不抓过来,那图片加载失败了,去站长服务器去加载备选图片吗,那图片估计也会加载失败

补充一句:MIP CDN 是百度的 CDN,稳定性 99.99% 是肯定能保证的

因此,备选图片没必要,站长可以使用已有的 fallback 自定义加载失败的情况下怎么显示

赞同