コメント機能を Facebookから MT標準に切り替えた

こんにちは。コメント機能を Movable Typeの標準機能に戻した岩崎です。

リニューアルしたサイトでは、Facebook Comments Pluginを利用していたのですが、なんだかんだで Movable Typeの標準機能(mt-comments.cgi)を利用したコメント機能に戻しました。

色々と理由はあるのですが、最大の要因はページ自体の軽量化。通常利用では 特に問題のない速度ですが、ページの軽量化に伴い見逃せないリクエスト数となってきた為、mt-comments.cgiに切り替え。密かに、Facebookでの さらなるバイラル効果も期待していたのですが、この程度のコメント量では まったく意味はありませんでした。

コメント機能を Facebookから MT標準に切り替えたのメインビジュアル
今回、新規に作り直したコメント欄。思ってたよりもシンプルな見た目になって満足。

移行の理由

主な理由は、以下の通り。
4番目あたりは、かなりエゴ的な感じですが、1. 2. 辺りが特に大きな要因です。

  1. 高速化・軽量化
  2. 匿名コメントを許容したい
  3. レスポンシブに対応させたい
  4. コメントを資産として管理しておきたい

数行のコードを記載するだけで導入できるFacebook Comments Pluginですが、そこからのリクエスト数が非常に多いです。
ベースとなる Social Pluginsの sdk.jsを始め、30を超える JSや CSSが大量に読み込まれるため、ページの表示速度が気になっていました。

とは言え、かなり神経質に見た場合。
Facebookの強力なインフラ網に支えられている為、Disqusや Jetpackといった 類似サービスと比較しても 充分に実用的なレベルです。

Facebook Comments Plugin利用時のリクエスト状態。60以上のリクエストがあり画面に収まりきれず…。
MT標準機能に切り替える事で、リクエスト数は 60%以上の削減に成功。Loadも 0.5秒以内を達成。

ただ、軽量化を進めている 当ブログでは、全体リクエストの大半を占めているのも事実。
Chromeの Developer Toolsでみると、60以上のリクエスト数が発生。通常が 20程度なので、全体の 60%以上が Facebookによるリクエストという状態です。このリクエストをごっそり削除できると考えれば、かなり魅力的。


「コメントを見る」をクリックして後から読み込むようにする…といった案も検討しましたが、そもそも匿名コメントも許容したいという課題もあったので、mt-comments.cgiに戻ることにしました。

もちろん、なにかしらのサービスを利用しているユーザーからすれば、返信があった場合に 通知が来るといった機能も活用できるとは思うのですが、今回は軽量化を優先。そういったリテラシーが高い方には、Twitterや問い合せフォームといった手段もあるので、割り切ることにしました。

せっかくなので全て見直し

Movable Typeのテンプレートを利用する場合は、デフォルトの mt.jsを読み込み、コメント等のテンプレートモジュールを Includeすればスグに導入が可能です。

ただし、汎用的に使えるように作り込まれているため、ムダな処理が多すぎる…。
せっかく軽量化のために標準機能に切り替えるワケですから、既存の処理は利用せず全て作り直しました。コメント系のテンプレートはもちろん、mt.jsをデバッグして必要な部分のみを抽出。フロント側の処理も オリジナルで組み直しました。

その後、Facebookでのコメントを MT側に 手動で移行。
MTの管理画面ではコメントの日時が操作できないので、直接 mt_commentを修正。今のところ問題は出ていません。

フィードバックしやすい環境作り

こうして、リニューアル前のサイトのように、匿名でもコメントができるようになりました。
従来通り、メールアドレスの入力も不要。必須なのは、名前とコメントのみです。

ここまで許容してしまうと スパムコメントもヒドいのですが、そこは運用側でカバーしていく予定。
MTでも CAPTCHA機能や認証機能が利用できますが、これらもあえて外しています。

小規模な個人Blogごときで CAPTCHAとか…大げさすぎかなと。

…というのも、たかが 個人Blogにコメントするのに、イチイチ CAPTCHAとか ちょーぜつ面倒だなと。
表示スピードを改善する理由と同じですが、個人Blogレベルに 難読すぎる CAPTCHAとかでててきたら コメントをする気力が失せますし、ましてや、なにかしらのサービスに登録とか。実に意味が分かんないと考えています。

サイトを構築する側としては、どんな事でもフィードバックがある事が なにより嬉しい。
その為には、もっと気軽にコメントできる環境作りを心がけたいですし、このサイトで言えば 書き捨てるくらいの気軽さでも良いかなーと思っています。

書き込みやすさとスパムの量は 比例していくものですが、このサイト規模であればカバーできるものは運用で対応しつつ、極力コメントのしやすさ重視していく予定です。
もちろん、MT-Keystrokesの内部処理などを改修する等、見えない部分でのスパム対策は、日々強化を続けてはおりますが。


…ということで、生まれ変わったコメント機能を ぜひぜひ利用頂けますと嬉しい限り。
まだまだコメントの一覧性が悪い上に、ブラウザによっては動きが不安定ですが、今月いっぱい様子を見ながら改善していく予定です。それでは今日はこの辺で。^-^/~

関連記事:

Movable Type 本文入力欄の高さを変える

Movable Type 本文入力欄の高さを変えるのメインビジュアル
さくらのラピッドSSLで wwwが機能しないトラブルの解決
サイト名とドメイン名が異なる悩み