Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ZHGDG[7.27]GDL.3-Dart intro.
Search
Zoom.Quiet
July 29, 2013
Technology
1
110
ZHGDG[7.27]GDL.3-Dart intro.
ZHGDG[7.27]GDL.3-Dart intro.
Zoom.Quiet
July 29, 2013
Tweet
Share
More Decks by Zoom.Quiet
See All by Zoom.Quiet
PyCon2014China-Zhuhai-high performance
zoomquiet
0
160
PyCon2014China-Zhuhai-meta programming
zoomquiet
1
130
PyCon2014China-Zhuhai-bpm.py
zoomquiet
0
110
PyCon2014China-Zhuhai-luna kv db
zoomquiet
0
91
PyCon2014China-Zhuhai-seed studio
zoomquiet
0
95
PyCon2014China-Zhuhai-Docker Registry Build By Python
zoomquiet
0
110
PyCon2014China-Zhuhai-jeff
zoomquiet
0
85
PyCon2014China-Zhuhai-pythonic front-end
zoomquiet
0
120
DevFest2014-Zhuhai-Polymer
zoomquiet
0
410
Other Decks in Technology
See All in Technology
データアナリストからアナリティクスエンジニアになった話
hiyokko_data
0
140
役割は変わっても、変わらないもの 〜スクラムマスターからEMへの転身で学んだ信頼構築の本質〜 / How to build trust
shinop
0
150
サンドボックス技術でAI利活用を促進する
koh_naga
0
130
個人CLAUDE.md紹介と設定から学んだこと/introduce-my-claude-md
shibayu36
0
140
実践AIガバナンス
asei
3
270
AIとTDDによるNext.js「隙間ツール」開発の実践
makotot
6
800
『FailNet~やらかし共有SNS~』エレベーターピッチ
yokomachi
1
190
Jaws-ug名古屋_LT資料_20250829
azoo2024
3
210
allow_retry と Arel.sql / allow_retry and Arel.sql
euglena1215
0
140
Oracle Cloud Infrastructure:2025年8月度サービス・アップデート
oracle4engineer
PRO
0
170
TypeScript入門
recruitengineers
PRO
33
11k
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
2
940
Featured
See All Featured
4 Signs Your Business is Dying
shpigford
184
22k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.5k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
910
Bash Introduction
62gerente
614
210k
What's in a price? How to price your products and services
michaelherold
246
12k
Statistics for Hackers
jakevdp
799
220k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Become a Pro
speakerdeck
PRO
29
5.5k
Transcript
珠海GDG
Dart 语言 最值得学习的 Web 开发技术 韩国恺,Dart GDE
1. 当前的Web开发 2. Dart 语言介绍 3. Dart 语法特性 4. Dart
Web开发 5. Web 应用示例讲解 大纲
Web应用的优点 • 无需安装 • 增量式开发 • 自动升级 • 跨平台 •
天然的MVC
当前的Web开发 • Web 开发越来越复杂:项目大,团队成员多 • 前端功能越来越多:CS→BS→CS • 大型应用维护和协作难 • 性能弱,启动速度慢
• 工具支持弱
JavaScript 并不完美
JavaScript 并不完美 • 程序结构不明显 • 并非为性能设计的语言 • 缺少一些基础功能的支持 • 缺少统一的基础特性,共享复用难
变量提升(hoisting) var foo = 'top-level'; function bar() { if (!true)
{ var foo = 'inside'; } console.log(foo); } in JavaScript => undefined in Dart => 'top-level'
Google 遇到问题 我们应该做得更好!
各种技术所做的改进
1. 当前的Web开发 2. Dart 语言介绍 3. Dart 语法特性 4. Dart
Web开发 5. Web 应用示例讲解 大纲
• 2011年10月对外宣布 • Chrome V8 团队打造 • 主要成员包括:Lars Bak、Kasper Lund、Gilad
Bracha等 • 以大量编程语言实现的经验为基础 Dart 语言的诞生
Dart 并非颠覆,而为实用
Dart 是什么样语言 • 简单、熟悉的面向对象语言 • 基于类,单继承、多实现 • 熟悉的语法和恰当的词法作用域 • 可选的静态类型
• 单线程和基于Isolate的并发
为什么喜欢 Dart 1. 开源 2. 有 Google 当靠山 3. 执行效率高
4. 有机会成为 Android 内置的虚拟机,用来写手机 App 5. 可以用来写服务器后台程序 6. 可以写 Web 前端程序,在浏览器内运行 @蔡学镛
• 结构化并且灵活的Web语言 • 简单、有生产力 • 适合从小型到大型的项目 • 高性能、快速启动 • 适合各种设备的Web环境
Dart 语言的目标
Dart 语言的组成 • 语言规范 • Dart VM • 丰富的类库 •
工具: ◦ Dartium:Chrome + Dart VM ◦ 包管理 Pub ◦ Dart Editor • Dart → JavaScript 编译器:dart2js
Dart 两种运行模式 1)检查模式(checked) 检查类型匹配,及早发现问题,但性能差 T x = o 等价于 assert(o
== null || o is T) 2)生产模式(production) 不检查类型,性能好
Dart 运行环境 Dart source code Dart VM JavaScript source code
dart2js Source map tree shaking minification
Dart2js
Tree-shaking
在网页中嵌入Dart MIME 类型:application/dart bootstrap:dart.js <script type="application/dart" src="yourapp.dart"></script> <script src="packages/browser/dart.js"> </script>
• 语言的设计影响性能 • 使用snapshot启动速度快10倍 • 运行时不能改变对象结构有利于VM优化 • Dart VM 性能已超越
JavaScript V8 • …… 高性能
性能测试 http://www.dartlang.org/performance/
1. 当前的Web开发 2. Dart 语言介绍 3. Dart 语法特性 4. Dart
Web开发 5. Web 应用示例讲解 大纲
Dart 语法特性 • 纯面向对象:类 • 范型 • 函数、闭包 • 库:import
• 可选类型 • 词法作用域 • 异步与并发编程 • getter 和 setter • 方法级联调用 • 操作符重载 • Markdown注释 • 支持 Mixin • 基于Mirror的反射 不支持 eval ……
1. 当前的Web开发 2. Dart 语言介绍 3. Dart 语法特性 4. Dart
Web开发 5. Web 应用示例讲解 大纲
Web Components • Templates • Custom Elements • Shadow DOM
• Imports
Web UI 框架 • 单向绑定 • 双向绑定 • 条件、循环... •
定制组件 • 封装 HTML、代码、样式
Polymer 框架 http://www.polymer-project.org/
1. 当前的Web开发 2. Dart 语言介绍 3. Dart 语法特性 4. Dart
Web开发 5. Web 应用示例讲解 大纲
Web 应用示例讲解 • Button Handler • 基本环境与DOM操作(target2-mini) • 添加与删除元素(target3/4-todo) •
Web UI入门(target6 LittleBen) • 定制元素(target8 drseuss) • Dart Server+表单提交(target10 slambook) 示例参考:http://www.dartlang. org/docs/tutorials/
Dart 小结 • 提高生产力 • 简洁、熟悉的语法 • 坑少,工具支持好 • 性能好
• 项目可伸缩 • Web 和 Server 编程 • 库正在逐渐丰富
Dart 资源 官方网站:http://dartlang.org 邮件列表、Google Plus、Stackoverflow 开源项目:https://code.google.com/p/dart/ 子项目:https://github.com/dart-lang Pub:http://pub.dartlang.org
谢谢!Q & A Email:
[email protected]
新浪微博:@Dart语言 / @hanguokai