下一个炙手可热的Web UI开发平台：Dart Platform
jopen 12年前
Google 2012 I/O盛会即将开始，Chrome是这次盛会的一个重点（当然还有Android，Cloud，Google Drive，以及没人用的Google+等等），而在Chrome部分，笔者认为最大的亮点就是 <a href="/misc/goto?guid=4958192889291879780">Dart Platform</a>。它必将成为web ui开发的一个新热点。 <p> </p> <p><img style="width:561px;height:415px;" alt=" 下一个炙手可热的Web UI开发平台：Dart Platform " src="https://simg.open-open.com/show/bee3c5295690925860566b9c0f5fce97.png" /></p> <p> </p> <p> </p> <p><strong>什么是Dart Platform？</strong></p> <p>Dart Platform是一个开发复杂web系统的新平台，Google出品。如果你熟悉GWT（Google Web Toolkit），并且不喜欢直接编写javascript来开发web UI的话，就会和我一样，对Dart非常期待。在Dart平台上，你可以使用Dart语言（对，Dart是一个语言）来编写代码，它可以在server端 以及现代浏览器端（主要是chrome，因为chrome会集成一个dart的虚拟机）运行。另外，Dart可以编译成javascript（和GWT类 似），因此显然你编写的Dart web系统（通过编译）可以在多种浏览器上运行，而不仅限于Chrome。</p> <p>现在的Dart平台还处于开发阶段，已经发布了Dart语言，Dart库，一个编辑器（基于Eclipse RCP开发出来的，用惯了Eclipse IDE的人会非常习惯），一个可用于server端和浏览器端的虚拟机，以及一个把Dart语言编译成javascript的编译器。</p> <p>Hello World示例：</p> <pre class="brush:java; toolbar: true; auto-links: false;"> // Copyright (c) 2011, the Dart project authors. Please see the AUTHORS file // for details. All rights reserved. Use of this source code is governed by a // BSD-style license that can be found in the LICENSE file. #library('hi'); #import('dart:html'); main() { document.query('#status').innerHTML = 'Hi, Dart'; } </pre> <br /> <p>因为笔者对Dart也是刚刚开始接触，不敢夸夸其谈其语言特性以及前景具体会如何，下面摘抄Google Dart官方给出的Question & Answers中的几段。</p> <p>全文在这里 http://www.dartlang.org/support/faq.html</p> <p> </p> <p><span style="font-family:'Open Sans',sans-serif;color:#1155cc;">Q. Is Google planning to put Dart under the control of a standards body?</span></p> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Yes, we hope to. Once Dart reaches a certain level of maturity and acceptance, we expect that a standards process will be the next step.</p> <p><span style="font-family:'Open Sans',sans-serif;color:#1155cc;">Q. What's the future for GWT?</span></p> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Bruce Johnson <a href="/misc/goto?guid=4958346077693924716">posted on the GWT blog</a> (with further comments <a href="/misc/goto?guid=4958346078502317025">on Plus</a>): "Dart and GWT both share the goal of enabling structured web programming. In fact, many of the same engineers who brought you GWT are working on Dart. We view Dart as an ambitious evolution of GWT's mission to make web apps better for end users, and we're optimistic about its potential. As Dart evolves and becomes ready for prime time, we anticipate working closely with the GWT developer community to explore Dart."</p> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">"Meanwhile, rest assured that GWT will continue to be a productive and reliable way to build the most ambitious web apps—and even games like Angry Birds. Key projects within Google rely on GWT every day, and we plan to continue improving (and open-sourcing) GWT based on their real-world needs."</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="compare-to-javascript">Q. Isn't Dart a lot like JavaScript?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Yes and no. The Dart project thinks that JavaScript can use some changes for more productive software engineering, smarter editors and development environments, and web apps that are as beautiful and pleasing as the best client apps can be. On the other hand, we don't think everything needs to change, and why change what isn't broken?</p> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Dart, like JavaScript, is a dynamically typed language. It adds optional compile-time type annotations to help you catch errors earlier. It takes out a few features of JavaScript, such as prototypes and the global object: this should streamline the VM, enable faster execution, and make it easier to do code completion and refactoring. And Dart adds some goodies. To name a few:</p> <ul style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin:0px 0px 10px 2em;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;"> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">User-defined operator methods. We like the lightweight, readable code these give for <a href="/misc/goto?guid=4958346079304780187">our DOM interface</a>.</li> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Lightweight syntax for anonymous functions. You use them a lot in web programming; now they look great. And they come with correct binding of <code style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-family:monospace,sans-serif;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">this</code> and full block-level lexical scoping, no gotchas.</li> </ul> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;"></p> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Dart aims to be like JavaScript, but faster, more regular, and more scalable to large programs.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="compare-to-java">Q. Isn't Dart a lot like Java?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Well, Java is statically typed, and Dart is dynamically typed. Dart has optional static type annotations, where in Java they are required. To us these are big differences in the nature of the two languages. But Dart is a curly-brace language, and it shares some keywords with Java, such as <code style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-family:monospace,sans-serif;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">extends</code> and<code style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-family:monospace,sans-serif;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">final</code>, so we can see why people make the comparison. Honestly, we like having a straightforward and familiar syntax that's easy to pick up, even if that means it's less exciting.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="can-add-reflection">Q. Can Dart add reflection?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Yes.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="should-i-use-dart-yet">Q. Should I write my web app in Dart?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">If you want to experiment, we'd love for you to try Dart and give us feedback. If your web app is something that needs to be reliable, we really recommend waiting until Dart is more mature. We've released Dart at a very early stage, and we're likely to make breaking changes to the language.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="js-codebase-integration">Q. I have a large JavaScript codebase. How would I migrate it to Dart?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">You could use the isolate model described in the previous question, which will encourage you to port fairly coarse chunks with narrow interfaces. We know you might like fine-grained intercalling, but we are nervous that it would have long-term negative effects on the language and on the VM (from experience with GWT JSNI), and we would very much rather do without it. So the <code style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-family:monospace,sans-serif;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">native</code> keyword is intended for use only by our core library implementations, because we want to be able to make breaking changes to the interaction between native JavaScript and generated JavaScript, breaking only our own core libraries, not the whole world. Again, we'll see how this works.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="what-browsers-supported">Q. What browsers do you plan to support as JavaScript compilation targets?</h3> <span style="line-height:18px;font-family:'Open Sans',sans-serif;color:#444444;font-size:15px;">We're currently aiming to support the following browsers:</span> <ul style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin:0px 0px 10px 2em;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;"> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Internet Explorer, latest two versions that are 9 or higher.</li> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Firefox, latest two versions that are 7 or higher.</li> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Chrome, latest version.</li> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Safari, latest two versions that are 5.1 or higher.</li> <li style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Opera, latest version that is 12 or higher.</li> </ul> <span style="line-height:18px;font-family:'Open Sans',sans-serif;color:#444444;font-size:15px;">That's a goal; we don't actually support all of these browsers yet. The goal may change to be either more restrictive or more permissive. We'll refine this further as Dart matures.</span> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="what-browsers-have-dart">Q. What browsers support Dart now?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">As of February 2012, no production browsers can execute Dart code unless it's first compiled to JavaScript. However, a Chromium build (nicknamed <span style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Dartium</span>) is available that can execute Dart code natively. For details on downloading and using Dartium, see <a href="/misc/goto?guid=4958346080096960940">Chromium with the Dart VM</a>.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="debugging-output-js">Q. How do I debug Dart code after it's been compiled to JavaScript?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">The generated JavaScript from dart2js is readable, and it's reasonable to use the browser's development tools on it. We expect to eventually provide Source Maps output, which allows you to debug the Dart code from the JavaScript code inside of your browser's developer tools.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="what-input-compiles">Q. Will any valid Dart code compile to JavaScript, or are there limitations?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Yes, we intend for any valid Dart code to compile to JavaScript. If some support is missing from one of our compilers, that's a bug (in either the compiler or the spec).</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="json-support">Q. Does Dart support JSON?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">Yes, Dart libraries can parse from and stringify to JSON. You can find such a library at<a href="/misc/goto?guid=4958346080893631045"><code style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-family:monospace,sans-serif;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">dart/lib/json/</code></a>.</p> <h3 style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:25px 0px 10px;padding-left:0px;padding-right:0px;font-family:'Open Sans',sans-serif;color:#1155cc;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;" id="server-support">Q. Will Dart run on the server?</h3> <p style="border-bottom:0px;border-left:0px;padding-bottom:0px;line-height:18px;margin-top:0px;font-family:'Open Sans',sans-serif;margin-bottom:10px;color:#444444;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">We have some server code now, such as our test suites. Have a look at the file, socket, and process APIs in <a href="/misc/goto?guid=4958346081694747721"><code style="border-bottom:0px;border-left:0px;padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;font-family:monospace,sans-serif;font-size:15px;vertical-align:baseline;border-top:0px;border-right:0px;padding-top:0px;">dart/runtime/bin/</code></a>.</p> <p> </p> <p> </p> <p>更新正在进行的Google IO Dart session的一个截屏：</p> <p><img style="width:544px;height:280px;" alt=" 下一个炙手可热的Web UI开发平台：Dart Platform " src="https://simg.open-open.com/show/5e4f44373f0dabc72775cd67ca37ebb0.png" /></p> <p> </p> <p>更新最后问答阶段的一些内容：</p> <p>1、dart编译成js的时候，是针对每个browser编译一份，还是编译一份js可以在多种browser上运行？</p> <p>答：编译一份js</p> <p>2、dart editor可否变成Eclipse的plugin，这样开发者就可以使用Eclipse的种种工具和好处？</p> <p>答：日期还不能透露，但最终肯定会支持Eclipse plugin的形式</p> <p>3、什么是dart成功的标志？</p> <p>答：在chrome内置dart虚拟机，完美地支持dart，在google之外的很多项目决定使用dart，dart逐渐被整个web开发社区认可，这就是dart成功的标志，也是dart team的ultimate goal。</p> <p>4、dart对server端的支持如何？</p> <p>答：dart很好地支持json，所以client端和server端可以以json的形式传输数据，dart虚拟机也可以在server端运行，dart是一个支持在client端和server端都可以运行的语言。</p> <p> </p> <p> </p> <p>笔者认为，google毫无疑问会大力发展和推广dart，chrome已经决定内置dart虚拟机，现在最大的疑问就是其他主流浏览器是否愿意直 接支持dart，尤其是mozilla firefox，如果dart本身只能在chrome一个浏览器上运行，在其他浏览器上都必须先编译成javascript，那它的优越性就大大减弱了 （试想一下，dart是一门语言，javascript也是一门语言，对于一个不懂javascript的人来说，学习javascript固然是痛苦 的，学习dart再编译成javascript也没有吸引力）。相反，如果mozilla也内置dart虚拟机，那dart就会掀起一场web系统开发的 革命，浏览器的效率将得到革命性的提升！结合cloud技术，未来的终端机真的只要browser+memory就可以了！<br /> <br /> 转自：http://blog.csdn.net/qinjienj/article/details/7697869</p>