共用サーバでも表示速度高速化！第3回CMSプロレス「表示速度改善」に出場しました

こんにちわ、バックエンドエンジニアのしょごたんです。

先日ロフトワーク様主催の「第3回CMSプロレス　ウェブサイト速度表示王決定戦」に気づいたら参加することになって参加してきました。

事前に本大会の企画を聞きつけウチのボスである小林の度々行われる参加確認リマインドとブランディング強化施策提案があったことと、
CMSプロレスは第一回の際MTチームで参加して優勝した実績があったためこれは負けられない戦いやでという気持ちに切り替え挑みました。

とはいえ実は参加が決まったのが開催日の4日前、予定工数で３人日の中でどうにかやりくりするという事態に陥っており、
内心どげんしてやろうかと右往左往したのは内緒です。

大会概要

お題となる名門女子大学津田塾大学の受験生向け特設ページをCMSで更新できるようにし、計測は「testMySite」を利用し表示速度を一秒でも早くしようという内容でした。

実際お題となるサイトを計測したところ19秒という結果、果たしてどれほど速度向上を図れるのであろうか。

施策方針

高層化施策ではフロントエンドとバックエンドでそれぞれの作業を行う必要があります。
高機能のサーバに設置すればその分処理は早くなりますが、今回はあえて共用サーバを利用しそこで行える作業でどれだけの軽量化を行えるかを方針としました。

• 使用画像ファイルの圧縮
• JSミニファイ
• CSSミニファイ、CSS一部最適化
• HTML最適化（JSの配置変更、余計なスペース、インデントの削除）
• gzipによるHTML、CSS、JS、フォントファイルの圧縮
• ブラウザキャッシュ設定
• CMSでアップロードされた画像の圧縮（ImageUploadUtilityプラグイン）
• cloudflare（フリーCDN）の導入
• cloudflareによるSSL化（SPDYとHTTP/2対応してるのでアクセス高速化）

共用サーバのためバックエンドで行える施策は限られてしまいます。
そのためフロントエンドでの施策を中心に行いました。

ソースを確認したところ重複しているCSSや不必要と思われる処理などがいくつか存在しました。
そのためソースの最適化を行いつつ使用画像の圧縮、Minify化を行いました。

加えて共用サーバでも行えるgzipやブラウザキャッシュ有効期限付与。
この時点で５秒程度をマークしていたのですがCMSから画像アップロードしたものを付与したところ
計測結果が8秒前後に落ち込んでしまいました。
そこでCDNを導入、加えて今回利用したcloudflareの機能によるSSL化によるHTTPS2を実現することで最速で２秒をマークする結果になりました。
こう見るとSSL化は今後サイト制作にあたって必須と言ってもいいですね。

↑事前準備中に叩き出した最速の2秒！

しかし若干キャッシュ周りで不安定なところがあり、大会当日は最速４秒〜５秒を維持する形となり2回戦敗退という結果になりました。

↑しかし本番は惜しくも3秒…

今回行った以外で試してみたい施策

今回共用サーバ縛りであったため実施できなかったものもいくつかありました。

• VPSやクラウドサーバなど環境を整えやすいサーバを利用（今回apacheだったのでnginxに変えてみたり）
• 画像optimaizeが可能なCDNのプラン、サービスの利用
• protli圧縮の採用
• mod_pagespeedの導入

でしょうか。

弊社メディアでこの辺を導入して結果を見ていきたいと思います。

まとめ

半ば共用サーバを利用というネタ勢レベルで速度向上施策になりましたが、
各社AWSなど高機能クラウドやCDNを利用している傾向を見る限り、低コストでも見合うものは展開できるということの証明ができたのは大きいのではないでしょうか。

もちろん高コストをかければその分安定するものは展開できますが、限られた中でも正しく施策を行う事で速度改善は見込めます。

また速度改善ではフロントエンド、バックエンドそれぞれで考慮した作業をする必要がありますので、
リニューアル時に速度改善を視野に置く場合はそれらを見越した形で制作、設計してください。

Webに関するお悩みごとはデジタルアイデンティティへ！

現在、様々な企業がWebサイトを活用して、デジタルマーケティングに取り組んでいます。
しかし、以下のようなお悩みがあるご担当者様も多いのではないでしょうか？

デジタルマーケティングに関するこんなお悩みはありませんか？

• 広告やSEOを始めたいがやり方がわからない…
• 自社に最適な広告媒体・施策を提案してほしい…
• 最新の広告手法も取り入れた提案をしてほしい…
• 短い期間で最速で成果に繋げたい…
• 目標設定・アクセス分析・サイト改善など、全部丸投げで対応してほしい…

株式会社デジタルアイデンティティは、Webの総合広告代理店です。

数ある施策の中からお客様にとって最適な施策のご提案と、企画・提案から実施・改善まで一気通貫で確かな実行力で、お客様のビジネス目標達成を強力にサポートいたします。

デジタルアイデンティティの強み

• お客様に最適なマーケティング手法をご提案
  Google、Yahooなどのリスティング広告をはじめ、Facebook、Instagram、LINE、tiktok、PinterestなどのSNS広告、ニュースやゲームなどの各種アプリへの広告配信、インフルエンサーマーケティングなど、あらゆる手法から最適な施策をご提案
• 全ての施策を一気通貫で対応可能
  ブランディングからアクセス分析、SEO・MEO対策、LPO、EFO、Webサイト制作、バナー・動画などのクリエイティブ制作まで、一気通貫で対応可能
• 高速PDCAでお客様の目標達成を最短で実現
  デジタルマーケティングでは施策実施後のPDCAが欠かせません。施策ごとにスピーディなPDCAを回すことにより、最適化・効率化を進めて成果を最大化

ご興味がある方は、ぜひ一度、弊社のサービス資料をご覧ください！

【無料】資料ダウンロードはこちらから