Slide 1

Slide 1 text

© SAKURA internet Inc. さくらの夕べ コンテンツブーストナイト クラウド事業本部インターネットサービス部 谷口元紀

Slide 2

Slide 2 text

© SAKURA internet Inc. 2 自己紹介 谷口元紀(たにぐちげんき)  2016年さくらインターネット入社  Webディレクターとして事業会社、制作会社等で勤務  レンタルサーバ/ドメイン/SSL/CDNのサービス企画を担当

Slide 3

Slide 3 text

© SAKURA internet Inc. 3 お品書き  Webページの表示高速化トピックス  サーバー負荷分散/負荷軽減トピックス  コンテンツブースト機能のご紹介  設定デモ 以上15~20分程度の予定

Slide 4

Slide 4 text

© SAKURA internet Inc. Webページ表示の高速化トピックス

Slide 5

Slide 5 text

© SAKURA internet Inc. 5 Webページ表示の高速化メリット  エンドユーザの離脱を防ぐ  コンバージョン率を高める  ユーザビリティが向上する  Google検索順位の評価要素となる→Core Web Vitals向上

Slide 6

Slide 6 text

© SAKURA internet Inc. 6 Core Web Vitalsとは?  PageSpeed Insightsなどで計測される様々な値をまとめて  Largest Contentful Paint(LCP)  First Input Delay(FID)  Cumlative Layout Shift(CLS)  の3つを策定。Chromeプラグインを入れると↓な感じに表示

Slide 7

Slide 7 text

© SAKURA internet Inc. 7 Web vitalsにサーバーの速さも関係ある?  LCPにおいてサーバー応答も影響あると考えられます。  ざっくり言うとLCPはファーストビューにあるデカい画像が表 示されるまでの時間なので、画像容量やJS、CSSによるロード の遅延なども影響するため一概にサーバー応答によるものだけ ではありません。 https://web.dev/lcp/ より

Slide 8

Slide 8 text

© SAKURA internet Inc. 8 PSIはサーバーベンチマークツールではない  PageSpeed Insightsのスコアはサーバースペックだけに依存し ない  サーバーを乗り換えればスコアが必ず上がるわけではない  Webサイトの問題の原因を切り分けて対処する必要があり、そ の切り分けを助けてくれるのがPSI

Slide 9

Slide 9 text

© SAKURA internet Inc. 負荷分散/軽減のトピックス

Slide 10

Slide 10 text

© SAKURA internet Inc. 15 CDN、使ってますか?  負荷分散にはContent Delivery Networkは選択肢の一つ  負荷急増時でも適切に設定されていればサイトが表示可能  自治体HPでも利用が推奨されるなど、利用が拡大しています POINT 10年に1回の海外旅行のために大きなスーツケースを買うのは非効率。 レンタルで済ました方が安いのに似てます!

Slide 11

Slide 11 text

© SAKURA internet Inc. 16 CDNでなぜ負荷分散&高速化できるの? CDN CDN レンタル サーバ 初回アクセス時、CDNを使っていてもレンタルサーバ(オリジンと 言います)までアクセスされるのでCDNの効果はありません。

Slide 12

Slide 12 text

© SAKURA internet Inc. 17 CDNでなぜ負荷分散&高速化できるの? CDN CDN レンタル サーバ 2回目以降、キャッシュ時間が切れるまではCDNのサーバで代理応答。 PHPやデータベース処理がボトルネックにならない! レンタルサーバの転送容量もカウントされません!

Slide 13

Slide 13 text

© SAKURA internet Inc. 18 さくらのクラウド ウェブアクセラレータ  さくらのクラウドでもCDN「ウェブアクセラレータ」が利用で きます。クラウドアカウントがあれば誰でもOK!  様々な業種で利用が加速しています!

Slide 14

Slide 14 text

© SAKURA internet Inc. 19 お客様の業種など  天気予報  ホテル  学校等の教育機関  イベントの集客サイト  CM露出等のある食品  オウンドメディア  ECサイト  生配信サイト  YouTubeに置けない動画配信  普通のコーポレートサイト

Slide 15

Slide 15 text

