画面表示を高速化できるか検証してみた
Webサーバの機能を利用して、転送データの圧縮とサーバーサイドキャッシュを併用することで、WebFOCUSの画面表示時のレスポンスタイムが速くなるかを検証してみました。
今回利用した環境のスペック
Oracle Cloud に作成したインスタンス上で計測しました。
シェイプ | VM.Standard2.2 |
OS | CentOS 7 |
OCPU | 2 |
メモリ | 30GB |
Webサーバー | Apache HTTP Server 2.4 |
APサーバ | Apache Tomcat 8.5.41 |
WebFOCUS | 8.2.07.27.02 |
画面表示時のレスポンスを調べる
検証では、Apacheのモジュールを利用し、転送データの圧縮とサーバーサイドキャッシュの設定をした場合、していない場合とで、画面表示時のレスポンスに変化があるかを調べてみます。
使用したモジュール
mod_deflate と mod_filter
画面表示時の転送データを圧縮する事で、転送量が削減され、ページ表示速度の高速化につながるかを確認
mod_expires
画像ファイルなど静的なファイルをキャッシュすることで、ページの表示速度の高速化につながるかを確認
モジュールの確認
モジュールがダウンロードされているか確認します。vimコマンドを使って「00-base.conf」を開きます。
vim /etc/httpd/conf.modules.d/00-base.conf
以下の記述があるか確認します。記述がなければ追加、コメントアウトされていれば外します。
LoadModule deflate_module modules/mod_deflate.so
LoadModule filter_module modules/mod_filter.so
追加、コメントアウトを外した場合はApacheを再起動します。
service httpd restart
モジュールの設定
モジュールの設定を記述します。vimコマンドを使って「httpd.conf」を開きます。
vim /etc/httpd/conf/httpd.conf
以下の記述を追加します。
FilterDeclare COMPRESS
DeflateCompressionLevel 1
FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m#^text/#i"
FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m#^application/(javascript|json|xml|xhtml+xml|rss+xml|atom+xml|rss+xml|vnd.ms-fontobject|x-font-ttf)#i"
FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} =~ m#^image/(svg+xml|vnd.microsoft.icon)#i"
FilterProvider COMPRESS DEFLATE "%{CONTENT_TYPE} = 'font/opentype'"
FilterChain COMPRESS
FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no
「DeflateCompressionLevel 」の数値を大きくする事で圧縮率が高くなります。(設定可能な数値:1~9)
ただし、圧縮率を上げるとCPUの負荷も高くなるため、サーバーリソースを考慮したうえで数値を設定します。
Apacheを再起動します。
service httpd restart
モジュールの確認
モジュールがダウンロードされているか確認するため「00-base.conf」をvimコマンドで開きます。
vim /etc/httpd/conf.modules.d/00-base.conf
以下の記述があるか確認します。記述がければ追加、コメントアウトされていれば外します。
LoadModule expires_module modules/mod_expires.so
追加、コメントアウトを外した場合はApacheを再起動します。
service httpd restart
モジュールの設定
モジュールの設定を記述します。vimコマンドを使って「httpd.conf」を開きます。
vim /etc/httpd/conf/httpd.conf
以下の記述を追加します。
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
Apacheを再起動します。
service httpd restart
検証内容
テストではデモデータを利用し、以下の3パターンで画面表示の計測を行いました。それぞれ5回ずつ実行し、画面表示時のレスポンスタイムを計測しています。
ホームページの表示
ログイン画面からログインし、「ホームページ」画面が表示されるまでを確認
ビジュアライゼーションページの表示
ビジュアライゼーションページですべてのコンテンツが表示されるまでを確認
DESIGNERの表示
「DESIGNER」でコンテンツ作成画面が表示されるまでを確認
また、転送データの圧縮とサーバーサイドキャッシュの設定は以下の組み合わせで検証しています。
検証 | 転送データの圧縮設定 | サーバーサイドキャッシュの設定 |
1 | なし | なし |
2 | なし | あり |
3 | あり | あり |
4 | あり | なし |
検証結果
転送データの圧縮とサーバーサイドキャッシュの設定がない場合、ある場合とで以下のようなテスト結果となりました。5回計測した際の平均タイムと最速タイムは以下のとおりです。
検証 | 1 | 2 | 3 | 4 | ||||
---|---|---|---|---|---|---|---|---|
平均 | 最速 | 平均 | 最速 | 平均 | 最速 | 平均 | 最速 | |
ホームページの表示 | 3.93秒 | 3.76秒 | 2.59秒 | 2.51秒 | 3.43秒 | 3.33秒 | 3.58秒 | 3.31秒 |
ビジュアライゼーションページの表示 | 13.11秒 | 10.12秒 | 9.68秒 | 7.12秒 | 13.58秒 | 9.10秒 | 11.49秒 | 8.82秒 |
DESIGNERの表示 | 10.53秒 | 6.28秒 | 4.44秒 | 4.33秒 | 6.88秒 | 6.09秒 | 5.95秒 | 5.86秒 |
まとめ
今回の計測では、サーバーサイドキャッシュのみを設定した場合が、WebFOCUSの画面表示時のレスポンスタイムが一番速い結果となりました。ただ、どちらもメリットとデメリットがあります。利用される状況やアプリケーションによっては変わる要素が多分にありますので、それぞれの特性を考慮しつつ自社環境でお試しください。
メリット | デメリット | |
転送データの圧縮 | 通信の帯域使用量を減らせることで画面表示のレスポンス改善が見込める場合がある | 大容量ファイルやもともと圧縮されているファイルの場合、圧縮してもサイズがあまり削減できない割に圧縮・解凍にCPUリソースを使うため、効果が期待できない場合がある |
サーバーサイドキャッシュ | 再度同じページを表示させる時に、以前表示した時より速くページを表示させることで画面表示のレスポンス改善が見込める場合がある | キャッシュを溜めすぎると、ブラウザの動作が遅くなる場合がある |
今回は、WebサーバにApache HTTP Server を利用した場合の検証でした。
IISにも同じように圧縮設定やキャッシュ設定がありますので、どのような結果になるか気になりますね。