他のサイトとは異なる外観を目指して試行錯誤し、Facebook風のトピックモーダルを作成しました。私には読み込みが速く感じられ、デスクトップ環境でもよりスムーズに動作するようです。
ご意見をお聞かせください。
テスト用リンクは https://www.carptalk-online.co.uk/ です(デスクトップのみ対応)
他のサイトとは異なる外観を目指して試行錯誤し、Facebook風のトピックモーダルを作成しました。私には読み込みが速く感じられ、デスクトップ環境でもよりスムーズに動作するようです。
ご意見をお聞かせください。
テスト用リンクは https://www.carptalk-online.co.uk/ です(デスクトップのみ対応)
上手にできました!Facebookユーザーではない私でも、かなり気に入りました。あなたのサイト、かっこいいですね。![]()
あと、カープ(大きな魚)がこんなに巨大になるなんて知りませんでした!![]()
すごくクール!返信が20件以上のトピックでテストしましたか?スクロールすると投稿のさらに多くの「ページ」を読み込むのがそのタイミングで、私の経験では、この種の代替ビューの最大の複雑さの一つです
いいえ、今これをしてから報告します
問題なく動作します - URL 削除済み
ページが読み込まれる様子はあなたのおっしゃる通りに見えますが、期待通りに動作しています
ダイレクトリンクをクリックしても、トピックはモーダルウィンドウに表示されません。ただし、トピックリストからは正常に動作します。
ああ、それは次に調べないといけないことだけど、ずっと考えてたんだ。それって重要なの? Facebookの動作と同じだよ。直接リンクをクリックすると実際の投稿に飛び、ブラウジング中にクリックするとモーダルが開く。
面白い概念ですね。古いメッセージを読み込みながら、新しいメッセージのためにメッセージバスとの接続を安定して維持できますか?
はい、その通りです。モーダルはトピックのカスタムコピーをレンダリングするのではなく、iframe内に通常のDiscourseトピックアプリケーションを読み込むためです。iframeは独自のMessageBus接続を確立し、Discourseは古い投稿の読み込みや新規投稿の受信を含む投稿ストリームを通常通り処理し続けます。
また、親ページもその背後でアクティブな状態を維持するため、技術的にはモーダルが開いている間、2つのDiscourseインスタンスと2つのMessageBus接続が存在することになります。これは機能しますが、完全にネイティブな実装に比べて少しリソース消費が大きくなります。モーダルを閉じると、iframeとその接続が削除されます。
それが問題になるかどうかはわかりませんが、私はFacebookを使っていません ![]()
ただ、リンクをクリックしてもトピックがモーダルで表示されないことに少し驚きました。ちょうどモーダルで動作することを実証するために投稿されたはずなのにです。
私の最初の投稿はホームページへのリンクでしたよ。クリスにトピックをテストしてもらうための私の返信をクリックしました?haha。ところで、どうしていますか?しばらく会っていませんね
モバイル版の作成が完了し、動作に満足しています。次は、より良い方法を見つけてロード速度を改善する必要があります。何かアドバイスはありますか?
より多くのテストを行った結果、Googleが認識する非JavaScript版を使用しました。これにより、モーダル内での読み込みが瞬時に行われます。もしそのコンテンツを何らかの方法で活用できれば、この処理はさらに高速化できるでしょう。
PC版では非常に美しく見えます。
モバイル版の読み込み速度がやや遅く、クリックするとコンテンツのないページと右上隅の閉じるボタンしか表示されず、空白の画面を長時間待つ必要があるようです。
これが今取り組んでいることです
現時点では、まだ現実化させたいコンセプトに過ぎません。ただし、私のデバイスでは、Discourseのスピナーローディングアイコンが表示されながら、モバイルで2秒で読み込まれるので、何が起こっているのかよくわかりません。おそらく、サーバーがロンドン(英国)にあり、CDNがまだ設定されていないためでしょう。
確かに距離が遠すぎるので、ネットワークの伝送には時間がかかります
これでモーダル内でのトピックの読み込みが即座に完了するようになりました。次は、返信などで最初の Discourse 読み込みインスタンスを使用する方法を見つける必要があります(これはテストサーバー上です)。
メインサイトでこの機能をオフにしました。現在、ユーザーが登録するトラフィックが増えているため、テストサーバーに移動しました。モーダルに興味のある方がいる場合、8月中旬までに完了する予定です。