© SAKURA internet Inc. 20 ここがすごいぞ!CDN  そもそもレンタルサーバではない  高価なレンタルサーバでも限界は訪れます  広帯域回線に接続しているCDNの限界値は遥かに高い  応答がめちゃくちゃ速い  PHP/DBの処理がないので1桁~10ms台でHTMLの応答ができます  キャッシュなので元ページがどんなに重くても高速応答します ※物理的に大容量の場合を除く  なにせ休日夜間などにダウンしたサイトの対応をしなくてもよ いのが最高!と制作会社さまより高評価です。

Slide 16

Slide 16 text

© SAKURA internet Inc. 21 ここは気をつけよう!CDN  管理画面などはキャッシュできないので速くならない  キャッシュしてはいけない情報に注意  個人情報など  課金が青天井のものが多い ※定額のサービスもあります  アクセス数が少なすぎると効果が薄くなる

Slide 17

Slide 17 text

© SAKURA internet Inc. 22 なぜ今CDNなのか?  コスト削減(これは昔から) →ピークトラフィックに合わせてサーバ設計するのが大変  SNS等のプッシュ通知による同報機能の普及や拡散 →メールと違い一気に届くのでアクセスも一気に増える  災害、異常気象の増加 →主に自治体系  画像のリッチ化による転送容量超過回避 →高精細ディスプレイの普及による画像容量の肥大

Slide 18

Slide 18 text

© SAKURA internet Inc. レンタルサーバの限界を突破する コンテンツブースト機能とは!

Slide 19

Slide 19 text

© SAKURA internet Inc. 24 コンテンツブースト機能概要1  さくらのクラウド で提供するCDN「ウェブアクセラレータ」を さくらのレンタルサーバと簡単連携できる機能  レンサバの限界を超えられます

Slide 20

Slide 20 text

© SAKURA internet Inc. 25 コンテンツブースト機能概要2  数クリックでCDNが設定でき、DNS設定不要  ライト・スタンダードは月1,100円、プレミアム以上は月間 100GBまで無料。 100GBを超える場合は5円/1GB(税込) 1,100円分の機能が無料!

Slide 21

Slide 21 text

© SAKURA internet Inc. 26 ここがすごいぞ!コンテンツブースト  課金上限が設定でき、設定を超過すると自動的にレンタルサー バ配信に戻る。予算固定したい人にピッタリ!  翌月になるとまた自動的にコンテンツブースト利用状態になる  とにかく設定が簡単である

Slide 22

Slide 22 text

© SAKURA internet Inc. 27 簡単設定の威力 ウェブアクセラレータ× レンタルサーバの設定マ ニュアル コンテンツブーストの設 定マニュアル ※実際にはプランごとの解説が1ページに まとまってるのでこれぐらいの気持ち

Slide 23

Slide 23 text

© SAKURA internet Inc. 28 簡単設定の威力  ウェブアクセラレータ×レンタルサーバの設定箇所  ウェブアクセラレータコンパネ  クラウドDNSコンパネ  ドメインコンパネ  レンタルサーバコンパネ  コンテンツブーストの設定箇所  レンタルサーバコンパネだけ!

Slide 24

Slide 24 text

© SAKURA internet Inc. 29 ご利用条件  ドメインに制限あり  www.example.com みたいにwwwがないといけない →弊社DNSの仕様上の制限なので、どうしても example.com のURL を変更したくない場合はさくらのクラウドDNS+さくらのCDN ウェブ アクセラレータをご利用ください。 変更できる場合は www.example.com へ変更してからコントロール パネルでリダイレクトを設定できます。 ※WordPress等のサイトURL変更などはサポート対象外となります。  さくらのDNSを使っている必要あり(外部DNS非対応)

Slide 25

Slide 25 text

© SAKURA internet Inc. 実際に設定してみよう! コンテンツブースト設定デモ

Slide 26

Slide 26 text

© SAKURA internet Inc. 31 デモのまとめ  設定後はキャッシュ状態を確認する  キャッシュしたくないURLは事前に登録しておく  HTML+その他リソース(画像、JS、CSS等)のキャッシュが 最強

Slide 27

Slide 27 text

© SAKURA internet Inc. ありがとうございました