Leçons tirées de la rédaction de la prochaine version majeure de Vue.js

Publié par Evan You

Au cours de la dernière année, l'équipe Vue a travaillé sur la prochaine version majeure de Vue.js, que nous espérons publier au premier semestre 2020 (ce travail est en cours au moment de la rédaction de cet article). L'idée d'une nouvelle version principale de Vue est née fin 2018, lorsque la base de code de Vue 2 avait environ deux ans et demi. Cela peut ne pas sembler une période aussi longue dans la vie du logiciel, mais les idées du front-end ont beaucoup changé au cours de cette période.

Deux considérations clés nous ont amenés à écrire une nouvelle (et réécrire l'ancienne) version principale de Vue: tout d'abord, la disponibilité de nouvelles fonctionnalités JavaScript dans les navigateurs courants. Deuxièmement, les problèmes de conception et d'architecture dans la base de code actuelle, identifiés au fil du temps.

Pourquoi réécrire

Utilisation de nouvelles fonctionnalités linguistiques

ES2015, JavaScript — ECMAScript, ES — , . , , Vue.
Proxy, . Vue — , (state), DOM. Vue 2 , . Proxy Vue, , .

Proxy — , . — , .

Vue 2 , - . , (templates) , sourcemap . , Vue 2 , , DOM, , . , .

, , , . , , , . .

Vue 3 2018 . .

Typescript

Vue 2 ES. , . . Facebook Flow type checker, ES. Flow , , ; , . , , TypeScript Visual Studio Code.

, Vue TypeScript . , TypeScript , . TypeScript , .

(decoupling)

monorepo, , API, . , , . , , , .

RFC

2018 DOM. , , API. .

, . Vue , . , RFC (Request for Comments) 2019 . RFC , , , . GitHub , , .

RFC , , , feature requests.

- . Vue 2 , , .

DOM

Vue : HTML- , , DOM-. , DOM , DOM . , , , , JavaScript, - . , , (bindings) — DOM , .

, . Vue 2 , , - . Vue 3 AST transform pipeline, (transform) .

, . , DOM DOM, DOM, , , . , .

, DOM , , , . , (runtime) : , . :

-, , , (, v-if v-for). (template) «», , . , — . DOM, , , .

-, , . , .

-, DOM , . , , , . .

-: Vue 3 Vue 2.

. -, , , JavaScript . . Vue — Vue 2 23 — :
-, . , , (transitions), - , .

-, , . , . , .

— , tree-shaking — , . , , .

Vue 3 , API ES . , . tree-shaking , , .

"", . . Vue 3 10 — Vue 2, .

Vue . Vue . Vue , , . , TypeScript, , Vue 2 .

Vue 3 TypeScript, (Class API). , , , , , , , JavaScript. , Class API , , TypeScript.

. React Hooks, API- , , Composition API. , Composition API , (statefull components), , TypeScript.

. Composition API , . Vue 3 , Composition API Options API . , , . , , , Composition API Options API. , .

Vue, , HTML/CSS, , jQuery, , , -, , . : , , ; , , , .

Vue , . Vue « », API, . CDN , HTML Options API, (CLI), Composition API.

Nous avons encore beaucoup de travail à faire pour réaliser notre vision - plus important encore, mettre à jour les bibliothèques, la documentation et les outils de support pour assurer une transition en douceur vers la nouvelle version. Nous travaillerons dur dans les mois à venir, et nous attendons - nous n'attendrons pas pour voir ce que la communauté crée avec Vue 3.