Brotli圧縮:WordPress Webサイトのパフォーマンスを向上させるための強力なツール
コアポイント:
-
Googleが起動した新しい圧縮アルゴリズムであるBrotliは、ファイルのサイズを縮小して読み込みを加速することで、WordPress Webサイトのパフォーマンスを大幅に改善できます。
- サーバーにBrotliのインストールと構(gòu)成は、人気のあるWebサーバーで公式にリリースされておらず、WordPressと完全に統(tǒng)合するための手動構(gòu)成が必要なため、より複雑になる可能性があります。
- Brotliの圧縮率は、別の最新の圧縮アルゴリズムであるGZIPよりも20?26%高く、ファイルが小さく、読み込み速度が高くなります。
- Brotliには多くの利點がありますが、すべてのブラウザがそれをサポートしているわけではなく、HTTPSでのみ使用できるわけではありません。
- WordPressは、使いやすさ、強力なコミュニティサポート、構(gòu)成可能性など、多くの利點を持つ優(yōu)れたCMSになりました。ただし、WordPressユーザーが直面する課題の1つは、Webサイトのパフォーマンスの問題です。この記事では、Brotli圧縮とWordPressのパフォーマンスへの影響について説明します。
免責(zé)事項:私はkeycdnで働いています。彼らの記事とツールのいくつかはここで引用されています。
この記事では、3つの異なるシナリオでWordPressパフォーマンスをテストすることにより、Brotli圧縮の効果を測定します。「WordPress」オンラインで「Speed Up WordPress」に関する記事がたくさんあります。これは、プラグインでの最適化など、ウェブサイトの読み込み速度を向上させる多くの方法を提供します。ただし、Googleが最新の圧縮アルゴリズムであるBrotliをリリースして以來、収集されたデータは、WordPressサイトで有効になるパフォーマンスの向上を決定するのに十分ではありません。
gzipのwordpress
を有効にします
brotli- のWordPressを有効にします
- brotli対応cdn のbrotli wordpressを有効にします
- Brotli圧縮とは何ですか?
- Brotli(Swiss Bakery製品にちなんで名付けられた)は、2015年にGoogleがリリースした比較的新しい圧縮アルゴリズムです。 Googleによると、Brotli Compressionは、最新のLZ77アルゴリズムバリアント、Hoffmannエンコード、2次コンテキストモデリングの組み合わせを使用しています。
Googleは、Brotli圧縮アルゴリズムを使用してさまざまなテストを?qū)g行し、結(jié)果を他の最新の圧縮アルゴリズムと比較しました。この調(diào)査によると、Googleは、Brotliが別の最新の圧縮アルゴリズムであるZopfliよりも圧縮が20?26%高いことを発見しました。パフォーマンスに関しては、ファイルの圧縮が小さいほど、いつでも歓迎します。
サーバーにbrotliをインストールして構(gòu)成します
Brotliの小さな欠點の1つは、人気のあるWebサーバーでまだ公式にリリースされていないことです。これは、今日サーバーでBrotliを有効にしたい場合は、構(gòu)成作業(yè)を行う必要があることを意味します。以下のBrotliパフォーマンステストはすべて、nginxを?qū)g行しているUbuntu 16.04.2 LTSで実行されます(
ubuntu 16.04は、apt-getを使用してbrotliをインストールできる最初のubuntu分布です。これを行うには、実行するだけです:
終了後、Brotli圧縮用のNGINXモジュールをインストールし、NGINXの最新バージョンをコンパイルする必要があります(現(xiàn)在のバージョンは1.13.0):
$ apt-get update && apt install brotli
Brotliはサーバーに正しくインストールする必要があります。次に、nginx.confファイルを構(gòu)成して、必要な構(gòu)成ディレクティブを指定する必要があります。これらのパフォーマンステストには、次の指示が使用されています。
brotli設(shè)定
$ git clone --recursive https://github.com/google/ngx_brotli ngx_brotli $ wget http://nginx.org/download/nginx-1.13.0.tar.gz $ tar zxvf nginx-1.13.0.tar.gz $ cd nginx-1.13.0 $ ./configure --add-module=../ngx_brotli $ make && make install
指示の完全なリストは、nginxモジュールGithubページにあります。
nginx.confファイルが変更されているため、最後のステップはnginxをリロードすることです。これを行うには、次のコマンドを?qū)g行します
brotli on; brotli_comp_level 3; brotli_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;Brotliサポートをテスト
brotliをインストールしてサーバーに構(gòu)成する必要があります。これを確認するには、2つの方法から選択できます。
- Brotliテストツールを使用します。これは、ドメイン名に基づいてサーバーがBrotliをサポートするかどうかを確認します。
-
-
で動作します
この時點で、Brotli圧縮を使用してWordPressリソースを正しく配信できるはずです。ただし、HTMLドキュメントのリクエストヘッダーの詳細を確認すると、コンテンツエンコード値がまだ「GZIP」であることに気付くかもしれません。これは、WordPress PHPコードがPHPの設(shè)定 "on"に依存しているためです。 zlib.output_compression
今、あなたのウェブサイトのHTMLドキュメントをチェックするとき、あなたはコンテンツをエンコードするヘッダー値BRを見ることができるはずです。
WordPressでのBrotliパフォーマンステストの処理
上記のように、
Brotliパフォーマンステストは、3つの異なるシナリオで実行されます。
- gzipのwordpress
- を有効にします brotli
- のWordPressを有効にします brotli対応cdn
- のbrotli wordpressを有効にします
上記のテストWebサイトのすべてのリソースが圧縮可能ではないことに注意する必要があります。たとえば、畫像はGZIPによってもBrotliによって圧縮されたり、サードパーティのリソース(フォントなど)がBrotliによって圧縮されたりすることはありません。したがって、GZIPを使用したすべての圧縮リソースの総サイズのベースラインは84.7kbです。負荷時間の変動を検討するために、各ページで3つのハードリフレッシュを?qū)g行し、各テストシナリオの平均負荷時間を計算しました。これにより、すべてのリソースは、ブラウザキャッシュからではなく、サーバーからロードされます。
次の表には、読み込み速度と圧縮リソースサイズの結(jié)果が概説されています。
WordPress Gzip | WordPress Brotli | WordPress Brotli CDN | |
---|---|---|---|
加載速度 | 780 ms | 690 ms | 630 ms |
壓縮大小 | 84.7 KB | 81.7 KB | 81.7 KB |
結(jié)果が示すように、両方のBrotli圧縮法の両方の荷重時間はGZIPよりも速く、圧縮サイズが小さくなります。ページサイズの違いは重要ではありませんが、これらのテストは裸の金屬のワードプレスのインストールで実行されたことを忘れないでください。多くのリソースを持っているサイトでは、複數(shù)のリソースを少量の節(jié)約が確実に蓄積するでしょう。
さらに、テストのために、圧縮性リソースのサイズの違いを観察するために、両方の圧縮方法を最高レベルに設(shè)定します。結(jié)果は次のとおりですBrotli 11 - 圧縮サイズ:67.7 kb
- GZIP 9 - 圧縮サイズ:76.7 kb
- どちらの場合も圧縮レベルを最大に設(shè)定する必要はありませんが(圧縮時間がはるかに長いため)、Brotli Webサイトの圧縮可能なリソースサイズはGZIP Webサイトよりも大きいことに注意してください%小さい。
brotliサポートステータス
Brotliはすべてのブラウザーによって普遍的にサポートされていませんが、多くの人気のあるブラウザは現(xiàn)在それをサポートしています(2017年5月現(xiàn)在)。
http://m.miracleart.cn/link/fc5f86251458722c799d1830fa0c2c1f
サーバーサポートについては、最も人気のあるWebサーバーが公式またはコミュニティが作成したモジュールを提供します。この記事のインストールプロセスに示されているように、Nginxユーザーは拡張機能をインストールし、brotliサポートを使用してnginxをコンパイルする必要があります。同様に、Apacheユーザーはmod_brotliモジュールを使用して、Brotli圧縮コンテンツを配信できます。
何でも、Brotliを使用することには利點と短所があります。考慮すべき點がいくつかあります。
pro
圧縮結(jié)果が小さい
- 読み込み時間が高く
- gzipと比較して、圧縮時間は同等です
- 短所
今すぐ使用するのは少し面倒です
すべてのブラウザがサポートしているわけではありません- WordPressと完全に統(tǒng)合するには、手動構(gòu)成が必要です
- さらに、BrotliはHTTPSでのみ使用できます。これは、利點と不利な點と見なすことができます。一方では、より多くのWebサイトがHTTPからHTTPSに移行するのに役立ち、より安全なインターネットを作成しています。一方、Brotliを有効にしたいがHTTPを使用しているユーザーにより多くの作業(yè)をもたらします。
- 要約
Brotliはすべてのブラウザーによって普遍的にサポートされていませんが、訪問者が最も頻繁に使用するブラウザを特定し、より速い負荷時間を提供することでニーズを満たすことが重要です。さらに、まだサポートされていないブラウザを使用している人の場合、これらのブラウザはGZIPの使用にのみ戻ります。これは、Win -Winの狀況です。
WordPress Brotli圧縮(FAQ)についての FAQ
BrotliとGZIP圧縮の違いは何ですか?
BrotliとGZIPはどちらもデータを圧縮するためのアルゴリズムですが、いくつかの重要な違いがあります。 Googleが開発したBrotliは、GZIPよりも優(yōu)れた圧縮率を提供する新しいアルゴリズムです。これは、ファイルを小さくすることができることを意味し、ウェブサイトの読み込みをスピードアップできます。ただし、BrotliはGZIPほど広くサポートされていないため、すべてのブラウザーやサーバーで実行されない場合があります。
Brotli圧縮はWebサイトのパフォーマンスをどのように改善しますか?
Brotli圧縮は、Webサイトを構(gòu)成するファイルのサイズを縮小することにより機能します。これは、ユーザーがあなたのウェブサイトにアクセスするとき、ブラウザはより少ないデータをダウンロードする必要があることを意味します。これにより、ロードをスピードアップできます。読み込み速度が高速化すると、ユーザーエクスペリエンスが向上し、WebサイトのSEOにプラスの影響を與える可能性があります。
すべてのブラウザはBrotli圧縮をサポートしていますか?
Google ChromeやFirefoxを含む多くの最新のブラウザーが、Brotli圧縮がサポートされていますが、すべてのブラウザがサポートするわけではありません。たとえば、Internet ExplorerはBrotli圧縮をサポートしていません。したがって、Brotli圧縮を使用するかどうかを決定する場合、視聴者とその可能性のあるブラウザの使用を考慮することが重要です。
私のウェブサイトがBrotli圧縮を使用しているかどうかをテストする方法は?
WebサイトがBrotli圧縮を使用しているかどうかをテストするために、いくつかのオンラインツールがあります。これらのツールは、Webサイトにリクエストを送信し、応答を分析してBrotliを使用して圧縮されているかどうかを確認することで機能します。
WordPress WebサイトでBrotli圧縮を使用できますか?
はい、WordPressサイトでBrotli圧縮を使用できます。ただし、Brotli圧縮の実裝は、サーバー構(gòu)成の変更が必要なため、他のタイプの圧縮よりも複雑になる場合があります。また、WordPress WebサイトにBrotli圧縮の実裝に役立つプラグインもいくつかあります。
Brotli圧縮を使用する潛在的な欠點は何ですか?
Brotli圧縮は荷重時間を改善する可能性がありますが、潛在的な欠點がないわけではありません。まず、他の圧縮方法(GZIPなど)ほど広くサポートされていません。これは、すべてのブラウザーまたはサーバーで実行されない可能性があることを意味します。さらに、Brotli圧縮により、他の方法よりも多くのリソースが消費される場合があり、サーバーを遅くする可能性があります。
Brotli圧縮はどのように機能しますか?
Brotli圧縮は、データの冗長性を見つけて削除することにより機能します。一般的に使用される?yún)g語とフレーズの辭書を使用して、複製データをより短い表現(xiàn)に置き換えて、データの全體的なサイズを削減します。
Brotli圧縮は私のウェブサイトSEOに影響しますか?
はい、Brotli圧縮はあなたのウェブサイトSEOにプラスの影響を與える可能性があります。これは、ウェブサイトをランキングするときに検索エンジンが考慮している要因の1つが時間を読み込んでいるためです。 Webサイトファイルのサイズを縮小し、負荷速度を上げることにより、Brotli圧縮はWebサイトのSEOを改善するのに役立ちます。
Brotli圧縮は、あらゆる種類のWebサイトに適していますか?
Brotli圧縮は、多くの種類のWebサイト、特に大量のテキストデータ(ブログやニュースサイトなど)を持つウェブサイトに利益をもたらす可能性があります。ただし、多くのマルチメディアコンテンツを含むWebサイトにとってはあまり有益ではない場合があります。そのようなコンテンツはしばしば過大評価されており、Brotliを使用すると大幅なサイズの削減が見られない場合があります。
サーバーにBrotli圧縮を?qū)g裝する方法は?
サーバーにBrotli圧縮を?qū)g裝するには、通常、Brotli圧縮を有効にし、ファイルタイプを圧縮するためにサーバーの構(gòu)成ファイルを変更する必要があります。正確なプロセスは、サーバーのオペレーティングシステムと使用しているWebサーバーソフトウェアによって異なる場合があります。
以上がWordPressに対するBrotli圧縮の効果の測定の詳細內(nèi)容です。詳細については、PHP 中國語 Web サイトの他の関連記事を參照してください。

