Feature: 图片慢加载

[0xe69e97]

【题外话】

• 大佬博客主题很好看，从 Reco 迁移过来的，目前已经迁移的 7788 了，特喜欢首屏图以及各个文章的 Header 图！所以忍不住让它变得更好了。

【需求背景】

如果：

• 只用几个图一般没啥问题，我的博客首屏使用了 7 张，每篇文章使用了一张，最少为 1920*1080 的分辨率的高清图

• 有自己的国内服务器，图片压缩后，一般问题也不大

• 由于主题使用大量的高清图片，出现图片加载过多，时间过长。导致：

1. 用户体验不好
2. 首屏时间过长

【需求目的】

如果可以希望大佬抽空看一下我的 Demo，展示了一下图片加载的问题，可以多次清除缓存刷新查看。

模仿的 Medium 进行开发的

其实希望最后的配置文件里，可选就好了。

// type
interface ImageItem {
  path: string;
  mask?: string;
  placeholder?: string;
}

// API
homeHeaderImages: [
      {
        placeholderImage:  "https://cdn.jsdelivr.net/gh/0xe69e97/image-PicX@master/games/12321.321bks06jea0.webp",
        path: "https://cdn.jsdelivr.net/gh/0xe69e97/image-PicX@master/games/Elden-Ring_001.36d3arnye2w0.webp",
        mask: "rgba(40, 57, 101, .4)"
      }
]

看看大佬意见如何，如果没时间我也可以尝试提 PR 。但是我从来没提过 PR。（逃，哈哈哈哈

[Zhengqbbb]

我初步的看了一下 🤔
你是想header image 先显示 placeholder 模糊占位图然后等待 path 真实图加载完毕后替换模糊占位图
是这样的意思吗？

[0xe69e97]

我初步的看了一下 🤔 你是想header image 先显示 placeholder 模糊占位图然后等待 path 真实图加载完毕后替换模糊占位图 是这样的意思吗？

嗯嗯 是的。
我线上的突然不好使了。。本地可以，还在排查问题。。😅

[Renovamen]

这个 demo 的文章头图一直是缩略图，所以理论上它是应该变成高清的吗？还是只有正文部分是 demo 😂

[0xe69e97]

这个 demo 的文章头图一直是缩略图，所以理论上它是应该变成高清的吗？还是只有正文部分是 demo 😂

啊，Demo 的头图是模糊的，不是有加载效果的。只有正文的图片是有效果的 😂