导航

萌即是正义!时不时分享一些ACG活动记录与有趣代码的小站!

侧边栏
最新评论
广树管理员
2025-02-19 22:04
@老张博客:大佬呀,这第几次问这个问题了呀
老张博客
2025-02-19 21:18
我在想博主是不是一位女生呀
广树管理员
2025-02-19 20:46
@菲兹克斯喵:是呀,学生时代最喜欢的小说
菲兹克斯喵
2025-02-19 20:04
前段时间刚看完文学少女第九卷,后面没什么时间了 确实好看,快 20 年的小说了
广树管理员
2025-02-19 08:23
@某科学的贝壳:哈哈哈,确实属于有生之年了
正在攻略

logo_kai.jpg


PSN奖杯卡

PSN奖杯卡

赞助商广告

现在可以公开的维基萌博客重构记录其①

作者:广树时间:2023-11-18 12:18:21分类:博客开发

就如上个月发布的谈谈维基萌最近遇到的破事和将来的打算中提到的一样,维基萌博客的重构正在进行。

从发布到现在也经历了一个多月,多少有些东西可以拿出来分享一下了。


新博客的LOGO

依托于AI技术的成熟,现如今设计这档事也可以交给AI完成了。

于是这次的LOGO就交给了AI,以下是AI生成的LOGO中感觉比较中意的一个。

没记错的话,当时用的关键词是wikimoe logo kawaii。

嗯,很可爱就用这个了!


新博客的架构

wikimoeblog框架 .png

新的系统完全抛弃了旧时代PHP+MySQL的架构。

数据库沿用维基萌抽卡的mongodb。

后台管理的API用了express框架进行了快速搭建,后台管理的前端页面则有vue3来完成。

博客页面考虑seo,准备用同为vue生态的nuxt3。

其实一开始有想过后台管理和博客全部都整合到nuxt3,但是研究了半天对于资源文件的动态调用这一块一直没有好的解决办法,思索了很久还是决定用使用起来更加灵活的express作为管理后台的框架,博客端则使用nuxt3,这样的方案一定程度上是对SPA和SSR的一种平衡吧。

缺点嘛,也很明显,要启动两个nodejs服务。

博客端需要用反向代理去调用管理后台上传的照片等文件


新的媒体管理系统

在新的媒体管理中,新增了相册管理对照片进行分类。

还对照片类的文件增加了图片处理模块。

QQ截图20231118133546 .png

因为并没有购买类似对象储存类的服务,图片的储存空间可以说非常宝贵。

所以在每次博客编写之前,都会针对博客所用到的图片进行大小的缩放和质量的压缩。

这在以前分享图片较少的文章时还没什么感觉,但是随着最近照片类的文章增多明显感受到了有些繁琐,于是就针对这个需求增加了自动化的图片压缩功能。


新的图片压缩格式

在新的维基萌博客中,会让webp作为图片的主要压缩格式。

因为一番比较之下,webp作为现代的压缩格式确实有着出色的性能。

比如同一张照片压缩至统一的最长边1920px,图片质量为60后:

jpg格式的大小为262KB

webp格式的大小为194KB

压缩比还是非常可观的,同时图片质量上也有压倒性的优势,如下图:

点击查看原图

同样的60质量下,jpg在一些边缘处出现了大量噪点,而webp依然能保持非常良好的画质。

现代浏览器中也几乎都支持webp格式了,所以现在尝试大面积使用webp的图片或许是一个很好的选择。


目前的完成进度

对于管理后台的进度目前如下:

□首页面板

□管理员/站长管理

■博客分类管理

■博客标签管理

媒体库管理

□文章管理

□评论管理

□友链管理

□网站设置


光是管理后台的完成度都还是相当低的一个情况,可以说路还很长。


donate.png

1210 x 50(蓝底).png

cloudcone

相似内容:
推文
页面切换更流畅的维基萌博客系统0.24.2版本发布啦! 为了减少路由跳转导致时的页面抖动,增加了一些过渡动画当作缓冲。 但是因为nuxt3自带的页面切换动画会导致接口被多次调用,于是只能自己手搓了一个,缺点就是动画的时间不能很长,不过目前看着效果还行。 另外有大佬希望能显示当前博客系统的版本,就增加了版本显示,可以在管理后台首页以及博客底部看到。同时为了照顾不想在博客端显示版本号的用户增加了博客端是否显示版本号的选项。 具体更新内容请见:https://github.com/eeg1412/wikimoeNodeJSBlog/releases/tag/v0.24.2
发表于:2025-02-01 10:35
推文
维基萌博客系统发布了0.19.4版本啦!这次依旧是一些优化和BUG修复,详情见:https://github.com/eeg1412/wikimoeNodeJSBlog/releases/tag/v0.19.4
发表于:2024-08-14 20:24
推文
想着给博客增加一个页面跳转时的过渡动画,结果加上后发现页面时不时会报错。 于是经历了一番调查之后发现在Nuxt.js中给页面加上跳转动画pageTransition后,页面和组件的onMounted会被执行2次!? 相关的Issue在Github上也有人提出:https://github.com/nuxt/nuxt/issues/27442 大致需要满足3个条件才会触发: 1.设置了pageTransition 2.mode设置为out-in 3.页面上有await useAsyncData加载接口内容 感觉有点天坑,这个问题虽然最早是今年6月有人发现的,但是实际上我所用的Nuxt版本是去年年底的版本,也就是说这个bug存在了至少大半年...
发表于:2024-07-27 14:17
推文
维基萌博客系统更新到了v0.19.1。 具体更新内容可以在github上查看:https://github.com/eeg1412/wikimoeNodeJSBlog/releases/tag/v0.19.1 补充: 被群内大佬指出了几个小BUG,临时加更了v0.19.2。 具体内容:https://github.com/eeg1412/wikimoeNodeJSBlog/releases/tag/v0.19.2
发表于:2024-07-20 10:53
推文
给博客加上了【文章目录】和【类型筛选】2个新功能,可以在博客右下角找到按钮。
发表于:2024-05-22 11:39
推文
博客新功能,游戏记录页面公开! https://www.wikimoe.com/page/games
发表于:2024-03-14 18:11
博文
维基萌博客系统v0.2.2可以公开的开发日志
发表于:2024-01-13 20:02
博文
写在博客改版更新后
发表于:2024-01-08 11:02