Question 1

Qu'est-ce que le Virtual DOM dans Vue ?

Accepted Answer

Le Virtual DOM est une représentation JavaScript légère de l'arbre DOM réel. Vue utilise le Virtual DOM pour minimiser les manipulations directes du DOM, qui sont coûteuses en performance. Lors d'un changement d'état, Vue crée un nouveau Virtual DOM, le compare avec l'ancien (algorithme de diff), puis applique uniquement les modifications nécessaires au DOM réel. Cette approche réduit considérablement le nombre d'opérations DOM et améliore les performances, surtout pour les applications complexes avec de nombreuses mises à jour.

Question 2

Quelle est la différence principale entre ref() et shallowRef() ?

Accepted Answer

ref() crée une référence réactive profonde où toutes les propriétés imbriquées sont également réactives, tandis que shallowRef() ne rend réactive que la propriété .value elle-même. Avec shallowRef(), les mutations profondes dans l'objet ne déclenchent pas de mises à jour. Il faut remplacer entièrement .value pour déclencher la réactivité. shallowRef() est utile pour optimiser les performances avec de grandes structures de données où la réactivité profonde n'est pas nécessaire, ou pour intégrer des systèmes d'état externes.

Question 3

Quel est le rôle de la directive v-once ?

Accepted Answer

La directive v-once rend un élément et ses enfants une seule fois lors du premier rendu, puis les traite comme du contenu statique pour tous les rendus suivants. Cela signifie que même si les données changent, l'élément ne sera jamais mis à jour. Cette directive est utile pour optimiser les performances des contenus statiques qui ne changent jamais après le montage initial, comme des images de bannière, des logos, ou du texte qui ne nécessite aucune mise à jour dynamique.

Performance Vue

Qu'est-ce que le Virtual DOM dans Vue ?

Réponse

Quelle est la différence principale entre ref() et shallowRef() ?

Réponse

Quel est le rôle de la directive v-once ?

Réponse

Comment fonctionne la directive v-memo introduite dans Vue 3.2+ ?

Quelle est l'utilité de markRaw() dans Vue ?

Autres sujets d'entretien Vue.js / Nuxt.js

Fondamentaux JavaScript

JavaScript moderne (ES6+)

Les bases de Vue

Composants Vue

Vue Router

Pinia State Management

Vuex (Legacy)

Composition API

Réactivité Vue

Fondamentaux Nuxt

Data Fetching Nuxt

SSR & SSG Nuxt

Server Routes Nuxt

Modules Nuxt

Composables Vue

Formulaires & Validation Vue

Gestion d'état Nuxt

Testing Vue

Déploiement Nuxt & CI/CD

Patterns avancés Vue

TypeScript avec Vue

Authentification Nuxt

SEO avec Nuxt

Internationalisation Nuxt

Architecture Vue

Sécurité Nuxt

Écosystème Vue

Migration Vue 2→3 & Nuxt 2→3

Maîtrise Vue.js / Nuxt.js pour ton prochain entretien