ホットAIツール

Undress AI Tool
脫衣畫像を無料で

Undresser.AI Undress
リアルなヌード寫真を作成する AI 搭載アプリ

AI Clothes Remover
寫真から衣服を削除するオンライン AI ツール。

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中國語版
中國語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統(tǒng)合開発環(huán)境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











GITでWordPressプロジェクトを管理する場合、バージョンコントロールにテーマ、カスタムプラグイン、構(gòu)成ファイルのみを含める必要があります。 .gitignoreファイルをセットアップして、ディレクトリ、キャッシュ、および機密構(gòu)成のアップロードを無視します。 WebhooksまたはCIツールを使用して自動展開を?qū)g現(xiàn)し、データベース処理に注意を払います。共同開発のために2つのブランチポリシー(Main/Develop)を使用します。そうすることで、競合を回避し、セキュリティを確保し、コラボレーションと展開効率を改善できます。

WordPressテスト環(huán)境を使用して、正式に発売される前に新機能、プラグイン、またはテーマのセキュリティと互換性を確保し、実際のWebサイトに影響を與えないようにします。テスト環(huán)境を構(gòu)築する手順には、次のものがあります。ローカルサーバーソフトウェア(LocalWP、XAMPPなど)のダウンロードとインストール、サイトの作成、データベースと管理者アカウントの設(shè)定、テスト用のテーマとプラグインのインストール。正式なWebサイトをテスト環(huán)境にコピーする方法は、プラグインを介してサイトをエクスポートし、テスト環(huán)境をインポートし、ドメイン名を置き換えることです。それを使用する場合、実際のユーザーデータを使用せず、定期的に役に立たないデータのクリーニング、テストステータスのバックアップ、時間內(nèi)に環(huán)境のリセット、および違いを減らすためにチームの構(gòu)成を統(tǒng)合することに注意を払う必要があります。

