Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

brotli圧縮でスピード向上・転送量削減を実現 Drupalとの連携

121 views

Published on

WEBスピード向上・転送量をさらに削減するBrotli圧縮をDrupalで行う為のTIPSについて紹介します。

Published in: Technology
  • Be the first to comment

  • Be the first to like this

brotli圧縮でスピード向上・転送量削減を実現 Drupalとの連携

  1. 1. WEBスピード向上・転送量削減する Brotli圧縮とDrupal
  2. 2. 2 ABOUTME Job : 合同会社レッドボックス CEO ※取り扱いトラフィックは約50Gbps前後(2017年時点) Name: 小川 かつひさ (KATSUHISA OGAWA) Like : CDN・負荷分散・WEB高速化 https://www.facebook.com/ogawaka キャッシュ屋ブログ Past : インフラ屋さん サーバーやスイッチを設定したり色々やってるアレ https://blog.redbox.ne.jp
  3. 3. 3 コンテンツ圧縮の種類 代表的な圧縮方式 Gzip(ジージップ)またはDeflate(デフレート) その他圧縮方式 Bzip2 特徴: deflateやgzipよりも圧縮率が高いが非標準 アルゴリズム:Burrows-Wheeler transform (BWT) Zopfli(ズォップリー) 特徴:Googleが2013年に開発したGzipより圧縮率が高い方式 Brotli (ブロトリ) 特徴: Googleが開発したアルゴリズム。deflateやgzipよりも高い圧縮率 アルゴリズム:LZ77、ハフマン符号、2nd order context modeling
  4. 4. コンテンツ圧縮の仕組み 4 そもそも、WEB業界での コンテンツ圧縮とは?
  5. 5. 5 コンテンツ圧縮の仕組み おれのものはおれのもの 「おれのものはおれのもの、おまえのものもおれのもの」 このテキストの場合、「おれのもの」のように同じフレーズ(文字列)が ある場合は、出現場所と文字数を置き換えることにより圧縮を実現します。 つまり同じようなフレーズが多ければ多いほど圧縮率が高い。 「おれのものは6,5、おまえ10,3も9,5」 < 圧縮
  6. 6. Brotliとは? 6 Brotli(ブロトリ)はGoogleがファイルサイズをさらに縮小するために 開発したオープンソースの圧縮アルゴリズム。 由来はスイスで「小さなパン」を意味する「Brotli」(ドイツ語)と なっています。 既に「RFC 7932」の一部としてIETFによって定義されています。
  7. 7. 7 Brotliの圧縮率とパフォーマンス 圧縮率調査1
  8. 8. 8 Brotliの圧縮率とパフォーマンス 圧縮率調査2 gzip圧縮率9よりBrotli圧縮率5のほうがコンテンツサイズが縮小 元ファイルが大きければ大きいほどBrotliの効果が高い。
  9. 9. 9 Brotliの圧縮率とパフォーマンス 圧縮コスト(パフォーマンス)
  10. 10. 10 Brotliの圧縮率とパフォーマンス Brotli圧縮を使わない手はない。
  11. 11. 11 Brotli圧縮対応状況 クライアントサイド HTTPS必須 IE/OPERA以外は対応
  12. 12. 12 Brotli圧縮対応状況 サーバーサイド ・Apache httpd 2.4.26からmod_brotliが利用可能 ・Nginx ngx_brotliを利用 ・Microsoft IIS オフィシャルでサポートはされていませんが、コミュニティモジュールを導入す ることにより対応します。 ・Node.js こちらもIISと同様にコミュニティモジュールを導入することにより対応します。 ・PHP PHPも拡張モジュールによって、brotli圧縮に対応しています。 https://github.com/kjdev/php-ext-brotli
  13. 13. 13 Drupalとの連携 DrupalでBrotli圧縮をおこなうには
  14. 14. 14 Drupalとの連携 Advanced CSS/JS Aggregation
  15. 15. 15 Drupalとの連携 Advanced CSS/JS Aggregationとは? とにかくWEBを高速化できる要素がつまっている。  JS/CSSのMinifyを自動で行う(OntheFlyでは無い)  複数のCSS.JSを統合しリクエスト数を減らす  Minifyしたコンテンツを複数のバリデータでチェック可能  外部CSS / JSのDNSプリフェッチを使用する  D7,D8両方とも対応
  16. 16. 16 Drupalとの連携 Brotli圧縮の有効化 モジュールをインストールすると、 パフォーマンスのタブに設定項目が追加されている。 Brotli を有効にするには、Brotli PHP Extentionの導入が必須。 ※https://github.com/kjdev/php-ext-brotli
  17. 17. 17 弊社CDNトラフィックを調査すると、約80%がBrotliに対応し ている。残り20%はGzip配信。 サーバーサイドの標準実装が進めば、Gzipにかわる圧縮配信の スタンダードとなる日も近い。 OnTheFly圧縮は若干圧縮コストがかかるため、Drupalのように 予めBrotli圧縮させたファイルを用意し、圧縮したコンテンツを 配信するという方式も有効。 CDNとの相性は正規化の関係上Brotliにお対応したCDNが必須。 ま と め
  18. 18. THANK YOU!!

×