少し時間をかけて、簡単に作りました。
はじめに#
これを作った理由は、ほとんどの jsDelivr ミラーが画像の高速化に使用できないためです。また、以前の記事にはまだ GitHub に移行されていない画像がたくさんあります。
画像の高速化が許可されているため、Cloudflare CDN を使用してリソースを配信し、Vercel の 100GB のトラフィックが速く消費されることを防ぎます。
同様のプロジェクトはあまり見かけませんでしたので、作ってみました。
使用方法#
エンドポイント：https://jsd.lihaoyu.cn
単に https://cdn.jsdelivr.net を https://jsd.lihaoyu.cn に置き換えるだけです。
ファイル構造は jsDelivr の元の構造に従います。キャッシュの問題を避けるため、本番環境ではバージョン番号を指定することをお勧めします。
例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello Bulma!</title>
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css">
+ <link rel="stylesheet" href="https://jsd.lihaoyu.cn/npm/[email protected]/css/bulma.min.css">
</head>
<body>
<section class="section">
<div class="container">
<h1 class="title">
Hello World
</h1>
<p class="subtitle">
My first website with <strong>Bulma</strong>!
</p>
<figure class="image is-128x128">
- <img class="is-rounded" src="https://cdn.jsdelivr.net/gh/Big-Cake-jpg/Image_For_My_Blog/20230404_124948000_iOS.jpg">
+ <img class="is-rounded" src="https://jsd.lihaoyu.cn/gh/Big-Cake-jpg/Image_For_My_Blog/20230404_124948000_iOS.jpg">
</figure>
</div>
</section>
</body>
</html>
キャッシュのリフレッシュ#
キャッシュのリフレッシュには対応していません。
リフレッシュが必要な場合は、コメント欄にメッセージを残してください。週末に一斉にリフレッシュします。