V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
MFWT
V2EX  ›  程序员

请教各位大佬的个人博客(或别的网站),使用『内容缓存』的好方法

  •  
  •   MFWT · 297 天前 via Android · 4490 次点击
    这是一个创建于 297 天前的主题,其中的信息可能已经有所发展或是发生改变。

    背景

    手头有一个写到一半的纯静态博客,由于手动生成 HTML 文件太麻烦,也不好维护,打算改成 PHP 动态生成

    当初为什么选择纯静态,原因在于,我考虑着,静态页面对 VPS 的负荷要求应该会低一些(我曾经用过超低配服务器建站,打开 WordPress 都要八九秒那种),但是纯静态页面的一些缺点(比如在线编辑较麻烦,文件内容大量重复等)让我最终选择回了动态页面

    诚然,动态页面需要吃服务器资源,但是考虑到我能有的服务器都是『有计算资源,但不强』的状态,因此还是多少想利用下的

    设想

    博客使用 MarkDown 编写,服务器在保存 MD 原文的同时解析好 HTML 内容(用 ParseDown 库),同样存储起来

    访问时,取出正文部分的 HTML ,和其他 HTML 块(比如 head/footer 部分)组合起来后再返回给用户

    我设想中的和 hexo 之类的静态博客的区别是,hexo 会预先解析好整个 HTML 页面,但是我的仅仅解析正文部分

    一些疑惑之处

    1. 像这样预先解析好一部分内容,对比完全用的时候再解析 MD ,性能节省程度明显吗?
    2. 解析前和解析后的内容都需要存储,那么是写入文件好(可能会有权限问题?)还是在 MySQL 中以 LongText 字段存储好?

    望不吝赐教

    第 1 条附言  ·  297 天前
    补充一下,我现在有的博客是 Hexo 做的,托管在一台香港 VPS 上,走 CF CDN ,一直想改版,但是直到现在才有时间:

    https://mfwt.top/
    63 条回复    2023-07-09 14:37:48 +08:00
    blankmiss
        1
    blankmiss  
       297 天前
    hexo 不是直接把 markdown 转为 html 吗
    5ibug
        2
    5ibug  
       297 天前
    md 大多都是前端解析
    LeegoYih
        3
    LeegoYih  
       297 天前
    纯 Markdown 可以试试 Docsify
    https://docsify.js.org/
    LxnChan
        4
    LxnChan  
       297 天前
    hexo ,直接编译成静态 html ,没办法从编译好的 html 逆推回 markdown ,重写了文章或主题需要重新编译,变化比较小的话支持差异编译,相对比较快,编译过程均在本地,云端不参与任何 markdown 解析和(或)动态内容解析。

    https://lxnchan.cn
    mencounter
        5
    mencounter  
       297 天前
    hexo+h2 ?
    mencounter
        6
    mencounter  
       297 天前
    错了是 pm2
    aru
        7
    aru  
       297 天前
    存储为 sqlite 数据库,然后生成 html 静态文件
    sunxiaping521
        8
    sunxiaping521  
       297 天前
    很多 markdown 是转换为 json 格式的,然后通过 Mongodb 进行存储,并且这不是 mongodb 的优势吗?
    aru
        9
    aru  
       297 天前
    话说个人 blog 有啥访问量和数据量,
    肯定用动态方便啊,写个 compose 一键拉起一键备份
    sqlite 数据库很合适,备份方便,如果还是担心性能问题,就生成静态文件缓存,但是备份就不用了
    tomiaa
        10
    tomiaa  
       297 天前
    可以参考我的博客,kuangyx.cn
    vue 写的 md 文件,在 build 的时候会编译成 静态的 html 文件
    前端在访问的时候影响速度的就是
    1 、库文件
    2 、文件图片 src
    3 、静态资源
    我目前是这样做的
    1 、可以把大文件放在 github ,再部署成 github page 做一个外链,目前文件和图片、资源都是这样做的,可以参考我弄的 live2d ( https://kuangyx.cn/docs/%E6%96%87%E7%AB%A0/JS%20Lib/Live2d.html ),和游戏的 ROM ( https://kuangyx.cn/pages/game.html
    2 、https://www.jsdelivr.com/可以用 cdn 引用 github 仓库的文件
    3 、图片、js 文件懒加载
    wuzhanggui
        11
    wuzhanggui  
       297 天前
    我的博客 https://blog.dumogu.top/
    存的时候 markdown 原文和解析的都存,简介名称这些也存个,反正存个能读取出个列表的结构,启动的时候读取简单的列表,访问的时候后端就读取解析好的然后用个模板引擎啥的拼接好 html 发给前端(想省事的直接字符串拼接,反正就返回个 html 字符串嘛),就完事儿了,不用啥数据库,自己的博客也不考虑文章量大功能多的情况。
    说前端解析的也可以,但是不用后端渲染的 seo 不好,保存文章啥的我前端先解析,耗费计算的就前端干,后端就接收字符串,存字符串,但是生成完好的 html 还是得后端拼接好
    我的博客就是这么做的,快得很
    zuijiapangzi
        12
    zuijiapangzi  
       297 天前
    不太懂,有个东西叫 Gridea ,你可以看看
    zhhanging
        13
    zhhanging  
       297 天前
    @wuzhanggui #11 抓个 bug 首页的文章图片在 safari 下拉伸严重
    LavaC
        14
    LavaC  
       297 天前
    @tomiaa 文章也是 git 提交的吗?那好像有点麻烦。我的博客也是这么搞的,因为想到每次写都得 git xxxx 就不想更新了。
    wdssmq
        15
    wdssmq  
       297 天前
    Z-BlogPHP + MD + Git 飘过……

    wdssmq/Markdown-To-Z-Blog: 使用 GitHub Actions + Markdown 更新 Z-Blog 博客。#md2zb
    https://github.com/wdssmq/Markdown-To-Z-Blog
    lwrench
        16
    lwrench  
       297 天前
    我想你说的应该是 ssg ?现在很多文档站都是
    lete
        17
    lete  
       297 天前
    不是很明白你这句话 (比如在线编辑较麻烦,文件内容大量重复等)

    1. 同样是打开电脑写文章,要不要在线编辑都一样,一个是在电脑里打开 markdown 编辑器,一个是打开浏览器,输入网址,登录,写文章。(难道你是要在手机上写文章?)
    2. 又不想让 vps 解析 markdown 又想直接得到 解析后的 html 文件,还吐槽文件内容重复,一个网站基本上很多页面局部部分都是重复的,不可避免,只有主要部分是变动的,比如文章内容是变动的,其它导航栏、页脚都一样

    在这里唧唧歪歪,还不如多掏钱买个好点的 vps ,要么 hexo 免费部署到 github
    Rache1
        18
    Rache1  
       297 天前   ❤️ 1
    你用 WordPress 开 OpCache 再配上 SQLite ,再怎么的都不至于八九秒加载不出来吧。

    大概率是 CSS 和 JS 和 一些大图阻塞了页面加载。
    huolong
        19
    huolong  
       297 天前
    换个好点的服务器就再加上 CDN 速度应该还好吧。
    https://vwo50.club/
    我这个 2H4G 的,感觉速度也不错。
    MFWT
        20
    MFWT  
    OP
       297 天前
    @lete

    1. 是的,比如这篇主题,就是在手机上完成的(外出逛街的时候,或者排队的时候写两句)
    2. 我从来没有说不想让 VPS 解析 MD ,我只是考虑『用户访问时(可以是前端,也可以是后端)解析』还是『站长写完后缓存解析结果,用户直接访问』这两个的问题而已
    MFWT
        21
    MFWT  
    OP
       297 天前
    @Rache1

    当时是用上海阿里云的学生机,5Mbps 带宽,不过为了免备案,用 SakuraFRP 的线路绕道了日本,再加上全站几乎都是单服务器,包括背景大图也是从这个服务器加载,可能这也是因素之一
    MFWT
        22
    MFWT  
    OP
       297 天前
    @lete

    我现在是考虑『在线编辑』和『写好 MD 再上传』,尽量两种方式都支持,方便选择
    Rache1
        23
    Rache1  
       297 天前
    @MFWT 学生机我记得起配好像就是 1C2G5M ,主要在于带宽太小, 跑个 5.5 、5.6 版本的 MySQL 应该没啥问题,就是带宽确实小。
    zpf124
        24
    zpf124  
       297 天前
    相对简单的方式,其实是用 github pages ,使用 github action 或者其他 CI/CD 工具。

    你直接提交 md 到 git 仓库,对应的 ci 工具检测到代码更改后自动触发生成 html 的流程。
    这样你新建以及修改都会立即生成,不需要手动操作,Hexo 也可以用这种方式。
    x86
        25
    x86  
       297 天前
    装个 WPJAM 该关的关,然后做做 memcached 或 redis 之类就差不多了
    wuzhanggui
        26
    wuzhanggui  
       297 天前
    @zhhanging 之前也有人说,我苹果手机看着没啥问题,是电脑吧,没设备复现呐
    gps949
        27
    gps949  
       297 天前
    我还是觉得我这种实践方式挺优的:
    https://reurl.cc/qLKZZp

    还可以配合 Obsidian 服用
    mytsing520
        28
    mytsing520  
       297 天前
    国内 ZF 以及大型门户网站的内容,是前后台分离,后台编辑好内容生成静态页直接单向推送到前台
    后台有草稿箱机制,如果发布后有问题,那就重新编辑内容后再次发起推送流程,把前台服务器上的静态页面覆盖掉

    有 CDN 的话,这些步骤完成之后再到 CDN 上推送缓存刷新,再进一步的话,会调用 CDN 的接口直接让 CDN 刷新缓存
    tomiaa
        29
    tomiaa  
       297 天前
    @LavaC 肯定啊,我博客开源的,弄了自动化,git 提交上去后自动部署到我的服务器
    janus77
        30
    janus77  
       297 天前
    没这个必要的,生成 html 只是一次性任务,平时访问网站的时候又没有多少负载。你所说的只解析正文部分完全没有必要。
    况且按照 hexo 这类框架的主流性能来看,生成整个网站也就一分钟,大一点的就几分钟,这没什么好说的
    所以直接生成整站就行了
    mudssky
        31
    mudssky  
       297 天前
    有服务器和域名肯定用动态,服务器资源放着浪费。
    我目前还是用 github pages ,github actions 自动部署已经很方便了,也不求别人看。单纯满足自己的。
    Lax
        32
    Lax  
       297 天前   ❤️ 1
    为了“性能”去搞静态化,基本是方向跑偏了。服务器端生成页面的开销,在总延时中的贡献几乎是九牛一毛。
    建议先测一测整个链路的延时(因为你访问上海的云服务器但是绕了日本,这个延迟估计 140ms 起步),然后看一下整个页面加载了多少的资源文件( js/css 等)。浏览器中开发工具开瀑布图就知道时间花费在哪里了。
    WordPress 性能差众所周知的原因是主程序和插件的资源引用多,可以通过合并请求减少网络交互的深度,从而优化总体的加载时间。

    自己写一套真的是劳民伤财,不如直接用现有的基于 markdown 的方案。
    不要忘了,写个人博客,核心价值是内容,不是那个页面。
    deepzz
        33
    deepzz  
       297 天前
    可以参考: https://github.com/eiblog/eiblog#%E5%8A%9F%E8%83%BD%E7%89%B9%E6%80%A7 ,为了加快加载速度做的优化。
    zephyru
        34
    zephyru  
       297 天前
    只考虑两个问题
    1 、明显,如果服务器端解析,如果服务器性能不行会有延迟(并发情况下会明显不过一般遇不到),客户端解析,则是看客户端性能。
    2 、如果你打算写一套内容系统,可能存数据库会好点(推荐 sqlite 主要好迁移),如果只是单纯的博客,写文件会好点,以后想从动态改静态也可以直接用。

    核心,还是你想用 php 实现什么功能,说到底无论是静态生成博客还是动态的 php 博客都有很多成熟的解决方案。
    真的想折腾,静态资源上 CDN ,打开速度会快不少。

    附上,我的博客 https://saltfish.vip/ 。
    最开始使用的 Hexo 部署在 github Page 上。
    后面自己用 Nodejs 进行了一些改造 ,买的服务器配置也和你的差不多,5mb 的带宽,不过我备案了。
    其中也做了你现在想做的部分,编辑器,pjax ,文件预览,在线热更,预渲染,动态渲染(存数据库和文件也试过),live2d 之类的小插件。
    然后服务器到期了,换了现在用的 Typecho ,部署在自己家里的迷你主机里,通过通道服务解析域名。
    结论就是,如果只是想写博客,现成的方案会好一些。如果想顺便学点东西,什么想法都试下,会比较直观。
    lambdaq
        35
    lambdaq  
       297 天前
    静态文件不是吃不吃服务器资源的问题,而是很容易放到 CDN 上去。
    MFWT
        36
    MFWT  
    OP
       297 天前
    @Lax

    嗯,主要是想要减少页面加载的内容,目前的话在保证效果的情况下一个页面几十 KB 就搞定(头像占了一半空间)
    mephisto
        37
    mephisto  
       297 天前
    @tomiaa 网站 favicon 有特点
    NoString
        38
    NoString  
       297 天前
    啊?我 1h2c 3mbp 没啥访问了 WordPress 加完 cdn 感觉也还行啊

    https://kelovp.tech
    zzzmh
        39
    zzzmh  
       297 天前
    如果你会 go 的话,推荐用 go 写后端,效率比 php 所谓的 8~9 秒快很多很多
    另外 md 转 h5 有个快速的方案,我目前在用,zzzmh.cn ,就是后端给前端 md ,前端用 js 做 md2h5 ,配合好的话还是飞快的,而且压力全部给到客户端 chrome ,服务器飞快。
    duke807
        40
    duke807  
       297 天前 via Android
    https://blog.d-l.io/about-zh

    我的 blog ,不用数据库,免注冊可评论、删评论,md 写内容,浏览器端渲染,cf cdn ,定期生成快照 照顾部分爬虫
    chenjia404
        41
    chenjia404  
       297 天前
    加一个 cloudflare 的 cdn ,然后页面全部缓存在 cdn 。
    zzzsy
        42
    zzzsy  
       297 天前
    放 vercel ,静态很快的
    goldeye0351
        43
    goldeye0351  
       297 天前
    我是用 notion 笔记当网站的数据库, 写完笔记, 就自动增量更新 blog 了.
    <a href="https://mynotion.life">https://mynotion.life</a>
    goldeye0351
        44
    goldeye0351  
       297 天前
    我是用 notion 笔记当网站的数据库, 写完笔记, 就自动增量更新 blog 了.

    https://mynotion.life
    weeiy
        45
    weeiy  
       297 天前   ❤️ 2
    改来改去发现,如果内容不好,谁关心你的页面,打不打得开重要吗?
    内容质量第一,页面排版和速度倒是其次。
    先搞出名气,再考虑体验。
    dfkjgklfdjg
        46
    dfkjgklfdjg  
       297 天前
    搞一个私有仓库,然后每次提交的时候执行一下 github action 自动编译然后推送到你的 `xxx.github.io` 仓库不就好了吗?
    都不需要去管它了,每次用 md 编写玩文章之后点一下 push 后面的事情就交给 github 了。


    如果要考虑速度的问题,不应该优先考虑 CDN 吗?直接读最近节点的静态文件,肯定比访问你的服务然后拼接完了再返回快啊。
    divilbs
        47
    divilbs  
       297 天前
    你的输出文章是否有人关注有人阅读,之后考虑你的“加速”吧
    di1012
        48
    di1012  
       297 天前
    同意楼上说的,页面啥样不重要,重要的是内容!
    xiaohui1219
        49
    xiaohui1219  
       296 天前
    用宝塔不挺好的吗,
    zhhanging
        50
    zhhanging  
       296 天前
    @wuzhanggui #26 .content-container>.item .img 的 height: fit-content 去掉就好了,只有 safari 有这样的问题,手机 safari 横屏也是。就是 safari 把 height: fit-content 不知道为什么把高度设置成图片原始大小的高度了
    harrozze
        51
    harrozze  
       296 天前
    可以考虑 用户第一次访问时才转换 md =>html ,并且程序检测 两个文件的更新时间,发现 md 更新的时候,重新转换。这样你的 php 负载很小,大部分都可以 redirect 到 html 文件的 url 去。
    harrozze
        52
    harrozze  
       296 天前
    @harrozze #51 你想让第一个用户访问的时候也很流畅的话,就自己做真正的第一个用户。发布完 md 就去访问一下
    harrozze
        53
    harrozze  
       296 天前
    想起来有一种格式叫 shtml ,支持服务器端 include ,这样你的页头页尾等等就可以不用重新编译,只需编译内容页后,include 了
    WhaleFall2020
        54
    WhaleFall2020  
       296 天前 via Android
    @wdssmq 我是 hexo + github action build 一把梭,只需要维护存储 markdown 文件的目录 Git push 到 repository 上就触发 action 自动 build 对应的 github pages branch 。
    xuelang
        55
    xuelang  
       296 天前
    我的 https://selfboot.cn/ 也是 hexo ,本来放 github pages ,最近迁移到了 netlify ,自带 CDN 加速。
    图片是放腾讯云 cos 上,没用 cdn 。图片压缩后,不用 cdn 速度也还可以。
    coolloves
        56
    coolloves  
       296 天前
    直接用 nginx 的 proxy_cache 就可以了吧
    wuzhanggui
        57
    wuzhanggui  
       296 天前
    @zhhanging #50 感谢感谢,没想到搁楼主这儿划个水热心网友帮忙给解决问题😘
    jaylee4869
        58
    jaylee4869  
       296 天前
    我的博客直接基于 nextjs 做基于 markdown 的 ssg ,结合 html 的 ast 也可以在 markdown 中增加 jsx 组件和复杂的 dom (类似 mdx),放 GitHub 配合 Vercel CI/CD 和 serverless/edge function 花样能玩出很多,另外还套了 cloudflare cdn 大部分静态内容请求甚至都打不到 vercel 上,免费账户完全够用。

    https://lawrenceli.me
    naminokoe
        59
    naminokoe  
       296 天前
    没那么复杂,wordpress + Super Page Cache for Cloudflare 插件完事,全球同步

    springwood.me
    jianyang
        60
    jianyang  
       296 天前
    那么请问在一百万数据的情况下
    jianyang
        61
    jianyang  
       296 天前
    回车发布了。。。
    那么请问在一百万数据的情况下
    是在目录里从一百万静态文件中找出并打开快
    还是在数据库里从一百万行记录查询快
    FarmerChillax
        62
    FarmerChillax  
       296 天前
    静态博客为啥还要台服务器挂。。。 对象存储+ CDN 流量不高的情况下每个月都不花钱,非常适合个人使用
    lixuehan123
        63
    lixuehan123  
       294 天前 via iPhone
    我的 Wordpress 挂 cf https://dajiayouxuan.com/
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3398 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 31ms · UTC 10:58 · PVG 18:58 · LAX 03:58 · JFK 06:58
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.