towardsdatascience.com 无法load大图

[eromoe]

https://towardsdatascience.com/negative-binomial-regression-f99031bb25b4

只会显示小图，大图load不出来

[Kenshin]

这个站因为没有适配出现了无法自动识别的问题，而且一般来说， 英文类的页面大多都有 惰性加载 的功能，一般来说处理这些图片均存在一定程度的问题。

我先记新站吧。

[binsee]

此站使用 Medium Blog平台。 (参考 Websites using Medium)

此平台的文章中，图片都是懒加载，页面浏览到图片区域后才进行加载。

原文图片元素：（未加载图片时）

阅读模式图片元素

这个和 #1099 的情况类似，解决思路也类似。

但与知乎页面的区别是，知乎页面的 <noscript> 元素会进入阅读模式中，但 Medium 文章页面的 <noscript> 元素不会进入阅读模式中。

思考

是否有更多站点的图片懒加载，是类似的元素结构？

结构举例

• Medium 中的懒加载图片元素：

<figure class="ma mb mc md me fo fd fe paragraph-image">
  <div class="fq fr ee fs aj">
    <div class="fd fe ok">
      <div class="fw s ee er">
        <div class="ol fy s">
          <div class="dn abu t u v cy aj bl fu fv">
            <img alt="Image for post" class="t u v cy aj fz ga gb" src="https://miro.medium.com/max/60/1*AC4wPGPzPZPiogJrJ3U26g.png?q=20" width="1003" height="540" />
          </div>
          <img alt="Image for post" class="dd ft t u v cy aj c" width="1003" height="540" />
          <noscript>
            <img
              alt="Image for post"
              class="t u v cy aj"
              src="https://miro.medium.com/max/2006/1*AC4wPGPzPZPiogJrJ3U26g.png"
              width="1003"
              height="540"
              srcset="
                https://miro.medium.com/max/552/1*AC4wPGPzPZPiogJrJ3U26g.png  276w,
                https://miro.medium.com/max/1104/1*AC4wPGPzPZPiogJrJ3U26g.png 552w,
                https://miro.medium.com/max/1280/1*AC4wPGPzPZPiogJrJ3U26g.png 640w,
                https://miro.medium.com/max/1400/1*AC4wPGPzPZPiogJrJ3U26g.png 700w
              "
              sizes="700px"/>
        </noscript>
        </div>
      </div>
    </div>
  </div>
</figure>

• 知乎图片懒加载元素

<figure data-size="normal">
  <noscript>
    <img 
    src="https://pic1.zhimg.com/50/v2-24142c274a200ca02148e605cbcce592_hd.gif?source=1940ef5c" 
    data-caption="" data-size="normal" data-rawwidth="643" data-rawheight="529" 
    data-thumbnail="https://pic2.zhimg.com/50/v2-24142c274a200ca02148e605cbcce592_hd.jpg?source=1940ef5c" width="643" 
    data-original="https://pic3.zhimg.com/v2-24142c274a200ca02148e605cbcce592_r.jpg?source=1940ef5c" />
  </noscript>
  <div>
    <div data-size="normal" data-za-detail-view-path-module="GifItem">
      <div class="sr-rd-content-center">
        <img class="" 
        src="https://pic2.zhimg.com/50/v2-24142c274a200ca02148e605cbcce592_hd.gif?source=1940ef5c">
      </div>
      </svg> //无用，省略掉
    </div>
  </div>
</figure>

共同点

• 真实图片元素 $(figure noscript)
• 懒加载图片元素 $('figure img') 或者说是 $(figure noscript).parent().find('img')

且 $('figure img') 一般为 $(figure noscript) 的兄弟元素或者兄弟元素的子元素。

通用思路

  $('figure noscript').each(function(){
    var noscript = $(this).text();
    $(this).parent().empty().append(noscript);
  });

这个思路需要去考察更多懒加载图片的站点，来评估是否可以作为通用处理方法。

[Kenshin]

嗨，抱歉早就应该提示此 Issues 已经修复了，但因为一些原因一直耽搁到现在。

此问题可以通过 2.2.0.520 彻底解决。

新增加了专门针对 惰性加载图片的解析方案，如下图

注意：使用此功能时会出现维基百科的一些问题，解决方案 请看这里

简悦 2.2.0 请注意

嗨，如果你是 2.2.0 用户，当前版本也修复了 2.2.0 时的一些错误，如：特定条件下任意页面自动进入阅读模式 引起无法使用维基百科的问题 聚焦模式无法使用导出服务 未启用标注模式无法复制

本次更新内容

本次更新了 6 Features ，解决了 150+ Issues。
更新内容是有史以来最多的一次，如果你对目前的稍后读工作流并不满意的话，希望可以看完下面这些更新。

这只是我认为有必要重点介绍的功能，除此以外还有很多小功能没有介绍。

• 构筑稍后读的数字花园

• 全「新」的稍后读

• 更易用的标注

• 无处不在的导出服务

• 定制化 Markdown 与 HTML

• Webhooks 与 自定义导出

• 导出服务自动化

• 开放平台

• 自动聚焦模式

• 手动模式

• 自动暗色模式

• 同步助手 1.0.1

• 更智能的词法分析引擎

• 针对科研工作者的网站适配

• 快捷键可取消或停用

一些 2.2.0 相关性的教程

稍后读 · 导出的定制化 · 自动化 · 如何与双链笔记联动 Notion / Logseq / Obsidian 等，详细说明 请看这里。

更新日志

如果你想看 2.2.0 到底增加了哪些功能的话，可以看

1. http://ksria.com/simpread/welcome/version_2.2.0.html
2. http://ksria.com/simpread/changelog.html

一个建议

如条件允许，请一定要订阅 简悦的发布渠道 或 这里 或 通知中心

简悦会在每个大版本发布或不定期会推送简悦的相关信息，也请订阅 Newsletter