[Apache]modpagespeedでWEBサービスを爆速化する

modpagespeedとは

modpagespeedとはApacheモジュールとして提供されているWEBのベストプラクティスを自動的に適用してくれるオープンソースのモジュールです。
このモジュールのよいところは、現在動いているプログラムに対して何も変更を加えなくても最適化してくれるところにあります。

現在10万以上のサイトに適用され、その数も日々増えていることでしょう。

具体的なベストプラクティスは以下のページで紹介されています。

modpagespeed

modpagespeedをサイトに適用してみた

適用前後のパフォーマンス検証を行うために、スピード測定ができるWEBサービスのGTmetrixを利用しました。
※GTmetrixとは、GoogleのPage Speed InsightsとYahoo のYSlowのスコアを同時に計測することができるWEBサービス
スクリーンショット 2013-05-18 20.48.34

[BEFORE]まず、適用前です。
スクリーンショット 2013-05-18 20.49.01

[AFTER]つぎに、適用後です。
スクリーンショット 2013-05-18 20.53.09

簡単なページでのテストですが、劇的に改善されています。

Page Speed Insights F grade B Grade
YSlow C grade A Grade
読み込み時間 1.39sec 1.05sec
ページサイズ 243KB 84.7KB
リクエスト数 11 8

modpagespeedのベストプラクティス

○画像ファイルの圧縮、最適化
○スタイル、スクリプトの結合、最小か
○外部ファイルの遅延ロード
などなど

modpagespeedをインストールしてみる

まずは、以下のリンクからサーバのOSやビット数別のrpmモジュールをダウンロードします。
https://developers.google.com/speed/docs/mod_pagespeed/download

ダウンロードしたら適用するサーバに配置しrpmコマンドをたたきます。

[root@www.web.server]# rpm   -Uvh    --test    mod-pagespeed-stable_current_x86_64.rpm 
警告: mod-pagespeed-stable_current_x86_64.rpm: ヘッダ V4 DSA signature: NOKEY, key ID 7fac5991
準備中...                ########################################### [100%]
[root@www.web.server]# rpm   -Uvh  mod-pagespeed-stable_current_x86_64.rpm 
警告: mod-pagespeed-stable_current_x86_64.rpm: ヘッダ V4 DSA signature: NOKEY, key ID 7fac5991
準備中...                ########################################### [100%]
   1:mod-pagespeed-stable   ########################################### [100%]
job 1 at 2013-05-18 20:52

そして、modpagespeedの設定ファイルが追加されていることを確認します。
※httpd.confでconf.d配下のconf拡張子がIncludeされていること、これがない場合は個別にIncludeしてください。

[root@www.web.server]# ls -ltr /etc/httpd/conf.d/
合計 80
-rw-r--r-- 1 root root   674  2月  3  2012 php.conf
-rw-r--r-- 1 root root   560  2月 16  2012 proxy_ajp.conf
-rw-r--r-- 1 root root   299  2月 24  2012 welcome.conf
-rw-r--r-- 1 root root   392  2月 24  2012 README
-rw-r--r-- 1 root root 45859  5月  2 04:41 pagespeed_libraries.conf
-rw-r--r-- 1 root root 15338  5月  2 04:41 pagespeed.conf

Apacheを再起動します。

[root@www.web.server]# /etc/init.d/httpd configtest
[root@www.web.server]# /etc/init.d/httpd restart

なんて簡単なの。

[WordPress]固定ページのカスタムテンプレートを作成する

カスタムテンプレートとは

WordPressで固定ページを作成する際に利用するテンプレートのことを指しています。テーマがtwentyelevenの場合、テンプレートは以下のディレクトリに配置されています。

${WP_HOME}/wp-content/themes/twentyeleven/

初期状態ではデフォルトテンプレート, Showcase Template, Sidebar Templateがありますが今回はこちらに新規テンプレートを追加します。

新規作成方法

1. ${WP_HOME}/wp-content/themes/twentyeleven配下にtest.phpを配置します。
2. test.phpのヘッダーに以下を追加します。

<?php
/**
 * Template Name: Test Template
 */

3. test.phpをカスタマイズします。

