WEBページにおいてパフォーマンスの表示速度を上げることはとても重要です。
Googleの調査したデータによると、ページの表示が3秒以上掛かったサイトに対して待たずに離脱してしまうユーザーの割合は53％以上とのこと。
この記事ではそんな重要な要素であるページ表示速度について、改善するためのいくつかの方法ををご紹介したいと思います。
これらに当てはまる方におすすめの記事となっています。これを読めばあなたのサイトの離脱率を下げる方法が分かりますよ。
パフォーマンスを最適化する時、クエリの最適化が頭に浮かぶものです。
なぜかというと、本当に動いているウェブには、データベース量がかなり大きくて、数百MBからGBまでにかかっているからです。
つまり、クエリ文は数十万のレコードがあるテーブルで抽出を実施しています。DBの抽出を実現する時、以下の方法がいくつか適用しています。
まず、「Indexとは？」を説明したいと思います。 Indexとはデーター型の１つ種類であり、データ表にある一定のフィールドの値を含め、該当する行目（ロー）を指します。
では、Indexを貼ってからページ表示速度がどのように改善されるのでしょうか？
例：SELECT * FROM users where name = ‘Lempi Veum’;
56.000レコードがある「users」テーブルで「name」にIndexを貼らない場合とIndexを貼っている場合で抽出して、比較しましょう。
Indexを貼っている場合の速度はあきらかに早いですね。
そしてページ表示の速度を考慮する時、DB内のフィールドでIndexを貼るべきです（できれば、DBを構築する段階から）。またIndexを貼る時は、以下の段階に優先順位をつけて対応してください。
「The query cache stores the text of a SELECT statement together with the corresponding result that was sent to the client. If an identical statement is received later, the server retrieves the results from the query cache rather than parsing and executing the statement again. The query cache is shared among sessions, so a result set generated by one client can be sent in response to the same query issued by another client.」
上記の文章がMySqlのホームページで「query cache」を定義しているものです。
複数のユーザーが同じいページにアクセスする時、抽出結果が既にcacheに保持されておきました。
そのため、他のユーザーはそのページにアクセスすると、cacheからクエリした結果を出してページの表示速度が速くなっていきます。
詳細な方法はこちらでご参考ください。
しかし MySql 5.7.20バージョンからは、query cacheが使えなくなります。 MySql 8.0バージョンから完全に除外されることになります。
その他の方法はLaravel等のフレームワークを使ってください。 cache queryを保存する為に、既にサポートしているので、とても便利です。
| 123 | $posts = Cache::remember(‘index.posts’, 30, function() {return Post::with(‘comments’, ‘tags’, ‘author’, ‘seo’)->whereHidden(0)->get();}); |
DB内の抽出を最適化にしても、ページ表示速度があまり改善されない場合、どうすれば良いでしょうか。
今の課題で対応した方法（ロジック）を変更する方向で検討してみてください。
例えば、あるシステムの集計機能を実装しています。日間や年間をかけて膨大なデーター量で抽出しないといけません。
その時、リアルタイムにてデーター集計は大変ですよね。
一方、Cronjなら毎日・毎年等の集計が何かの作業で定期に実行され、結果を保存することができるのです。
これで、実行に時間がかかる作業は裏で実施されると思います。つまり、ユーザーが短時間で集計の結果を見ることができるということです。
このように、時間がかかるのにリアルタイムで不要になる作業は裏（underground）で実施した方が良いと思います。
cronjobを導入する前にDBのCPUの消耗
cronjobを導入した後DBのCPUの消耗
現在、ウェブサイトのほとんどがフレームワーク（Laravel, WordPress, CakePhp, …）で開発されています。
フレームワークなら既に最適化されているので、このメリットを活躍すれば工数が非常に削減できると思います。
Laravelで利用する場合、以下のいくつかポイントをオススメします。
Laravel の既存コマンドを使ってキャッシュをコンフィグする：
php artisan config:cache
php artisan route:cache
php artisan view:cache
LaravelはDBを対応する時、素晴らしいORMを提供しています。
EloquentのようにDBの各テーブルからabstracts modelを作られます。
Eloquentはeager loadingを利用する時、連携されているobject modelを全て抽出し、最初のクエリにレスポンスする為です。これはアプリケーションのレスポンスを追加されます。
Lazy loadingは次のようにクエリします。
| 1234 | $books = App\Book::all();foreach ($books as $book) {echo $book->author->name;} |
同様に、 eager loadingは次のようにクエリします。
| 1234 | $books = App\Book::with(‘author’)->get();foreach ($books as $book) {echo $book->author->name;} |
Laravelではパフォマンスを最適化する時、RAMの中にCacheとsessionを保存するのが一番良い方法です。
その他に、「Redis」 や「MemcachedCache」を利用すると、sessionの抽出する速度も改善できます。
Laravelでは、Laravel Mixを提供して、複数のcss/jsを同一のcss/jsにコンパイルするツールです。
そして、css/jsファイルを読み込む時、時間を短縮することができます。
いかがでしょうか。WEBのページ表示速度を改善する方法について紹介していきました。
勿論、本日紹介紹介した方法以外にもパフォーマンスを最適化する方法が様々あります。
実用に応じて、相応しい方法を簡単に探して利用していくようにしましょう。
パフォーマンスの最適化は大切な作業でウェブサイト開発から稼働にかけてずっと対応し続ける必要があります。今回紹介した方法を参考にぜひWEBのページ表示速度を改善してみてはいかがでしょうか。
dehaでは、５年ほど前から、ベトナムオフショア開発を行っています。
ベトナムでオフショア開発を行う際の費用や、エンジニアの質を知りたい方は、無料で見積もりいたしますので、お気軽にお問い合わせください。
参考サイト
近年、AI技術の進化とともに、業務効率化やサービス向上を目的とした「AIエージェント」の導入が急速に進んでいます。 弊社でも、この流れを受けてAIエージェントの導入を進め、多くの現場で業務の質とスピードの両立を実現することができました。 この記事では、実際に弊社が取り組んだAIエージェントの活用事例を紹介しながら、AI導入によるメリットとその可能性についてご紹介いたします。 AIエージェントが気になる方 AIエージェントの事例が知りたい方 社内の人材不足にお悩みの方 これらに当てはまる方におすすめの記事となっています。これを読めばAIエージェントの成功事例が丸わかりですよ。 (more…)
近年、業務効率化や顧客対応の高度化を目的として、企業や自治体、教育機関など多くの組織で「AIエージェント」の導入が進んでいます。 AIエージェントとは、人工知能を活用して自動的に応答や処理を行うシステムの総称で、チャットボットやバーチャルアシスタント、RPA（Robotic Process Automation）などが含まれます。 しかしながら、AIエージェントの導入には多くの期待が寄せられる一方で、現場ではさまざまな課題に直面するケースも少なくありません。 この記事では、AIエージェント導入によくある課題とその解決方法について、具体的に解説していきます。 AIエージェントに興味がある方 AIエージェントの導入に不安がある方 社内の人材不足にお悩みの方 これらに当てはまる方におすすめの記事となっています。これを読めばAIエージェントの特徴がわかるのはもちろん、うまく活用するための方法もわかりますよ。 (more…)
近年、AI技術の進化により、私たちの生活やビジネスのあらゆる場面で人工知能（AI）が活用されるようになっています。 その中でも注目されているのが「AIエージェント」です。音声アシスタント、チャットボット、カスタマーサポートなど、さまざまな場面で導入が進むAIエージェントは、業務効率化やユーザー体験の向上に大きな可能性を秘めています。 この記事では、AIエージェントの基本的な定義から、その特徴、導入メリット、さらに活用事例や今後の展望までを網羅的に解説します。 AIエージェントが気になる方 社内の人材が不足している方 これらに当てはまる方におすすめの記事となっています。これを読めばAIエージェントの特徴や具体的な活用メリットがわかりますよ。 (more…)
AI（人工知能）は、世界各国の経済成長を支える基盤技術として注目されています。 とりわけベトナムでは、政府が国家戦略としてAIの導入を明確に位置づけ、経済、教育、公共行政、スタートアップ育成まで多岐にわたる分野で取り組みを強化しています。 この記事では、「ベトナムAI経済2025年」レポートをもとに、マクロ経済との接続性、国家戦略、セクター別の導入状況、スタートアップ・投資動向、そして将来の展望について解説します。 ベトナムのAIが気になる方 最新のベトナムの経済動向が気になる方 社内のIT人材が不足している方 これらに当てはまる方におすすめの記事となっています。これを読めばAIがもたらすベトナム経済の進化と、その背景にある政策と市場構造を総合的に理解することができます。 (more…)
近年、開発現場では「品質」「スピード」「セキュリティ」のすべてを高次元で実現することが求められています。 特に、高度な専門性や情報セキュリティが重要視される分野では、国内同様の品質と体制が前提となります。 そんな中、「No-BrSEオフショア開発」をご紹介します。 これは従来のオフショア開発におけるブリッジSE（BrSE）を介さず、日本語で直接やり取りができる完全日本語対応のラボ型開発チームを導入するモデルです。 この記事ではそんなNo-BrSE開発の特徴、メリット、適した活用シーンまでを詳しく解説します。 No-BrSEオフショア開発が気になる方 社内のIT人材が不足している方 開発の品質を高めたい方 これらに当てはまる方におすすめの記事となっています。これを読めばNo-BrSEオフショア開発のメリットや活用方法が丸わかりですよ。 (more…)
近年、開発コスト削減やリソース確保を目的として「オフショア開発」を導入する企業が増えています。 その中でも開発スタイルとして注目されているのが「請負型（受託型）」の契約形態です。 この記事では、請負型の基本的な概要から、メリット・デメリット、向いているプロジェクトの特徴、活用シーンまでを徹底解説します。 オフショア開発が気になる方 請負型について気になる方 社内のIT人材が不足している方 これらに当てはまる方におすすめの記事となっています。これを読めばオフショア開発の請負型について メリットデメリットがわかるだけでなく活用できるシーンまで丸わかりですよ。 (more…)