こんにちは！
この新機能には本当に興奮しています。このようなソリューションを待ち望んで久しいですが、Tecnoblog の読者からの初期フィードバックも素晴らしく、コミュニティ統合を大変気に入ってくれています。
しかし、実際の運用テストを経て、これを真にネイティブなコメントシステムとして感じさせるとともに、トラフィックの多いサイトでも持続可能にするためにクリアすべきいくつかの技術的課題が見えてきました。
現時点で見つかった点は以下の通りです：
1. パフォーマンスとサーバー負荷
フルアプリを埋め込んだ後、サーバー負荷が大幅に急増しました。Cloudflare のデータを見ると、リクエスト数が10 倍に増加していました。これを最適化するためのいくつかのアイデアがあります：
- 遅延読み込み（Lazy Loading）: JS の遅延読み込みを実装することで劇的に改善されます（私はすでにこのための回避策を適用しています）。
<script type="text/javascript">
DiscourseEmbed = {
discourseUrl: '<?php echo esc_url($discourse_url); ?>',
<?php if ($use_topic_id): ?>
// ID モード：データベースに保存されたトピック、URL 変更の影響を受けない
topicId: <?php echo intval($topic_id); ?>,
<?php else: ?>
// URL モード：API 経由での作成失敗時のフォールバック
discourseEmbedUrl: '<?php echo esc_url($permalink); ?>',
<?php endif; ?>
fullApp: true,
embedHeight: '800px',
};
(function() {
var container = document.getElementById('discourse-comments');
// ブラウザが IntersectionObserver をサポートしているか確認
if ('IntersectionObserver' in window) {
var observer = new IntersectionObserver(function(entries, observer) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
// div が画面内に入った時点でスクリプトをロード
loadDiscourse();
observer.unobserve(entry.target);
}
});
}, { rootMargin: "1500px" }); // div に到達する 1500px 手前でロード開始
observer.observe(container);
} else {
// 古いブラウザ向けのフォールバック
loadDiscourse();
}
function loadDiscourse() {
var d = document.createElement('script');
d.type = 'text/javascript';
d.async = true;
d.src = window.DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
}
})();
</script>
以下は、遅延読み込みを実装した後のリクエスト数の減少を示すものです（ウェブサイトの一部はまだキャッシュされているため、最終結果ではありません）：
-
ペイロードの削減: 埋め込み内で読み込まれるリソースを削減することは可能でしょうか？例：チャット URL や AI クレジットチェックのクエリが確認されましたが、これらは埋め込み表示に必要でしょうか？
-
リクエスト頻度: リアルタイムの POST リクエストがやや過剰です。埋め込み版ではポーリング頻度を下げることはできないでしょうか？
-
キャッシュ: トラフィックの急増に対応できるよう、埋め込みトピックのキャッシュ管理を改善する。
2. 分析データの混乱
現在、埋め込み部分で Google Analytics や GTM のスクリプトが発火しています。これによりページビューが倍増しています（投稿自体のヒットと、iframe のヒットの 2 回）。理想的には、システムが iframe 内であることを検知し、すべての追跡スクリプト（Discourse の分析スクリプトも含む）を自動的に無効化してくれると良いでしょう。
3. iframe の高さの問題
これはおそらく UX にとって最大の課題です。コメントがない投稿の場合、奇妙な空白の隙間が生まれます。長いスレッドがある場合、iframe は最初の 2〜3 件のコメントで切り捨てられ、「スクロール内のスクロール」を強制されます。これは特にモバイル環境では非常に問題があります。
Disqus のようなサービスと真に競合するには、高さ（コメント数に応じて）を動的に変更できるようにし、一定数の返信を超えた後にスレッドを展開する「もっと見る」ボタンが必要です。
4. プラグインの競合
埋め込みがすべてのアクティブなプラグインをロードするため、奇妙な動作が見られます。例えば、「Google One Tap」がブログ記事内に表示されてしまいます。ユーザーがログインすると、iframe がリフレッシュされ、コメントスレッドではなくコミュニティのホームページにリダイレクトされてしまいます。埋め込み表示に対して特定のプラグインを手動で無効化できる機能があれば、非常に助かります。
5. ログインの摩擦
現在のフローはコンバージョンを阻害しています：ユーザーがログインをクリック → 新しいタブが開く → ログイン完了 → ユーザーはコミュニティのホームページに留まる。ブログ記事に戻ると、ユーザーが手動でページ全体をリフレッシュするまで、iframe はまだログアウト状態のまま表示されます。これは混乱を招くループであり、人々はコメントする前に諦めて離脱してしまいます。
新しい埋め込み機能を有効にしてから、一日あたりの登録数が 2 倍以上に増加しましたが、これは素晴らしいことです。しかし、エンゲージメント指標は全く変化していません。むしろ、DAU/MAU が低下しました。ログインユーザー数は増えたものの、彼らは交流していません。「日次のアクティブユーザー」「新規投稿者」「投稿数」といった指標は増加していません。
これは、人々が会話に参加したいと望んでいる一方で、ログインのループに迷い込み、実際にコメントする前に投稿を離脱していることを証明しています。
6. モバイル UI
モバイルでは、返信ウィンドウが画面全体を占有するため、返信している会話の文脈をすべて失ってしまいます。少し閉鎖的な感じがします。これをよりコンパクトに保てるような改善があれば、大きな成果となるでしょう。
私はこれを Tecnoblog（および所有する他のサイト）のデフォルトシステムにしたいと本気で思っています。これらの点についてさらに詳しく議論したい場合は、お気軽にお知らせください！