Gutenbergブロックを作成するための鍵は、その基本構(gòu)造を理解し、フロントエンドリソースとバックエンドリソースを正しく接続することです。 1.開発環(huán)境の準備:ローカルWordPress、node.js、 @wordpress/scriptsをインストールします。 2。PHPを使用してブロックを登録し、JavaScriptを使用してブロックの編集ロジックを定義します。 3. npmを介してJSファイルを構(gòu)築して変更を行います。 4.問題に遭遇したときにパスとアイコンが正しいかどうかを確認するか、リアルタイムのリスニングを使用してビルドを使用して、繰り返し手動コンパイルを避けます。これらの手順に従って、シンプルなグーテンバーグブロックを段階的に実裝できます。

WordPressでは、カスタム記事タイプを追加したり、固定リンク構(gòu)造を変更したりするときは、書き換えルールを手動で更新する必要があります。この時點で、コードを介してflush_rewrite_rules()関數(shù)を呼び出して実裝できます。 1.この関數(shù)は、テーマまたはプラグインのアクティベーションフックに追加して、自動的に更新できます。 2。CPTの追加、分類、リンク構(gòu)造の変更など、必要に応じて1回のみ実行します。 3.パフォーマンスに影響を避けるために、頻繁に電話をかけないでください。 4。マルチサイト環(huán)境では、必要に応じて各サイトを個別に更新します。 5.一部のホスティング環(huán)境は、ルールの保存を制限する場合があります。さらに、[保存]をクリックして「設(shè)定>ピン留めリンク」ページにアクセスすると、自動化されていないシナリオに適した更新もトリガーできます。

