Vue のパフォーマンス
Virtual DOM、リアクティビティの最適化、v-once、v-memo、lazy loading、code splitting、bundle サイズ
1Vue における Virtual DOM とは何ですか？
Vue における Virtual DOM とは何ですか？
回答
Virtual DOM は、実際の DOM ツリーの軽量な JavaScript 表現です。Vue は Virtual DOM を使用して、パフォーマンス面でコストの高い直接的な DOM 操作を最小限に抑えます。状態が変化すると、Vue は新しい Virtual DOM を作成し、それを古いものと比較し（差分アルゴリズム）、その後実際の DOM に必要な変更だけを適用します。このアプローチは DOM 操作の回数を大幅に削減し、特に更新が多い複雑なアプリケーションでパフォーマンスを向上させます。
2ref() と shallowRef() の主な違いは何ですか？
ref() と shallowRef() の主な違いは何ですか？
回答
ref() はすべてのネストされたプロパティもリアクティブになる深いリアクティブ参照を作成しますが、shallowRef() は .value プロパティ自体だけをリアクティブにします。shallowRef() では、オブジェクト内部の深い変更は更新をトリガーしません。リアクティビティをトリガーするには .value 全体を置き換える必要があります。shallowRef() は、深いリアクティビティが不要な大きなデータ構造でパフォーマンスを最適化する場合や、外部の状態管理システムを統合する場合に役立ちます。
3v-once ディレクティブの役割は何ですか？
v-once ディレクティブの役割は何ですか？
回答
v-once ディレクティブは、要素とその子要素を最初のレンダリング時に一度だけレンダリングし、その後のすべてのレンダリングでは静的なコンテンツとして扱います。これは、データが変化しても要素が決して更新されないことを意味します。このディレクティブは、バナー画像、ロゴ、動的な更新を必要としないテキストなど、初回マウント後に決して変化しない静的コンテンツのパフォーマンスを最適化するのに役立ちます。
Vue 3.2+ で導入された v-memo ディレクティブはどのように動作しますか？
Vue における markRaw() の目的は何ですか？
+19 面接問題