マークダウン記法をHTMLに変換して表示する時に、一瞬マークダウン記法が見えてしまう

Question

前提・実現したいこと

今回解決したいことは『マークダウン記法をHTMLに変換して表示する時に、一瞬マークダウン記法が見えてしまう』 ことです。

現在、LaravelにてMarked.jsを利用して、マークダウン記法での投稿機能を作成しようとしています。

そこで、マークダウン記法をデータベースに保存した後に、保存したテキストをHTMLに変換して表示したい時に、
データベースに保存したマークダウン記法のテキストを取得→bladeファイルに表示→Marked.jsを使ってHTMLに変換
という手順だと、一瞬、マークダウン記法（HTMLに変換前）のテキストが見えてしまいます。

例えば、teratail（当サイト）もマークダウン記法ですが、一瞬マークダウン記法が見えてしまうことはありません。

このような機能はどのように実現しているのか、どのようにすれば実現できそうかのアイデアを頂きたいですm(_ _)m

考えた方法

2つほど考えた方法があります。

①：最初にマークダウン記法を表示する時はcssでdisplay:none;などして、非表示にしておき、HTMLに変換後、noneを取り除いて、ユーザーが見えるようにする。

②：データベースに保存前にMarked.jsを通して、HTMLに変換してから、データベースに保存する方法。（つまり、データベースにはHTMLを保存する。）

この程度の方法しか、思いつかず、実際にWebアプリを開発するとしたら、どのような方法が一般的なのかと疑問に思っています。

アドバイスを頂けますと大変嬉しいです。

大変お手数をおかけしますが、何卒よろしくお願いしますm(_ _)m

Comments

[hoshi-takanori]

ブラウザ側でマークダウンを HTML に変換すると表示が切り替わるのは防げないでしょうけど、サーバー側で変換すれば大丈夫では。なお、編集することを考えると、データベースにはマークダウンを保存した方が良いと思います。

[howaito]

@hoshi-takanori さん
コメントありがとうございます！

アドバイス通り、サーバー側で変換させて頂きます！
ありがとうございます！！

Answer 1

そこで、マークダウン記法をデータベースに保存した後に、保存したテキストをHTMLに変換して表示したい時に、

データベースに保存したマークダウン記法のテキストを取得→bladeファイルに表示→Marked.jsを使ってHTMLに変換
という手順だと、一瞬、マークダウン記法（HTMLに変換前）のテキストが見えてしまいます。

JavaScriptを使わずに、PHP側でマークダウンをHTMLに変換して表示すればよいのではないでしょうか。

Comments

[howaito]

回答ありがとうございますm(_ _)m

アドバイス通り、サーバー側で変換することにさせて頂きました！

Answer 2

2はあり得ません。データの加工ですし、編集時に毎回正確に戻す必要がありますし、別カラムに保存するのも無駄です。
あくまで画面表示時の対応ですしね。

PHPにもマークダウンライブラリはあるので（Composerで導入できる）、そちらを使ってください。

Comments

[howaito]

回答ありがとうございますm(_ _)m

おかげでライブラリを使用して、対応できそうです！
ライブラリの存在を教えて頂きましたので、ベストアンサーとさせて頂きました。

ありがとうございました！

[m.ts10806]

teratailのマークダウンの形式参考になるんじゃないでしょうか。
Qiitaとかでもいいですけど。Githubとかでもいいですけど。