20230624Okayama

Cloudflare Okayama Meetup #CloudflareUG_OKJ Cloudflare Japan株式会社 エバンジェリスト 亀田 治伸

Our Vision 安全性、信頼性 と パフォーマンス、高速性 の両立 To help build a better internet 1,260 95 億 % 50ミリ秒圏内に世界のインター ネットユーザーの95%が存在 100 % アップタイム SLA 1日あたりの サイバー脅威ブロック数 世界のインターネットトラフィック全体の ~25% を支えるCloudflare

Global Network Footprint 300 都市以上 100か国以上 10 PoP 日本国内に存在する Point of Presence 12,000 以上 の ISP、クラウドプロバイダー、 大企業を含むネットワークと グローバルに相互接続 197Tbps のネットワーク容量は、 さらに拡大中

Global Network Footprint 285 都市以上 100か国以上 一般的なCNAME 10 PoP 日本国内に存在する Point of Presence 11,500 以上 の ISP、クラウドプロバイダー、 大企業を含むネットワークと グローバルに相互接続 192Tbps のネットワーク容量は、 さらに拡大中 Domain A / IP Address Domain B (CNAME) DNS CNAME : Domain B → Domain A A : Domain A → IP

Global Network Footprint 285 都市以上 100か国以上 10 PoP 日本国内に存在する Point of Presence 11,500 以上 の ISP、クラウドプロバイダー、 大企業を含むネットワークと グローバルに相互接続 192Tbps のネットワーク容量は、 さらに拡大中 Cloudflare NW IP Anycast

Cloudflare サービス群 Cloudflare Platform 1 Cloudflare One Cloudflare Zero Trust Services Cloudflare Network Services Cloudflare Application Services Zero Trust Network Access WAN-as-a-Service WAF with API Protection Secure Web Gateway Firewall-as-a-Service Rate Limiting Cloud Access SecurityBroker L3 & L4 DDoS Protection Load Balancing Cloud Email Security Network Interconnect Bot Management Remote Browser Isolation Smart Routing L7 DDoS Protection Data Loss Prevention IDS/IPS CDN and DNS Cloudflare Edge Developer Platform Workers Cloudflare Global Network Compliance/Privacy: FedRAMP, ISO, SOC, PCI, GDPR compliant, Logs & Analytics, Data Localization Suite Pages R2 Workers KV Durable Objects Images Stream

To help build a better internet Project Safekeeping Project 待合室 Fair Shot

Turnstile (Managed challenge)の仕組み Originから直接Cloudflare APIを呼び出す実装パターンが可能 （DNSや通信経路は従来通り） 複数の手法でCAPTCHAの出力を90%低減（人類全体で1日500年の時間を節約） Google Picasso Apple Private Access Token JS Challenge

Google Picasso ブラウザごとのJavaScript実装の方言を判別。 ピカソのような絵を描画させることで差異が生まれる

Apple Private Access Tokens Apple, Google, Fastly, Cloudflare による共同開発 ・IPアドレス等を隠匿した匿名トークン ・iOS16 / Venturaから対応 ・１年の有効期間 ・IssuerとVerifierの分離でより強固な匿名性を実現

Developer Platform Workers Compute サーバレスなエッジ コンピューティング Chromium v8ベース Durable Objects KV R2 Storage D1 CDN Load DNS Balancing Network Pages Wrangler Developer Experience 永続ストレージ グローバルネットワーク ホスティングと開発環境 Durable Objets: Object KV: Key Value R2: S3互換Object D1:SQL Lite WAFやDDoS対策など Pages: JAMstack Hosting Wrangler: 開発用CLI

Pages 概要 背景 開発者が共同でWebサイトをデプロイするた めのデプロイメントプラットフォーム ● 最小限の構成でWebサイトのデプロイと ホスティングができる開発者向け製品 ● フィードバックを収集し、迅速に反復 するための高度なコラボレーション ● スピード、セキュリティ、 スケーラビリティを容易に実現 ● RegionではなくEdgeで動作するため、 高速なアクセスを実現

How to use Pagesを gitプロバイダに接続 プロジェクトを 作成 コードの変更を git リポジトリに プッシュ Workersと同じCLI でアセットを 構築し Cloudflareのネット ワークにビルド後 数秒でデプロイ

ブランチやステージングの管理 ⚫ CI/CDの自動化： ビルドコマンドを選択してデプロイすれば、 実行・運用は自動化 ⚫ 無限に広がるステージング: すべてのブランチにステージング環境を提供 ⚫ 保護されたプレビューリンク: コミットごとに生成されるURLで、 コラボレーション用に共有可能、 Cloudflare Access(ZTNA)によって保護

Workers + Pages Pages Functions 概要：Server-Side Rendering (SSR) の実現 理由：プロジェクトにダイナミックな機能と バックエンドロジックを簡単に追加できる How:プロジェクト内の functionsディレクトリがWorkers実行環境 静的アセットと一緒にFunctionsをデプロイ

Google Core Web Vitals と Edge Computing Core Web Vitals: (2024年3月より運用開始) Googleが提唱しているWeb健全性指標です。 現在はChroniumのみがサポートしており、SafariやFireFoxは未対応 (対応は予定されているようです） 最大コンテンツ ペイント (LCP): ユーザーが認識した読み込み速度を測定し、 ページのメイン コンテンツの読み込みにかかる時間を返す 次のペイントへのインタラクション(INP): Web サイトがユーザー入力に 応答する速さを測定 累積レイアウト シフト (CLS): 視覚的な安定性を測定。 ウェブサイトが表示された後に動く部分を測定します。 よくある上から徐々に落ちてくる広告などは体験を下げるため、 この点数が上がる（悪くなる）

SPA から SSR へ Singe Page Application (SPA) : HTML と JSをブラウザが読み込み実行（ブラウザでHTMLを生成） 原則CDN でキャッシュ可能だが、Core Web Vitals は低減 Server-Side Rendering: サーバ側でHTMLを動的生成してブラウザへ出力 CDN でキャッシュはできないが、Core Web Vitalsは向上 Edge Computing Edge Computing: サーバ側（クラウドの中ではなく外：お客様から最も近いエッジ） でJSを実行させHTMLを出力

Edge Platform The Forrester New Wave for Edge Development Platforms

ありがとうございました