Cloudflare の DNS Proxy を使うとパフォーマンスにどのぐらい影響あるのか調べてみた

2024-03-15

はじめに

Cloudflare の DNS Proxy を使ってみたが、表示が若干遅くなるような気がしたので計測してみた。

システム構成

だいたいこんなイメージ。
「CloudFront いるのか?」とは思うが、今の構成に Cloudflare の DNS Proxy を挟んだらどうなるかを見てみたかったのでそこは一旦気にしない方向で行く。


   +-------------------+
   |     Browser       |
   +-------------------+
             |
             v
   +-------------------+
   |    Cloudflare     |
   +-------------------+
             |
             v
   +-------------------+
   | Amazon CloudFront |
   +-------------------+
             |
             v
   +-------------------+
   |     Amazon S3     |
   +-------------------+

計測方法

JavaScript + Node.js で簡易的に計測した。

Node.js のバージョン

$ node -v
v20.11.1

計測用のコード

// index.js
const main = async () => {
  const times = await Promise.all(Array.from({length: 100}).map(async(_, i) => {
    await new Promise(resolve => setTimeout(resolve, i * 100))
    const start = new Date().getTime()
    const response = await fetch("https://mryhryki.com/")
    const end = new Date().getTime()
    if (!response.ok) {
      throw new Error(`Failed to fetch: ${response.status}`)
    }
    return end - start
  }))

  console.log(`MAX: ${Math.max(...times)} ms`)
  console.log(`MIN: ${Math.min(...times)} ms`)
  console.log(`AVG: ${times.reduce((a, b) => a + b, 0) / times.length} ms`)
  console.log(`Times: ${times.join(", ")}`)
};

main()

「Your SSL/TLS encryption mode is Flexible」の場合

Cloudflare -> CloudFront 間の通信を暗号化しない設定のよう。

flexible

$ node index.js 
MAX: 382 ms
MIN: 20 ms
AVG: 34.91 ms
Times: 178, 20, 20, 20, 21, 21, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 26, 26, 26, 26, 26, 26, 26, 27, 27, 27, 27, 27, 27, 27, 28, 28, 29, 29, 30, 30, 30, 30, 31, 31, 31, 31, 32, 32, 33, 34, 34, 34, 36, 37, 382, 39, 40, 40, 40, 41, 43, 47, 48, 49, 71, 72, 75, 82, 82

「Your SSL/TLS encryption mode is Full」の場合

Cloudflare -> CloudFront 間の通信に HTTPS を使う設定のよう。

full

遅くなるのはわかるが、リクエストの時間にバラつきがあるのは気になる。

$ node index.js 
MAX: 883 ms
MIN: 22 ms
AVG: 181.93 ms
Times: 106, 110, 113, 121, 121, 121, 123, 123, 123, 123, 124, 127, 127, 128, 128, 129, 129, 129, 129, 129, 130, 131, 133, 135, 139, 142, 149, 163, 165, 169, 175, 177, 178, 22, 232, 244, 257, 269, 290, 319, 324, 354, 401, 419, 432, 453, 454, 552, 577, 578, 580, 584, 587, 592, 604, 77, 78, 79, 79, 79, 79, 80, 81, 81, 82, 82, 82, 83, 83, 83, 83, 83, 83, 84, 84, 84, 84, 84, 84, 84, 85, 85, 85, 86, 86, 87, 87, 88, 88, 883, 89, 89, 89, 90, 90, 90, 91, 95, 96, 96

DNS Proxy を設定しない場合

この場合は、ダイレクトに CloudFront にアクセスするので、Cloudflare は経由しない。

no-proxy.png

ダイレクトにアクセスするので、当然速い。

$ node index.js 
MAX: 219 ms
MIN: 8 ms
AVG: 20.21 ms
Times: 10, 10, 10, 10, 10, 10, 10, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 12, 12, 12, 12, 12, 12, 12, 12, 122, 13, 13, 13, 13, 13, 13, 13, 13, 13, 14, 14, 14, 14, 14, 14, 14, 15, 15, 15, 15, 15, 15, 16, 16, 16, 16, 16, 16, 16, 16, 16, 17, 17, 18, 18, 18, 19, 19, 19, 20, 20, 20, 20, 20, 219, 22, 23, 29, 31, 33, 34, 39, 48, 53, 57, 57, 63, 68, 8, 8, 8, 9, 9, 9, 9, 9, 9, 9

まとめ

Cloudflare -> CloudFront 間の通信に HTTPS を使うと遅いのと時間にバラつきがある。
TLS コネクションは割と占める時間が大きいのか?
TLS1.2 なのか TLS1.3 なのかも気になるので、また機会があれば調べてみる。