新增文章 (#165)

* Create 2023-09-03-lazyload.md

* Update author.yml

* Create 2023-10-01-enhanced-cdn.md

source/_data/author.yml

@@ -54,3 +54,7 @@ wyblog:
   name: 无影
   avatar: https://www.wyblog1.tk/media/images/custom-headerLogo.ico
   url: https://blog.wyblog1.tk
+xingpingcn:
+  name: 邢平cn
+  avatar: https://cdn.jsdelivr.us/gh/xingpingcn/picx-images-hosting@master/20230419/%E8%87%AD%E5%8D%B7%E5%AE%9D.74vk4cdjex40.jpg
+  url: https://www.xingpingcn.top

source/_posts/blogs/2023-09-03-lazyload.md

@@ -0,0 +1,17 @@
+---
+title: 为hexo博客添加自适应图片占位图（配合lazyload）
+date: 2023-09-03
+tags: volantis
+link: https://www.xingpingcn.top/%E4%B8%BAhexo%E5%8D%9A%E5%AE%A2%E6%B7%BB%E5%8A%A0%E8%87%AA%E9%80%82%E5%BA%94%E5%9B%BE%E7%89%87%E5%8D%A0%E4%BD%8D%E5%9B%BE.html
+headimg: https://jsd.cdn.zzko.cn/gh/xingpingcn/picx-images-hosting@master/20230506/image.p9bxtn3d6ww.webp
+author: xingpingcn
+description: 为hexo博客解决图片抖动问题添加自适应图片占位图
+keywords: volantis hexo 自适应 占位图 硬编码 布局抖动 远程图片 
+categories: hexo折腾
+
+---
+  我们要得到的结果如封面所示
+
+  由于博客采用了图片懒加载（lazyload）插件，在加载dom后和图片加载成功之前，图片占位图为1px的像素，图片加载成功之后，则会把布局撑开，造成布局抖动。如果把和要加载的图片（本博客所有图片都放在了GitHub图床上，所以要用到`image-size`库访问远程图片）一样大小的占位图替代1px大小的占位图，则能解决布局抖动问题。本post将会占位图以硬编码的方式写到`dom`中，这需要修改在生成hexo博客时会用到的`fancybox.js`（或许每个主题用到的文件里都不一样，但最终都会使用`hexo.extend.tag.register()`方法；本博客使用`volantis`主题）。
+
+  <!-- more -->

source/_posts/blogs/2023-10-01-enhanced-cdn.md

@@ -0,0 +1,12 @@
+---
+title: 使用freecdn-js提高hexo博客的cdn稳定性
+date: 2023-10-01
+description: 根据md文件内的cdn链接（图片等并不在本地）自动生成cdn列表，若图片、js、html等文件cdn失效则尝试连接列表内的其他cdn
+keywords: cdn失效 cdn 提高免费cdn稳定性 freecdn cdn.jsdelivr.net 实时切换到合适的CDN 远程图片
+author: xingpingcn
+link: https://xingpingcn.top/%E4%BD%BF%E7%94%A8freecdn-js%E6%8F%90%E9%AB%98hexo%E5%8D%9A%E5%AE%A2%E7%9A%84cdn%E7%A8%B3%E5%AE%9A%E6%80%A7.html
+---
+
+由于`cdn.jsdelivr.net`在国内不太稳定，替代的`jsd.cdn.zzko.cn`稳定性稍好，但是也不是100%稳定，因而需要一个脚本实时切换到合适的CDN。[freecdn-js](https://github.com/EtherDream/freecdn)能实现这个需求，但是我的文件（图片、js等）储存在GitHub图床，而`freecdn-js`本身需要被加速的文件的`hash`，因此需要自己写脚本处理下载图片并计算。因为图片等文件的cdn链接是直接写在`.md`文件中的，所以写了一个正则脚本来提取cdn的链接。
+
+<!-- more -->