前言
苹果在 WWDC 2019 的开幕式中给我们来带了超多的惊喜，全新的iPad OS, 给生产力和商业带来了新领域，iOS 项目可以通过简单的修改移植到 Mac OS 上，全新的 Mac Pro 高清的显示器等新硬件，但对于在苹果平台的开发者们，最重要的莫过于 Swift UI。
曾几何时，iOS 开发者的 UI 开发体验一直是大前端中体验最差的，粗矿原始的 Frame 布局系统， API 冗长难用的 Autoalyout, 都是把开发者按在地上使劲的摩擦。 毫无开发体验可言。
去年大火的 Flutter 给客户端上开发带来了全新的体验，声明式的 UI 语法，亚秒级别的实时刷新, 都极大的提升了开发效率，但现在这些都在 SwiftUI.Framework上得以实现，并且是官方原生的支持。
昨天一起观看WWDC的小伙伴们都戏称 SWiftUI真实的名字怕是 AppleFuckFlutter.framework.
作为一个苹果的死粉，当然是第一时间下载 Beta 全家桶尝鲜一下。
注：Xcode11-beta 可以安装在 Mac OS Mojave 上，但是 Preview 功能只能使用在 Mac OS Catalina 上，如果想获得完整体验最好配套升级你的 Mac。
与 Flutter 的开发体验对比
准备好开发工具后我们先来对比下 SwiftUI 和 Flutter 的写法上的直观体验。
是不是非常相似，相似的声明式布局语法，Debug时期的Preview 和 Live Reload，但这次我们不再借助与第三方，Follow 苹果官方。下面从初次体验的方面简单聊一下直观感受。
声明式语法
下面我们看一段简单的声明式语法
SwiftUI
struct ContentView : View {
var body: some View {
VStack {
MapView()
.edgesIgnoringSafeArea(.top)
.frame(height: 300)
CircleImage()
.offset(y: -130)
.padding(.bottom, -130)
VStack(alignment: .leading) {
Text("Turtle Rock")
.font(.title)
HStack(alignment: .top) {
Text("Joshua Tree National Park")
.font(.subheadline)
Spacer()
Text("California")
.font(.subheadline)
}
}
.padding()
Spacer()
}
}
}
Flutter
Widget _listItemBuilder(BuildContext context, int index) {
return Container(
color: Colors.white,
margin: EdgeInsets.all(8.0),
child: Stack(
children: <Widget>[
Column(
children: <Widget>[
AspectRatio(
aspectRatio: 16/9,
child: Image.network(posts[index].imageUrl, fit: BoxFit.cover),
),
SizedBox(height: 16.0),
Text(
posts[index].title,
style: Theme.of(context).textTheme.title
),
Text(
posts[index].author,
style: Theme.of(context).textTheme.subhead
),
SizedBox(height: 16.0),
],
),
Positioned.fill(
child: Material(
color: Colors.transparent,
child: InkWell(
splashColor: Colors.white.withOpacity(0.3),
highlightColor: Colors.white.withOpacity(0.1),
onTap: () {
Navigator.of(context).push(
MaterialPageRoute(builder: (context) => PostShow(post: posts[index]))
);
}
),
),
),
],
),
);
}
观察语法的细节，我们可以注意到一些特征，Flutter使用典型的声明式语法，开发者声明UI的布局方式，一切的布局都交给引擎来解决。在写代码层面 Dart 使用 , 来分割不同的Widget，这会造成在复杂的布局中，()语法嵌套极其复杂，配上VSCode的插件也看的眼花缭乱。
而Swift 虽然也是声明式语法，但是仔细注意到，Swift的View组合并不是由, 分割，而是由换行分割，在 Swift 中 函数调用是可以换行分割的。这样的 DSL 对开发者的体验更为友好，推测 SwiftUI 使用了类似标记的特征，在统一的时机去做布局。
这样可以做到非常清晰的可读性，并且代码长度也大大缩短。不信你看Xcode 终于支持 miniMap, 在 Objective-C 时代我们的显示器是没有足够空间给我们显示MiniMap的。
但是 Xcode 有一点做的是不如 Flutter的 代码格式化功能非常差，不过相信这点可以通过插件弥补。
Live reload
曾几何时客户端上的开发同学有多么羡慕前端开发同学的 Live Reload，尤其是iOS平台，动辄链接5分钟，极大的影响了开发效率，这次 苹果官方 给开发者带来了此项功能。
但 One More Thing ，在Xcode 中不仅仅可以通过代码改变实时预览，还可以通过编辑预览生成代码， This is amazing.
想象一下 在业务开发后期 UED同学和你校对视觉的时候是不是可以直接编辑UI生成代码 ，而不需要重新编译。
Mix With UIKit
任何一门新技术，对于当前的技术其实都是一次冲剂，对于旧的技术 虽然经过了很多年的历史沉淀，有很多的积累，但是这些积累同时变成了包袱，如何背着包袱负重前行，是任何一门新技术都要考虑的问题，
显然Swift UI 也考虑到了，目前官方给出的文档中，SwiftUI 是可以和 UIKit 原有的体系很轻松的混合在一起。让开发者可以渐进式的接入 SwiftUI。
Older iOS Version
官方声称 SwiftUI 目前仅支持 iOS 13.x 以上，很多APP 目前还在兼容 iOS 9，看起来用上 Swift UI 还需要4年，但是观察今年 苹果的重大改变，包括，
iOS12以下 蜂窝网络下载可以大于 200M, 苹果官方包优化大小 减少50% ，iOS 13以上甚至完全不限制在蜂窝网络下下载的大小，有理由相信 苹果可以考虑把 SwiftUI 内置在 APP 包内，使开发者可以更轻易地兼容低版本的操作系统。
生态畅想
从上面中可以看到 SwiftUI 做的很多事情和 Flutter 太过相似，目前 Swift UI 支持 Apple 全平台.
但是要知道的是 安卓是开源的 iOS 是闭源生态，Flutter 把手伸到 iOS 平台不太容易，但 SwiftUI 把手伸到安卓平台可就容易多了。
希望这张图有机会变成.
淘宝基础平台团队正在举行2019实习生(2020年毕业)和社招招聘，岗位有iOS Android客户端开发工程师、Java研发工程师、C/C++研发工程师、前端开发工程师、算法工程师，欢迎投递简历至junzhan.yzw@taobao.com
如果你想更详细了解淘宝基础平台团队，欢迎观看团队介绍视频更多淘宝基础平台团队的技术分享，可关注淘宝技术微信公众号AlibabaMTT