新規テンプレートを利用した固定ページの作成方法

ADMINのダッシュボードから固定ページを選択し、新規作成か既存の固定ページを編集します。そして、ページ属性のテンプレートのドロップダウンリストに「Test Template」が追加されていることを確認してください。以上となります。

[Home Server]Jetpackでアクセス解析

サイトアクセス解析

Google Analyticsがアクセス解析としてメジャーですが、WordpressのプラグインであるJetpackを導入してみました。正確にはWordpress.com StatsというプラグインがJetpackに含まれているようです。

At A Glance

デイリーのアクセス数が確認できます。棒グラフにフォーカスをあてたとき、その日に投稿があれば書いた記事が確認できます。

Referres

どこからアクセスがきたのかがわかります。

Top Posts & Pages

どの記事が参照されたのかが確認できます。

Search Engine Terms

Google等検索エンジンからきたときの検索ワードが確認できます。

Clicks

記事内のリンクがクリックされた場合にどのリンクがクリックされたのかを確認できます。

Subscriptions

まとめ

オンタイムで更新されるので、見てるだけで面白いです。

[Home Server]WordPressをFTPで更新する

WordPressの更新

WordPress本体やプラグインの更新を今まではZipをWordPressのサイトから落としてディレクトリごと置き換えて更新していたのですが、さすがに煩雑なのでWordpress管理画面からFTPで更新できるように設定してみる。

サーバ:Mac OS X Server 10.6.8

手順は以下の通りです。

1. FTPプロセス起動
2. ポート解放
3. FTP baseディレクトリの設定
4. ディレクトリの所有者の変更
5. ディレクトリの所有者の戻し
6. ポート閉塞

1. MacでFTPの設定をしていなかったので、FTPプロセスを起動します。
デフォルトでFTPユーザが無効になっているので、有効にします。/etc/ftpuserを以下のように書き換えました。(administratorを有効にした。)

# list of users disallowed any ftp access.
# read by ftpd(8).
#Administrator
#administrator
root
uucp
daemon
unknown
www

次にMac OS X ServerはGUIでプロセスの起動ができるので、「サーバ管理」からFTPを起動します。

2. FTPポートを解放する必要がある。Routerの機能でポートの制御をしていて「well-knownポート」と呼ばれるポートは解放していないので、解放する。基本的に「well-knownポート」は十分な対策をとっていない環境では開けっ放しは怖いのであくまで更新するときの一時的な解放となります。

3. ${WP_HOME}/wp-config.phpに以下の三行を追加

define('FTP_BASE', '/<your path>/wordpress/');
define('FTP_CONTENT_DIR', '/<your path>/wordpress/wp-content/');
define('FTP_PLUGIN_DIR', '/<your path>/wordpress/wp-content/plugins/');

※your pathの部分は環境に依存します。

4. FTP更新するときは一時的にWWWユーザに所有者をかえてやる必要があるので以下のコマンドを発行します。

sudo -R _www:_www <your path>/wordpress

以上の設定が終わり次第、Wordpress管理画面からWordpress本体やテーマやプラグインの更新を行います。

5. 以下のコマンドを発行して所有者をもとに戻してやります。

sudo -R <user>:<group> <your path>/wordpress

6. Router管理画面からFTPポートを塞ぎます。

以上です。これで、Zipをネットからダウンロードして更新するより、だいぶ運用コスト削減!!

[Server]外出先から自宅PCへリモート接続

用意する機器・サービス

機器・サービス 説明
WHR-G301N VPN機能がある無線ルータ
Serverマシン(iMac/Mac Mini Server) LAN内にある外出先から接続したいマシン
Clientマシン(Mac Book Air/iPhone 4S) LAN外から自宅LAN内へアクセスするマシン
dynDNS 動的に割り当てられるIPアドレスと、そのホスト名の対応を、動的に登録・管理する仕組みである。(from wiki)

dynDNSへ登録