tosetupredirectsinwordsusitheTheTheTheTheTheTheThe、LocateTethefileNyinyOursite’sRootDirectoryAnddRedireCtRulesabovethe

応答性のあるWordPressテーマデザインを?qū)g裝するには、まず、HTML5とモバイルファーストメタタグを使用し、header.phpにビューポート設(shè)定を追加して、モバイル端子が正しく表示されるようにし、HTML5構(gòu)造タグでレイアウトを整理します。第二に、CSSメディアクエリを使用して、さまざまな畫面幅でスタイルの適応を?qū)g現(xiàn)し、モバイルファーストの原則に従ってスタイルを書き込み、一般的に使用されるブレークポイントには480px、768px、1024pxが含まれます。第三に、畫像とレイアウトを弾力的に処理し、最大幅を設(shè)定します。畫像に100%を設(shè)定し、固定幅の代わりにFlexBoxまたはグリッドレイアウトを使用します。最後に、ブラウザ開発者ツールと実際のデバイスを介して完全にテストし、パフォーマンスを最適化し、応答を確保する

usingsmtpforwordpressemailsimprovesdeleverability andReliability comparedtothededefaultphpmail()function.1.smtpauthenticateswithyouremailserver、reducespamplacement.2.somehostsdisablephpmail()、makesmtpn devering

IntegrateThird-PartyApisIntOwordPress、次のようになります。
