こんにちは！happy-analysis.com 運営チームです。
当サイトでは、最新のテクノロジーやAIを活用した分析・効率化について発信していますが、今回はその実践編。私が運営している別のWebサービス「テニスパーク・コミュニティ（tennis-park-community.com）」を舞台に、AIエディタ「Cursor」を使ったパフォーマンス改善の検証レポートをお届けします。
実はこのテニスパーク、以前の開発レポートでも紹介した通り、プログラミングの大部分をAIとの対話で構築しています。
「AIで作ったサイトは、その後のメンテナンスや最適化もAIで完結できるのか？」
Googleの診断ツール「Lighthouse」の厳しい指摘を、Cursorに丸投げしてどこまでスコアが回復するか試してみました。
そもそも「Lighthouse（ライトハウス）」とは？
Webサイトを運営しているなら避けては通れないのが、Googleが提供する無料の健康診断ツール「Lighthouse」です。
URLを入力するだけで、以下の4項目を100点満点で採点してくれます。
- パフォーマンス（表示速度の快適さ）
- ユーザー補助（誰でも使いやすいか）
- おすすめの方法（セキュリティやベストプラクティス）
- SEO（検索エンジンに正しく評価されるか）
いわば、Googleによる「Webサイトの通信簿」です。
衝撃の診断結果：SEOは満点、でもパフォーマンスが……
さっそく、現在のテニスパーク・コミュニティを診断した結果がこちらです。
SEOは100点満点！……なのですが、肝心のパフォーマンスが「68点」。 オレンジ色の警告が表示される、少し残念な結果になりました。
PC版での検証結果も掲載しておきましょう。
モバイル版よりも増しとはいえ、パフォーマンに問題アリっぽいです。
いろいろ指摘はあるもののまずは簡単そうな画像に関する改善を実施してみたいと思います。
「画像配信を改善する —— 推定される削減サイズ 75 KiB」
どうやら、画像ファイルのサイズや読み込み設定に甘さがあるようです。画像のダウンロードに時間がかかると、ユーザーがページを開いた際に「表示が遅いな……」というストレスを与えてしまいます。
Cursor（AI）に「丸投げ」して修正してみた
普通ならここで「画像の形式を一つずつWebPに変えて、リサイズして、コードを書き換えて……」と気が遠くなるような手作業が待っていますが、今回は**AIコードエディタ「Cursor」**にLighthouseの診断結果をそのまま伝えました。
すると、Cursorから驚くほど具体的で的確な「3つの改善プラン」が提案されました。
たった一言、「これらを実施してください」と伝えてみました。
おぉ～、すごい。ものの数分で作業完了。
これ、人間が一つずつチェックして修正していたら数時間はかかりそうな内容です。しかし、Cursorなら「実行して」と一言伝えるだけで、これらの修正を自動で完了させてくれました。
【結果発表】スコアはどこまで回復したか？
あれ？スコアが全然改善されない。むしろ悪化した・・・・
この理由を聞いてみると、「Lighthouseのスコアは、通信環境やサーバーの応答速度にも左右されますが、おっしゃる通り画像以外の要因もスコア（特に「パフォーマンス」と「ユーザー補助」）に大きく影響しています。」とのことでした。
じゃあ、画像部分の改善だけでなくて、まるっと対策をお願いしてみよう。
こちらにまるっと、対策をしてもらいます。
と書いてたら、もう終わってる！
さてさて、スコアはどうなっているでしょう？？ドキドキ。
少し改善しましたが、まだまだですね。まだインサイトにこのような表記があります。
【最終結果】スコアはどこまで回復したか？
この事実を伝えてもう一度、トライしてもらおう。もっと詳しく、指標の数字も共有してお願いしてみました。
やはりいろいろ判断するにあたり情報が多い方がよいですよね。数回のラリーを経て、最終的に驚くべき結果が出ました。モバイル版・PC版ともに、劇的な改善を遂げています。
📱 モバイル版：合格圏内の「90点」へ！
もっとも改善が難しいとされるモバイル版ですが、驚きの伸びを見せました。
💻 デスクトップ版：ほぼ完璧な「92点」へ！
もともと比較的高めだったPC版も、最適化によってさらに安定感が増しました。
指示を一度出しただけで、いきなり最高スコアに到達したわけではありません。修正を適用した直後、特定のページでスコアが伸び悩んだり、逆に数値が下がってしまう場面もありました。
しかし、ここからがAI開発の真骨頂です。 なんといっても、南海頼んでも嫌なかも一つしないですからね。伸び悩んだスコアの結果を再びCursorに伝え、「なぜ数値が改善されないのか？」を一緒に分析しました。
- 「画像の優先順位（priority）が一部競合しているようです」
- 「このコンポーネントの読み込みを遅延させましょう」
このように、AIから返ってくる具体的なフィードバックをもとに、一歩ずつボトルネックを潰していきました。まさに、AIと対話を繰り返しながらサイトを磨き上げていく感覚です。できるだけたくさんの情報を渡してあげたいのだけど、改善は一つずつの方がよい、という感覚でした。
ポイントはこれだった気がします。
- 一つずつ修正する
いっぺんに複数の修正をすると何が効いているのかわからない。 - できるだけ情報を渡す
修正点を絞ったうえでそれに関係する情報をできるだけ多く渡す。
まとめ：AIは「最高のエンジニア」であり「最高のコンサルタント」
今回の検証で、AI（Cursor）は単にコードを書くだけでなく、Lighthouseのような外部ツールの指摘を深く理解し、「どう直せばパフォーマンスが最大化するか」を戦略的に提案・実行してくれることが証明されました。
たとえ一度の修正で100点が出なくても、AIと対話を重ねることで、着実に「正解」へ近づくことができます。
- Lighthouseで課題を見つける。
- Cursorに解決案を作らせ、納得いくまで調整する。
このサイクルを回すだけで、個人開発のサイトでもプロレベルの最適化が可能です。皆さんも、ご自身のサイトをAIと一緒に磨き上げてみてはいかがでしょうか？
コメント