まずdyndnsへアクセスしアカウントの作成を行います。(https://account.dyn.com/entrance/)

MyeService → DynDNS Hostsと選択してホスト名の登録を行います。

これでホスト名の登録は完了です。

常にホスト名でアクセスできる仕組みを構築

これでホスト名指定でWANから見た自分のIPアドレスへのアクセスできる仕組みが完成しましたが、これではまだ不十分です。通常のプロバイダ契約では動的にIPアドレスが変化してしまうので、常にIPアドレスとホスト名をひも付ける仕組みが必要となります。今回はその方法として無線ルータ親機の機能を利用します。
※MacではWhat’s UP!、WindowsではDiceというアプリケーションを利用して同様のことが実現が可能です。

まず無線ルータ親機の管理ページにアクセスし、Internet/LAN → DDNSと選択します。以下の画面に先ほどDynDNSに登録したデータを打ち込み設定するだけです。

VPNの設定

Internet/LAN → PPTPサーバと選択し、画面下部のPPTP接続ユーザの設定を行います。

前の画面に戻り、登録されていることを確認します。

画面上部の設定もあわせて行います。自宅での設定キャプチャーをのっけます。(LAN側のIPアドレス割当の箇所で警告が出ていますが問題になっていないので無視しています。)

WAN側からVPN接続

まず、iPhoneでの接続を確認します。
設定 → VPN → VPN構成を追加…と選択し、以下の通りに入力します。(PPTPを選択、サーバはdynDNSに登録したホスト名、アカウントおよびパスワードはPPTP接続ユーザの設定で入力した項目を入力します。)

設定が完了したら、作成した構成を選択した状態でVPNをONにします。

開始中となり、、、

状況が接続中となることとステータスバーに「VPN」にアイコンが出ることを確認したら完了です。

次に、MacBook Airでの接続を確認します。
システム環境変数 → ネットワークと選択し、左下の「+」を選択し新しいネットワークを作成します。インターフェースはVPN、VPNタイプはPPTP、サービス名は任意の名前を設定して作成を押します。(サーバアドレスはdynDNSに登録したホスト名、アカウント名にPPTP接続ユーザを入力し、認証設定の画面でパスワード認証を選択し、PPTP接続ユーザに対応するパスワードを入力してください。)

設定が完了したら接続ボタンを押下します。

接続中となり、、、

状況が接続済みとなることを確認したら完了です。

リモートアクセスを許可する

ここからは、サーバ(WANから接続したいマシン)の設定となります。
システム環境変数 → 共有を選択し、リモートログインとリモートマネージメントにチェックを入れておきます。

LAN内のIPアドレスを固定にする設定

システム環境変数 → ネットワークを選択します。
サーバマシンがどのようにネットワーク接続しているのかにもよりますが(EthernetかWi-Fi)、右下にある詳細…を選択します。そこでTCP/IPを選択してIPv4の構成のところを「DHCPサーバを使用(アドレスは手入力)」を選択し、IPv4アドレスを自分の設定したいアドレスを入力します。(ルーターのIP割り振りルールに従って振ってあげてください。)

固定されていることを確認するにはターミナルを開き以下のコマンドを入力します。
/sbin/ifconfig

en0またはen1のinetに設定したIPアドレスが表示されるはずです。
一通りサーバマシンがネットワークにつながっていることを確認したら、固定の設定は終了です。

LAN内にリモートデスクトップし接続確認

LAN内からでの相互リモートデスクトップは簡単ですよね。なので、割愛します。VPN接続すると擬似的にLAN内と同じネットワーク内にいるようになるのでLAN内にいるときと同じ方法で接続します。

これでネットにつながっている端末さえあればどこからでも家のPCにアクセスできる環境が構築できました。

[Mac]Lauchepadをショートカット起動する

Lauchpadとは

OS X Lionで追加された機能の一つで素早くアプリケーションにアクセスするためのランチャーです。

ショートカットを割り当てる方法

まず、システム環境変数→キーボード→キーボードショートカットからLaunchpadとDockを選択する。

Launchpadを表示にチェックボックスを入れ、右側のショートカットコマンド入力部分を編集。(デフォルトではブランクになっており、クリックすることで編集モードとなります。入力モードとなったところで割り当てたいショートカットを押すことで設定できます。)

※ここでは、ショートカットに「command + 2」を割り当てています。