javascriptまたはPHPを介したメニューの複製：SEOとページパフォーマンスのどちらが良いですか？
典型的なデスクトップドロップダウンメニューのあるサイトがあります。モバイルメニュー（およびタッチデバイス）では、javascriptを使用して、メニューボタンをタッチして右側からページ上にスライドさせます。
問題は、javascriptを使用してデスクトップメニューを複製し、非表示のサイドdivに入力することです。これは悪い考えですか？パフォーマンスの低下はあまり見られませんが（JSを無効にした場合は50ミリ秒程度）、遅いコンピューターで問題が発生する可能性はありますか？
または、メニューをPHPを介してサイドdivに複製して、ソースコードに直接配置する方が良いでしょうか。これを行うとおそらく高速になりますが、検索エンジンにナビゲーションを2回表示すると、SEOに影響が出るでしょうか？
http://searchengineland.com/tested-googlebot-crawls-javascript-heres-learned-220157 を見ると、既に2回クロールされているように見えるので、訪問者の全体的な経験とjavascriptを使用せずに複製します。
ページで同じメニューを複数回処理する場合のベストプラクティスは何ですか？
非常に完璧な方法は、 @mediaクエリ を使用して、解像度ごとに異なるCSSを使用することにより、両方のケースで1つのメニューを互換性のあるものにすることです。大きな利点は、どのデバイスがあなたのウェブサイトにアクセスしているか気にしないことです。ブラウザの幅に応じてその場でレイアウトを変更するだけです。
あなたのウェブサイトでコンテンツを複製したことは良くありません。そしてあなたが見るように、GoogleはあなたのJavaScriptを解析して取得することさえできます。 （驚いたことに、それを見せてくれてありがとう。）PHPを使用して2つのメニューのいずれかを表示すると、反応が悪くなります。つまり、幅が変わってもメニューを切り替えることができません。 @mediaクエリでできること。
たとえば、タブレットをポートレートモードでWebサイトにアクセスすると、折りたたみメニューが表示されます。横向きになったら、デスクトップバージョンを表示したいと思います。解像度がそれに合っていて、より快適だからです。ただし、2つのメニューがある場合はそうなりません。