博客问题记录

[Michael18811380328]

• [x] 首页看板娘是 cdn 加载的，可以本地化定制，https://cdn.jsdelivr.net/gh/fghrsh/live2d_api/model_list.json
• [x] Request URL，可以本地化定制: https://www.ruanyifeng.com/images_pub/pub_0.png Request URL: https://michael18811380328.github.io/img/grid.png
• [x] 图片和媒体文件，放在 Images 这个库中，把全部的图片拷贝到服务器中。通过脚本，自动获取图片的目录，并写入对应的 markdown 文件中展示
• [ ] https://github.com/Michael18811380328/Michael18811380328.github.io/blob/master/history/src/App.js 这个组件拆分，复用，界面效果完善一下
• [ ] 界面加一个背景音乐控件
• [ ] 自定义的背景图片，需要设置合适的尺寸和分辨率（较大的图片，在网络不佳的情况下加载慢）

[Michael18811380328]

• [x] 2.2.2 历史记录和百度统计脚本加载 404，排查一下。线上请求的是脚本的压缩文件，history.min.js，本地编译上线时，因为压缩文件耗时较多，所以把 mkdock 压缩插件去掉了，所以服务器上是未压缩的脚本，history.js 这里改一下引入的文件即可。
• [x] 2.2.3 背景图片和技术图片分成不同的目录管理（减少文件结构混乱）

[Michael18811380328]

活跃度统计：https://ossinsight.io/analyze/Michael18811380328

[Michael18811380328]

避免一个页面中加载太多图片（因为服务器在国外，网速相对较慢）有的 svg 图片在 2M 左右，如果20张图片，可能需要加载 40 张图片。SVG 的优点是矢量图，不会因为放大而模糊。

• 单页面中控制图片
• 使用小图片（或者压缩图片的格式）使用 webp 或者其他方法（最好兼容本地预览）https://blog.csdn.net/qq_58824036/article/details/121321655 实际测试，可以将 svg 格式压缩 60% 左右，界面视觉效果不变。如果追求小，最好使用 jpg 或者 webp 栅格图。如果追求不虚化，还是使用 svg 并压缩。可以写一个压缩脚本（主要是 xmind 或者 Sketch 生成 svg 然后进行压缩），根本解决办法是搭建 image thumbnail 服务器

[Michael18811380328]

github 服务器部署在国外，所以上传下载耗时较多，有几个优化方案：

• [ ] 1、不常用的博客，直接迁移到 backup 文件夹中
• [ ] 2、压缩图片，减少不必要的图片，图片最好单独放在国内的图床中，加载更快。
• [ ] 3、mkdocs 压缩 html 和 css 本地加载可能较慢，但是上传很快
• [ ] 4、这个代码仓库只作为服务器，不保留版本管理信息。在源文件中实现版本管理即可，这样可以大大减少 git 文件。