【译PPT/必读】尤雨溪：Vue 3.0的设计原则
source link: https://juejin.im/post/5e02043f6fb9a0163a48412f
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
【译PPT/必读】尤雨溪：Vue 3.0的设计原则
2019年11月11号在Vue Toronto 2019会议上，@尤雨溪做了关于《Design Principles of Vue 3.0》的分享。
本PPT作者@尤雨溪，翻译作者：黑叔666。
（注：由于黑叔英语基础薄弱，若有任何更好的翻译，可评论区留言噢！）
译文：VUE 3.0 的设计原则
译文：快速状态更新
译文：全世界每周有100万活跃用户！
译文：NPM每周下载：超过去年的100%以上
译文：路易威登使用的是Vue和Nuxt技术
译文：Vue设计面临的挑战
译文：VUE有非常多样化的用户
- 刚刚从HTML和CSS有了进展的初学者
- 从JQuery框架的转过来的专业人员
- 从另一个框架转过来的搬砖老兵
- 后端工程师寻找轻量级的前端解决方案
- 架构师为整个组织选择基础
译文：VUE有非常多样化的使用场景
- 将交互性结合到遗留的应用程序上
- 一次性项目需要快速周转，但不需要长期团队维护
- 可预测复杂度的中型项目
- 大型项目预计将持续数年，团队运作
译文：设计包括解决权衡问题
- 为简单性而优化的API会导致大规模的可维护性问题
- 重型工具增加了进入壁垒并限制了用例
- 更多的功能会导致更多的臃肿
译文：框架必须在多个维度上进行考虑
译文：可接近性 VS 可扩展性
译文：CDN构建 VS Vue脚手架
译文：选项API和合成API
- 为什么要介绍另一种方式
译文：选项API
- 大规模应用程序中的可扩展性问题
译文：合成API
- 可与选项API一起使用
- 提供更灵活的代码组织和逻辑重用功能
- 提供出色的typescript支持
译文：TypeScript vs JavaScript
- TypeScript真的是有必要吗？
译文：为什么TypeScript：
- Pro：优秀的IDE支持自动补全和类型信息
- Pro：重构大型项目中旧代码的信心
- Cons：学习成本
- Cons：初期发展缓慢
译文：In vue 3
- TS定义对JS用户也有好处
- 使用TS和JS的组件代码看起来基本相同
译文：模板 VS JSX：
- 为什么要提供两种？
译文：作为一个包容的框架意味着去迎合不同背景的用户
译文：另外，模板允许我们获得更好的性能
译文：尽管Vue可以确保组件树级别的更新最少，但它仍然是每个组件实例中的完全diff。
译文：传统虚拟DOM的瓶颈
- 传统VDOM的性能取决于模板的总大小，而不是模板中动态内容的数量
- 完全动态渲染逻辑使得很难对用户意图进行安全的最大AOT优化假设。
译文：语法约束促使更好的优化
译文：让我们开始一个最简单的例子
- 完全没有节点结构更改
- 只有一个动态节点
译文：节点结构改变：v-if
译文：节点结构改变：v-if
- 外面的v-if:v-if是唯一的动态节点
- 里面的v-if:{{message}}是唯一的动态节点
译文：节点结构改变：v-for
- 外面的v-for:v-for是唯一的动态节点（作为碎片）
- 里面的每一个v-for迭代:{{item.message}}是唯一的动态节点
译文：这是一棵大树
- 基于结构指令划分为“块”的模板
- 在每个块中，节点结构是完全静态的
- 每个块只需要一个扁平的数组来跟踪动态节点
译文：使用新策略，更新性能是动态内容的数量而不是总模板大小决定
译文：更新性能基准
- v-for有1000次迭代
- 在每次迭代中,12个DOM元素嵌套3层深,2个动态类绑定,1个动态文本插值,1个动态id属性绑定
- 更新所有动态绑定，平均运行100次
译文：Power vs Size
译文：Vue2的困境：
- 每个新特性都会增加每个用户的包大小
译文：在Vue 3中
- 大多数全局api和内部帮助程序作为ES模块导出被提供（可摇动的树）
- 编译器也为模板生成树可更改代码
- 不要为你从未使用过的功能付费
译文：框架一致性与低层韧性
- 库 vs 框架
- 原始 vs 抽象
- 集市 vs 大教堂
译文：小范围优点
- 开始使用的概念更少
- 更多的灵活性和更多的用户机会->活跃生态系统
- 较小的维护面-> 团队可以专注于探索新的想法
译文：小范围缺点
- 在用简单的概念解决固有的复杂问题时需要更多的管道工程
- 随着时间的推移，模式自然会出现，并成为半必需的知识，但通常没有正式的文档记录
- 生态系统移动过快会导致分裂和持续的变动
译文：大范围优点
- 最常见的问题可以通过内置的抽象来解决
- 集中的设计过程确保了一致和连贯的生态系统
译文：大范围缺点
- 更高的前期学习障碍
- 不灵活的内置解决方案不适合用例
- 更大的维护面使引入基本的新思想更加尖
译文：进步的地方
- 分层设计，允许以渐进的方式选择功能
- 低入门学习障碍
- 常见问题的文档解决方案
译文：在Vue 3中
- 与vue 2相同的连贯体验
router，Vuex&test-utils将收到相应的更新以符合此愿景
- 甚至更低层次的灵活性
一流的自定义渲染器和定制的编译器api
Recommend
-
47
原文：Plans for the Next Iteration of Vue.js 作者：Evan You（尤雨溪） 发表时间：Sep 30, 2018 译者：西楼听雨 发表时间： 2018/10/5 (转载请注明出处) 展开原文 Last week a
-
57
上图，无图无真相 花了400大洋买了fontedmasters的一个月的会员，就是为了看男神的这份vue教程，没有中文字幕，痛苦地坚持啃完了，建议有钱并且英语好的人直接买会员去官网看视频，尤大神人长得帅，业务水平高，英语还超苏，对不起，忍不住犯了会儿花痴，如
-
32
这个系列文章将从下面几个方面来介绍vue reactivity(响应式) plugin(插件) render(渲染函数) routing(路由) state-management(状态管理) international(多语言支持) 上一篇文章已经介绍了第一
-
4
尤雨溪深夜官宣：Vue 3 将不再支持 IE11发布于 4 月 3 日早在开发之初，尤雨溪便计划在 Vue 3 发布并稳定后兼容 IE11。如今 Vue 3 ，已发布多时，但 IE11 的全球使用率却呈明显...
-
12
Vue作者尤雨溪：Vue 2.0，渐进式前端解决方案 ...
-
5
今日凌晨，尤雨溪在微博平台官宣 Vue 3.2 已发布，并表示：<script setup> + TS + Volar = 真香Vue 3.2 版本包括许多重要的新功能和性能改进，但并不包含重大更改。新的单文件组件功能：
-
3
尤雨溪回应「为什么 Vue 在国际上越来越没影响力？」 ...
-
1
尤雨溪Vue登榜GitHub之路看似不难
-
6
尤雨溪Vue 2022回顾及2023展望 出品 | OSC开源社区（ID：oschina2013) Vue 作者尤雨溪日前发文对 Vue 的 2022 进行回顾并展望了一下项目 2023 年的发展。 在 2022 年 2 月，Vue 的默认版本切换到...
-
2
十年，一个既漫长又短暂的时光跨度，对于技术世界来说，更是沧海桑田的瞬间。在这十年里，vue.js 从无到有，从默默无闻...
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK