写点什么

VueConf.US 大会第一天上午会议内容概述

  • 2018-04-09
  • 本文字数:2266 字

    阅读完需:约 7 分钟

看新闻很累?看技术新闻更累?试试下载 InfoQ 手机客户端,每天上下班路上听新闻,有趣还有料!

第一届 VueConf.US 大会于 3 月 26 日到 28 日在新奥尔良市举行,Vue 核心团队与来自世界各地的数百名 Vue 开发人员齐聚一堂。大会包括一天的研讨会,全部由 VueJS 核心团队成员讲授,接下来两天是演讲。演讲者会宣布新版本和项目进展,详细介绍 Vue 内部构件,分享最佳实践。

下面是第一天上午的演讲内容。

主题演讲——日渐成熟的项目流程

Vue 创建者 Evan You 的主题演讲拉开了大会的帷幕,重点介绍了 Vue 自 2016 年以来的发展以及即将到来的新开发流程和新项目流程。关于 Vue 的增长:

2017 年,我们经历了指数式增长,比 2016 年增长更快。2016 年,我就认为我们经历了爆炸式增长,但在 2017 年,增长甚至更快了。

2017 年,我们是 GitHub 上得星最多的项目。

随着增长,流程日趋成熟。除了升级工具如重写 vue-loader 让它可以更好地适应标准 webpack 配置和 vue-cli ,从而改进可升级性之外,其在演讲中宣布的重要公告都是关于采用的新流程。

Vue 将转而采用一种标准化的发布周期,新的小版本每三个月发布一次,重大版本发布至少提前 6 个月通知。这一变化将使发布通道由一个变成四个。此外,随着 Rust、Ember 等最佳实践项目示例的推出,近日,React VueJS 将创建一个正式的 RFC 流程。

VueJS 内部构件——揭秘 Vue 反应性系统

VueMastery.com 创始人 Gregg Pollack 呈献了“VueJS 解密”,深入介绍了 Vue.js 反应性系统。他首先教给观众,如何创建一个简单的反应式系统,通过实现一个简单的依赖跟踪类,并使用 Object.defineProperty 设置 get 和 set 方法钩入依赖跟踪。

接下来,他带领观众浏览了 VueJS 的源代码,深入调用栈,了解 Vue 在哪里实现了反应性,使用了他刚刚讲过的模式。这让 Vue 可以跟踪函数的所有数据依赖,随着数据变化自动计算相关的值。

最后,Pollack 向观众介绍了 Vue 如何渲染模板,它使用一个简单的两步流程把模板编译成一个渲染方法,然后使用这个渲染方法生成虚拟 DOM 节点,由框架传给浏览器。把渲染简化为一个函数意味着可以插入上文提到的依赖跟踪,让模板反应性成为核心反应式系统的自然结果。

Vue 在 Gitlab 的使用

Jacob Schatz 是 Gitlab 前端负责人,他呈献了一个案例“Gitlab 如何使用 Vue”,介绍 Gitlab 如何应用 Vue,把它带入一个现实生活项目。许多演讲者都假设开发人员在开发一个新项目,而 Schatz 带领观众进入到一个已有的、主要使用 jQuery 编写的大型应用程序,并详细介绍了决策及迁移过程。他介绍了在团队提供建议之前如何对多个框架进行评估。对于他们为什么使用 Vue,Schatz 是这样说的:

Vue 提供了最多的特性和最低的学习曲线。

所有这些框架都可以,但是考虑到你正在开发的应用程序的规模,它是否仍然有效?Vue 自始至终都很简单。

他们面对的是一个已有的大型项目,没有复杂的前端构建过程。Schatz 详细介绍了在把 Vue 添加到页面之后,他们使用 Vue 分步、分组件重写了他们的应用程序,而不用停止新特性的开发工作。

Vue 动画

Rachel Nabors 是《Animation at Work》一书的作者,她做了题为“Vue 动画”的演讲,介绍如何使用 Vue 实现动画和切换。Nabors 首先把 CSS 切换解释成 CSS 属性事件查看器,然后她展示了 Vue 元素如何生成一系列逐步应用的类,让开发人员可以在元素增加、删除、显示和隐藏时钩入,简单地创建动画。例如,一个名为“uncloak”的切换将会在切入时应用类 uncloak-enter、uncloak-enter-to 和 uncloak-enter-active,在切出时应用类 uncloak-leave、 uncloak-leave-to 和 uncloak-leave active。

接下来,她展示了如何使用切换组协调多个元素的动作和切换模式,确定元素替换时的顺序。对于每一组 css 切换钩子,都会有一组等价的、使用标准 vue 事件绑定的 JavaScript 钩子。你可以使用 v-bind:leave="animationFunction"简单地绑定到“leave”事件,而不是绑定一组“leave”类。

Vue 应用程序测试

在上午最后一场演讲中,Vue 核心团队成员兼“vue-test-utils”作者 Edd Yerburgh 谈了 Vue 应用程序测试。他展示了一个适应不同环境的前端测试金字塔,包括端到端测试、快照测试和单元测试。

接下来,Yerburgh 分类介绍了每种测试类型的优缺点。端到端测试使用浏览器运行代码,这最接近用户实际使用代码的方式,但难以调试,而且速度慢。另一端是单元测试,这类测试易于调试,而且速度快,但是如果不小心,就非常脆弱,而且对不重要的实现细节很敏感。在速度和脆弱性方面,快照测试介于 E2E 组件和单元测试之间。这类测试会获取已渲染组件代码的快照,然后通过对比得出变化。这些测试用于防止意外修改,阻止开发人员在修改功能时意外修改已渲染的标记或者删除重要的 CSS 类。

自始至终大力强调社区

大会自始至终都在强调社区,与会者相当积极,“Vue”双关语泛滥。当问他对于这次大会的看法时,与会者 Kelvin Spencer 表示:

这次大会给了我完美的“Vue”供我将来编程使用。
其他与会者也同意,而且,还特别指出了社区是多么的让人舒服、受人欢迎。

与会者 Mike Skott 说:

我最欢的事情是见人——来参会,不怕接近陌生人,了解到我们有共同之处,并发现了许多真正优秀的人。

与会者 Richard Tallent 插话说:

要选出最喜欢的演讲很难——我好想记了 15 页笔记。但是,最值得一说的是遇到了各种各样的开发者,了解到了各种各样的开发经验,每个人都对这个平台及其可能性有着同样的兴奋。

所有演讲都有录音,将发布在 VueMastery.com 上。InfoQ 正以 Q&A、概述的形式追踪报道 VueConf 大会。

查看英文原文 Opening Sessions from VueConf.US

2018-04-09 19:001318
用户头像

发布了 1008 篇内容, 共 391.8 次阅读, 收获喜欢 344 次。

关注

评论

发布
暂无评论
发现更多内容

Sanic 是什么:扩展性和性能并存的Web框架

Apifox

Python 程序员 后端 异步编程 sanci

LED显示屏分为几类,特点分别是什么?

Dylan

LED显示屏 户外LED显示屏 户内led显示屏

Linux系统Docker优化详细教程。

百度搜索:蓝易云

Docker 云计算 Linux 运维 云服务器

用友推出基于 BIP3 的新一代 HOP 产品

用友BIP

医疗

防范地质灾害,北斗用芯监测

江湖老铁

如何开发一对一视频源码

山东布谷网络科技

App 源代码

并发编程-CompletableFuture解析 | 京东物流技术团队

京东科技开发者

并发编程 CompletableFuture JDK1.8 企业号 7 月 PK 榜

河北幸福消费金融基于 Apache Doris 构建实时数仓,查询提速 400 倍!

SelectDB

数据库 大数据 数据分析 后端 Doris

MegEngine Python 层模块串讲(中)

MegEngineBot

Python 深度学习 开源

Apache Doris 1.2.6 版本正式发布|版本通告

SelectDB

数据库 大数据 后端 Doris

【好文推荐】敏捷绩效考核如何做?

ShineScrum

软件测试/测试开发丨Python 内置库 OS 学习笔记分享

测试人

Python 软件测试 测试开发 os内置库

PoseiSwap 即将开启质押,利好刺激下 POSE通证短时涨超 30%

西柚子

PoseiSwap 即将开启质押,利好刺激下 POSE通证短时涨超 30%

大瞿科技

桂林等级保护测评机构有几家?有哪些?哪里可以查到?

行云管家

等级保护 等保测评 桂林 桂林广西

saas平台定义以及优点、特点简单介绍

行云管家

SaaS 平台

Java 后端有哪些不用学的技术?劝退。。。

java易二三

Java 编程 计算机 jsp

电子科技大学入驻飞桨AI Studio高校专区,AI优质课程等你来学!

飞桨PaddlePaddle

人工智能 百度 paddle 飞桨 百度飞桨

瀚元科技:利用A-OPS 智能运维助力边缘服务器运维效率提升30%

openEuler

Linux 运维 操作系统 openEuler 边缘

数据库优化器设计穿越探索之旅

阿里技术

数据库 架构

UPS设备在物流机房中的应用浅析 | 京东物流技术团队

京东科技开发者

机房管理 企业号 7 月 PK 榜 UPS

Linux系统Memcached性能优化详细教程。

百度搜索:蓝易云

memcached 云计算 Linux 运维 云服务器

线程池中多余的线程是如何回收的?

java易二三

Java 编程 程序员 面试 计算机

亚信安慧通过ISO20000认证,AntDB数据库团队服务能力再上新台阶

亚信AntDB数据库

数据库 AntDB AntDB数据库 企业号 7 月 PK 榜

软件测试/测试开发丨Python 内置库 sys 学习笔记分享

测试人

Python 程序员 软件测试

【实践篇】推荐算法PaaS化探索与实践 | 京东云技术团队

京东科技开发者

PaaS 推荐算法 PaaS平台化能力 企业号 7 月 PK 榜

技术优化:降本增效的常规实践

有态度的马甲

技术分享|GrowingIO分析云对ClickHouse的实践

Geek_2d6073

图解MySQL中SQL语句的执行过程

程序员小毕

Java MySQL 数据库 sql 程序员

浅析 TiSpark v3.x 新变化

TiDB 社区干货传送门

版本测评 新版本/特性解读 7.x 实践

【腾讯云 Cloud Studio 实战训练营】沉浸式体验编写一个博客系统

全栈若城

项目实战 Cloud Studio

VueConf.US大会第一天上午会议内容概述_JavaScript_Kevin Ball_InfoQ精选文章