Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(158)

Side by Side Diff: src/site/docs/technical-overview/index.html

Issue 11366023: Updated tech overview (Closed) Base URL: git@github.com:dart-lang/dartlang.org.git@master
Patch Set: incorporate review comments Created 8 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « src/site/docs/technical-overview/images/source-flow.png ('k') | src/site/support/index.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 --- 1 ---
2 layout: default 2 layout: default
3 title: "Technical Overview" 3 title: "Technical Overview"
4 --- 4 ---
5 <h1>Technical Overview </h1> 5 <h1>Technical Overview </h1>
6 6
7 <section> 7 <section>
8 <p> 8 <p>
9 Dart is a new class-based programming language 9 Dart helps developers productively build
10 for creating structured web applications. 10 high-performance apps for the modern web.
11 Developed with the goals of simplicity, efficiency, and scalability, 11 Targeting modern desktop and mobile browsers,
12 the Dart language combines powerful new language features 12 Dart apps can run natively in a Dart virtual machine (VM)
13 with familiar language constructs into a clear, readable syntax. 13 or be compiled to JavaScript.
14 </p> 14 </p>
15 15
16 <aside> 16 <p>
17 <div class="alert alert-info"> 17 Developed with the goals of <b>simplicity</b>,
18 <strong>Note:</strong> 18 <b>efficiency</b>, and <b>scalability</b>,
19 This document is part of an early preview of 19 the Dart language combines powerful new features
20 the Dart language and programming environment. 20 with familiar language constructs into a clear, readable syntax.
21 Some elements are missing from the current release, 21 But Dart's not just a language.
22 and the details are subject to change based on the feedback we receive. 22 The Dart open-source project also includes <b>libraries</b>,
23 </div> 23 a <b>package manager</b>,
24 </aside> 24 and <b>tools</b> such as a full-featured <b>editor</b>.
25 The bundled Dart libraries are still changing,
26 but we expect them to settle down soon.
27 </p>
28
29 <p>
30 Additional Dart open-source projects and the Pub package manager
31 help developers be even more productive.
32 For example, developers can use Pub to get packages for
33 <b>JavaScript interoperability</b>,
34 a <b>web UI</b> framework,
35 a <b>unit testing</b> library,
36 libraries for <b>game development</b>,
37 and much more.
38 </p>
39
40 <p>
41 Now that the language has stabilized,
42 the Dart team is working on <b>performance</b>.
43 The Dart VM is already much faster than Chrome’s JavaScript engine, V8,
44 on two important benchmarks.
45 See the <a href="/performance/">performance page</a>
46 for the latest measurements of Dart and JavaScript code.
47 </p>
48
49 </section>
50
25 51
26 <h4> Contents </h4> 52 <h4> Contents </h4>
27 53
28 <ol class="toc"> 54 <ol class="toc">
29 <li> <a href="#key">Key features</a> </li>
30 <li> <a href="#goals">Design goals</a> </li> 55 <li> <a href="#goals">Design goals</a> </li>
31 <li> <a href="#code">Show me the code </a> 56 <li> <a href="#key">Language features</a>
32 <ol> 57 <ol>
33 <li> <a href="#classes">Classes and interfaces </a> </li> 58 <li> <a href="#lang-classes">Classes </a></li>
34 <li> <a href="#optional-types">Optional types </a> </li> 59 <li> <a href="#lang-optional-types">Optional types</a> </li>
60 <li> <a href="#lang-lexical-scope">Lexical scoping</a> </li>
61 <li> <a href="#lang-libraries">Libraries</a> </li>
62 <li> <a href="#lang-isolates">Isolates</a> </li>
63 <li> <a href="#lang-tooling">Toolability</a> </li>
64 </ol> </li>
65 <li> <a href="#code">Examples of Dart code</a>
66 <ol>
67 <li> <a href="#classes">Using classes </a></li>
68 <li> <a href="#optional-types">Adding types</a> </li>
69 <li> <a href="#browser">Writing web apps</a> </li>
35 </ol> 70 </ol>
36 </li> 71 </li>
37 <li> <a href="#howtouse">How can I use Dart? </a> 72 <li> <a href="#tools">Tools</a>
38 <ol> 73 <ol>
74 <li> <a href="#running">Dart code execution</a> </li>
39 <li> <a href="#editor">Dart Editor</a> </li> 75 <li> <a href="#editor">Dart Editor</a> </li>
40 <li> <a href="#mimetype">New MIME type </a> </li> 76 <li> <a href="#pub">The Pub package manager</a> </li>
41 </ol> 77 </ol></li>
42 </li> 78 <li> <a href="#libraries">Libraries</a> </li>
43 <li> <a href="#tools">Tools </a> </li> 79 <li> <a href="#get-started">Get started with Dart</a> </li>
44 <li> <a href="#libraries">Libraries </a> </li> 80 <li> <a href="#involved">More information</a> </li>
45 <li> <a href="#involved">Get involved </a> </li>
46 </ol> 81 </ol>
47 </section> 82 </section>
48 83
49
50 <section id="key">
51 <h2> Key features </h2>
52
53 <p>
54 Key features of the Dart language include:
55 </p>
56
57
58 <h3>Classes</h3>
59 <p>
60 Classes and interfaces provide a well understood mechanism
61 for efficiently defining APIs.
62 These constructs enable encapsulation and reuse of methods and data.
63 </p>
64
65 <h3>Optional types</h3>
66 <p>
67 Dart programmers can optionally add static types to their code.
68 Depending on programmer preference and stage of application development,
69 the code can migrate from a simple, untyped experimental prototype
70 to a complex, modular application with typing.
71 Because types state programmer intent,
72 less documentation is required to explain what is happening in the code,
73 and type-checking tools can be used for debugging.
74 </p>
75
76 <h3>Libraries</h3>
77 <p>
78 Developers can create and use libraries
79 that are guaranteed not to change during runtime.
80 Independently developed pieces of code can therefore
81 rely on shared libraries.
82 </p>
83
84 <h3>Tooling</h3>
85 <p>
86 Dart will include a rich set of
87 execution environments, libraries, and development tools
88 built to support the language.
89 These tools will enable productive and dynamic development,
90 including edit-and-continue debugging and beyond&mdash;up
91 to a style where you program an application outline, run it,
92 and fill in the blanks as you run.
93 </p>
94 </section>
95
96
97 <section id="goals"> 84 <section id="goals">
98 <h2> Design goals </h2> 85 <h2> Design goals </h2>
99 86
100 <p> 87 <p>
101 The Dart programming language is presented here in its early stages. 88 The following design goals guide
102 The following design goals will guide 89 the continued evolution and refinement of this project:
103 the continued evolution and refinement of this open source project:
104 </p> 90 </p>
105 91
106 <ul> 92 <ul>
107 <li>Create a <b>structured yet flexible</b> 93 <li>Create a <b>structured yet flexible</b>
108 programming language for the web.</li> 94 programming language for the web.</li>
109 <li>Make Dart feel <b>familiar and natural</b> to programmers 95 <li>Make Dart feel <b>familiar and natural</b> to programmers
110 and thus easy to learn.</li> 96 and thus easy to learn.</li>
111 <li>Ensure that all Dart language constructs allow 97 <li>Ensure that all Dart language constructs allow
112 <b>high performance</b> and 98 <b>high performance</b> and
113 <b>fast application startup</b>.</li> 99 <b>fast application startup</b>.</li>
114 <li>Make Dart appropriate for the 100 <li>Make Dart appropriate for the
115 <b>full range of devices on the web</b>&mdash;including 101 <b>full range of devices on the web</b>&mdash;including
116 phones, tablets, laptops, and servers.</li> 102 phones, tablets, laptops, and servers.</li>
117 <li>Provide tools that make Dart run fast 103 <li>Provide tools that make Dart run fast across
118 <b>across all major modern browsers</b>. </li> 104 <b>all major modern browsers</b>. </li>
119 </ul> 105 </ul>
120 106
121 <p> 107 <p>
122 These design goals address the following problems 108 These design goals address the following problems
123 currently facing web developers: 109 currently facing web developers:
124 </p> 110 </p>
125 111
126 <ul> 112 <ul>
127 <li>Small scripts often evolve into 113 <li>Small scripts often evolve into
128 large web applications with no apparent structure&mdash;they&rsquo;re 114 large web applications with no apparent structure&mdash;they&rsquo;re
129 hard to debug and difficult to maintain. 115 hard to debug and difficult to maintain.
130 In addition, these monolithic apps can&rsquo;t be split up 116 In addition, these monolithic apps can&rsquo;t be split up
131 so that different teams can work on them independently. 117 so that different teams can work on them independently.
132 It&rsquo;s difficult to be productive 118 It&rsquo;s difficult to be productive
133 when a web application gets large.</li> 119 when a web application gets large.</li>
134 <li>Scripting languages are popular 120 <li>
135 because their lightweight nature makes it easy to write code quickly. 121 In scripting languages, the contracts with other parts of an application
136 Generally, the contracts with other parts of an application 122 are usually conveyed in comments rather than in the language structure its elf.
137 are conveyed in comments rather than in the language structure itself. 123 As a result, it can be difficult for someone other than the author
138 As a result, it&rsquo;s difficult for someone other than the author
139 to read and maintain a particular piece of code.</li> 124 to read and maintain a particular piece of code.</li>
140 <li>With existing languages, 125 <li>Before Dart,
141 the developer is forced to make a choice between 126 the developer was forced to make a choice between
142 static and dynamic languages. 127 static and dynamic languages.
143 Traditional static languages require heavyweight toolchains 128 Traditional static languages require heavyweight toolchains
144 and a coding style that can feel inflexible and overly constrained.</li> 129 and a coding style that can feel inflexible and overly constrained.</li>
145 <li>Developers have not been able to create homogeneous systems 130 <li>Developers have not been able to create homogeneous systems
146 that encompass both client and server, 131 that encompass both client and server,
147 except for a few cases such as Node.js and Google Web Toolkit (GWT). 132 except for a few cases such as Node.js and Google Web Toolkit (GWT).
148 </li> 133 </li>
149 <li>Different languages and formats entail context switches 134 <li>Different languages and formats entail context switches
150 that are cumbersome and add complexity to the coding process.</li> 135 that are cumbersome and add complexity to the coding process.</li>
151 </ul> 136 </ul>
137
138 </section>
139
140
141
142 <section id="key">
143 <h2> Language features </h2>
144
145 <p>
146 Key features of the Dart language include
147 classes, optional types, lexical scoping, libraries, isolates, and toolability .
148 </p>
149
150 <p>
151 Although Dart is designed to be familiar,
152 we took the opportunity to fix
153 some problematic features of common languages.
154 We also introduced a few good features from lesser known languages.
155 Some Dart features you might not expect include
156 top-level functions,
157 optional parameters,
158 string interpolation,
159 multi-line strings,
160 dynamic method handling (<code>noSuchMethod</code>),
161 a cascade operator (<code>..</code>), and
162 a function shorthand syntax (<code>=></code>).
163 Details are in the
164 <a href="/docs/dart-up-and-running/ch02.html">language tour</a>.
165 </p>
166
167
168 <h3 id="lang-classes">Classes</h3>
169 <p>
170 Classes provide a well understood mechanism
171 for efficiently defining APIs.
172 Each class implicitly defines an interface.
173 Together, classes and interfaces
174 enable encapsulation and reuse of methods and data.
175 </p>
176
177 <h3 id="lang-optional-types">Optional types</h3>
178 <p>
179 Optional types can help a Dart program scale from a quick prototype
180 into a complex, modular application.
181 While a small program or prototype might not have type annotations,
182 you always have the option of adding them.
183 Types make the code's intent clearer,
184 which helps developers to understand the code.
185 Types also enable more powerful tools
186 for writing and debugging code.
187 </p>
188
189 <h3 id="lang-lexical-scope">Lexical scoping</h3>
190 <p>
191 Scoping rules in Dart make sense.
192 Each identifier is scoped to the block it's declared in,
193 which means that you can tell a variable's scope
194 by looking at the braces in your code <code>{...}</code>.
195 Even in a closure within a loop,
196 the value of a variable is what you intuitively expect.
197 </p>
198
199
200 <h3 id="lang-libraries">Libraries</h3>
201 <p>
202 Developers can create and use libraries
203 that are guaranteed not to change during runtime.
204 Independently developed pieces of code can therefore
205 rely on shared libraries.
206 </p>
207
208 <h3 id="lang-isolates">Isolates</h3>
209 <p>
210 Modern web browsers, even on mobile platforms,
211 run on multi-core CPUs.
212 To take advantage of all those cores,
213 developers traditionally use shared-memory threads running concurrently.
214 However, shared-state concurrency is error prone
215 and can lead to complicated code.
216 Instead of threads, all Dart code runs inside of isolates.
217 Each isolate has its own memory heap,
218 ensuring that no isolate’s state is accessible from any other isolate.
219 </p>
220
221 <h3 id="lang-tooling">Toolability</h3>
222 <p>
223 Dart is designed to work well with tools.
224 A rich set of execution environments, libraries, and development tools
225 have already been built to support the language.
226 Dart's toolability enables productive and dynamic development,
227 including edit-and-continue debugging and beyond&mdash;up
228 to a style where you program an application outline, run it,
229 and fill in the blanks as you run.
230 </p>
152 </section> 231 </section>
153 232
154 233
155 <section id="code"> 234 <section id="code">
156 <h2>Show me the code</h2> 235 <h2>Examples of Dart code</h2>
157 236
158 <p> 237 <p>
159 Here are several code snippets 238 Here are some code snippets
160 to give you a feel for what Dart code looks like. 239 to give you a feel for what Dart code looks like.
161 </p> 240 </p>
162 241
163 <section id="classes"> 242 <section id="classes">
164 <h3>Classes and interfaces</h3> 243 <h3>Using classes</h3>
165 244
166 <p> 245 <p>
167 Dart&rsquo;s interfaces and classes provide you with 246 Dart&rsquo;s classes provide
168 a set of reusable and extensible building blocks. 247 a set of reusable and extensible building blocks.
169 An <em>interface</em> defines a basic set of methods and constants, 248 A <em>class</em> defines methods and data
170 sometimes by inheriting from other interfaces. 249 and can provide method implementations.
171 A <em>class</em> can implement multiple interfaces, 250 Every <em>object</em> is an instance of a class.
172 but it only inherits from a single superclass.
173 </p> 251 </p>
174 252
175 <p> 253 <p>
176 The following example defines an interface, 254 Each class implicitly defines an <em>interface</em>.
177 along with a class and subclass that implement it: 255 A class can implement multiple interfaces,
256 but it only <em>extends</em>—inherits implementation from—a
257 single superclass.
258 </p>
259
260 <p>
261 The following example shows the code for three classes.
262 The first class, Shape, is an <em>abstract class</em>&mdash;a
263 class that can't be instantiated.
264 The second class, Rectangle,
265 implements the interface defined by Shape.
266 The third class, Square, is a subclass of Rectangle.
178 </p> 267 </p>
179 268
180 {% highlight dart %} 269 {% highlight dart %}
181 interface Shape { 270 abstract class Shape {
182 num perimeter(); 271 num perimeter();
183 } 272 }
184 273
185 class Rectangle implements Shape { 274 class Rectangle implements Shape {
186 final num height, width; 275 final num height, width;
187 Rectangle(num this.height, num this.width); // Compact constructor syntax. 276 Rectangle(this.height, this.width); // Compact constructor syntax.
188 num perimeter() => 2*height + 2*width; // Short function syntax. 277 num perimeter() => 2*height + 2*width; // Function shorthand syntax.
189 } 278 }
190 279
191 class Square extends Rectangle { 280 class Square extends Rectangle {
192 Square(num size) : super(size, size); 281 Square(num size) : super(size, size);
193 } 282 }
194 {% endhighlight %} 283 {% endhighlight %}
195 284
196 </section> <!-- classes --> 285 </section> <!-- classes -->
197 286
198 287
199 <section id="optional-types"> 288 <section id="optional-types">
200 <h3>Optional types</h3> 289 <h3>Adding types</h3>
201 290
202 <p> 291 <p>
203 Dart provides, at the programmer&rsquo;s option, 292 Dart provides, at the programmer&rsquo;s option,
204 a mixture of static and dynamic checking. 293 a mixture of static and dynamic checking.
205 When experimenting, 294 When experimenting,
206 the programmer can write untyped code for simple prototyping. 295 the programmer can write untyped code for simple prototyping.
207 As the application becomes larger and more stable, 296 As the application becomes larger and more stable,
208 types can be added to aid debugging and impose structure where desired. 297 types can be added to aid debugging and impose structure.
209 </p> 298 </p>
210 299
211 <p> 300 <p>
212 For example, here is a sample of untyped code in Dart 301 For example, here is a sample of simple, untyped code in Dart.
213 that creates a new Point class that has parameters
214 <code>x</code> and <code>y</code>
215 and two methods:
216 <code>scale()</code> and <code>distance()</code>.
217 </p> 302 </p>
218 303
219 {% highlight dart %} 304 {% highlight dart %}
220 import 'dart:math'; 305 recalculate(origin, offset, estimate) {
221 306 // ...
222 class Point {
223 var x, y;
224 Point(this.x, this.y);
225 scale(factor) => new Point(x*factor, y*factor);
226 distance() => sqrt(x*x + y*y);
227 }
228
229 main() {
230 var a = new Point(2,3).scale(10);
231 print(a.distance());
232 } 307 }
233 {% endhighlight %} 308 {% endhighlight %}
234 309
235 <p> 310 <p>
236 Here is what this code looks like with types added 311 Here is what this code looks like with a few types added
237 that ensure that 312 to make the API clearer.
238 <code>x</code>, <code>y</code>, and <code>factor</code>
239 are of type <code>num</code>,
240 and that a <code>Point</code> contains two values
241 of type <code>num</code>:
242 </p> 313 </p>
243 314
244 {% highlight dart %} 315 {% highlight dart %}
245 import 'dart:math'; 316 num recalculate(Point origin, num offset, {bool estimate:false}) {
246 317 // ...
247 class Point {
248 num x, y;
249 Point(num this.x, num this.y);
250 Point scale(num factor) => new Point(x*factor, y*factor);
251 num distance() => sqrt(x*x + y*y);
252 }
253
254 void main() {
255 Point a = new Point(2,3).scale(10);
256 print(a.distance());
257 } 318 }
258 {% endhighlight %} 319 {% endhighlight %}
259 320
321 <p>
322 Besides adding types, the second sample
323 refines the API by making the third parameter optional
324 and giving it a default value.
325 </p>
326
260 </section> <!-- optional types --> 327 </section> <!-- optional types -->
261 </section> <!-- code -->
262 328
263 <section id="howtouse"> 329 <section id="browser">
264 <h2>How can I use Dart?</h2> 330 <h3>Writing web apps</h3>
265 331
266 <p> 332 <p>
267 You can run Dart code in several ways: 333 Dart code can be compiled to JavaScript
268 </p> 334 that runs in any modern browser.
269 335 Dart code can also run directly in browsers that have a Dart VM,
270 <ul> 336 including Dartium and eventually Chrome.
271 <li> 337 Here's an example of an HTML file that loads Dart code:
272 <p>
273 Compile Dart code to JavaScript that can run in any modern browser:<br />
274 Chrome, Safari 5+, and Firefox 4+ (more browser support coming shortly)
275 </p>
276 </li>
277 <li>
278 <p>
279 Execute Dart code directly in a VM on your computer
280 </p>
281 </li>
282 <li>
283 <p>
284 With a <a href="#mimetype">new MIME type</a>,
285 use Dart in a browser
286 without first compiling to JavaScript
287 </p>
288 </li>
289 </ul>
290
291 <section id="editor">
292 <h3>Dart Editor</h3>
293
294 <p>
295 Dart Editor is a tool for
296 creating, modifying, and launching Dart web apps.
297 With one click, you can compile a Dart web app to JavaScript
298 and launch the app in a browser.
299 Taking advantage of Dart&rsquo;s structured nature,
300 Dart Editor supports method name completion and refactoring.
301 </p>
302
303 <p>
304 For information about downloading and using Dart Editor, see the
305 <a href="/docs/editor/getting-started/">Dart Editor tutorial</a>.
306 </p>
307 </section>
308
309 <section id="mimetype">
310 <h3>New MIME type</h3>
311
312 <p>
313 You will be able to link to a Dart program directly from an HTML page.
314 Here is the proposed new MIME type,
315 &ldquo;application/dart&rdquo;:
316 </p> 338 </p>
317 339
318 {% highlight html %} 340 {% highlight html %}
319 <!DOCTYPE html> 341 <!DOCTYPE html>
342 <html>
343 <head> <title>Simple Dart Web App</title> </head>
344 <body>
345 <h1>Simple Dart Web App</h1>
346 <button id="button-text"></button>
347 <output id="msg"></output>
320 348
321 <html> 349 <script type="application/dart" src="app.dart"></script>
322 <head> 350 <script src="https://dart.googlecode.com/svn/branches/bleeding_edge/dart/cli ent/dart.js"></script>
323 <title>Simple Dart Web App</title> 351
324 </head>
325 <body>
326 <h1>Simple Dart Web App</h1>
327 <h2 id="status">dart is starting up...</h2>
328 <script type="application/dart" src="SimpleDartWebApp.dart"></script>
329 <script src="http://dart.googlecode.com/svn/branches/bleeding_edge/dart/clie nt/dart.js"></script>
330 </body> 352 </body>
331 </html> 353 </html>
332 {% endhighlight %} 354 {% endhighlight %}
333 355
334 <p> 356 <p>
335 The dart.js file above will swap out the <code>application/dart</code> 357 The first &lt;script> tag in this example
336 tag with a <code>text/javascript</code> tag if the browser does not 358 loads the code from app.dart.
337 have an embedded Dart virtual machine. 359 If the browser has an embedded Dart VM,
360 then the browser loads Dart code,
361 which has the MIME type <code>application/dart</code>.
362 Otherwise, the browser loads the code's JavaScript equivalent,
363 thanks to the <code>dart.js</code> script
364 in the second &lt;script> tag.
338 </p> 365 </p>
339 366
340 <p> 367 <p>
341 The following is the Dart code for the page above: 368 Here is the code in app.dart:
342 </p> 369 </p>
343 370
344 {% highlight dart %} 371 {% highlight dart %}
345 import 'dart:html'; 372 import 'dart:html';
346 373
347 class SimpleDartWebApp { 374 main() {
348 void run() { 375 query('#button-text')
349 write("Hello World!"); 376 ..text = "Click me!"
350 } 377 ..on.click.add(respond);
351
352 void write(String message) {
353 // the HTML library defines a global "document" variable
354 document.query('#status').innerHTML = message;
355 }
356 } 378 }
357 379
358 void main() { 380 respond(event) {
359 new SimpleDartWebApp().run(); 381 query("#msg").text = "You clicked the button!";
360 } 382 }
361 {% endhighlight %} 383 {% endhighlight %}
362 </section> <!-- howtouse --> 384
363 </section> <!-- mimetype --> 385 <p>
386 The main() function's call to query()
387 returns the HTML element that has the ID "button-text".
388 The code then uses the cascade operator (<code>..</code>)
389 to perform multiple operations on that element.
390 The first operation initializes
391 the element's <code>text</code> property,
392 and the second adds an event handler to the element.
393 </p>
394
395 <p>
396 Libraries and frameworks will
397 ease the task of developing sophisticated web apps.
398 For example, the libraries and tools in the
399 <a href="http://www.dartlang.org/articles/dart-web-components/">Web UI</a>
400 package provide web components, templates, data binding,
401 and encapsulation.
402 Just to give you a taste of the Web UI package,
403 here's an example of one-way data binding in an HTML file:
404 </p>
405
406 {% highlight html %}
407 {% raw %}
408 <!-- HTML code... -->
409 <div>
410 The current time is: {{currentTime}}
411 </div>
412 <!-- more HTML code... -->
413 {% endraw %}
414 {% endhighlight %}
415
416 <p>
417 In the rendered page,
418 <code>{{'{{'}}currentTime}}</code> is replaced by
419 the value of the top-level <code>currentTime</code> variable
420 from the following Dart code:
421 </p>
422
423 {% highlight dart %}
424 String currentTime;
425
426 void main() {
427 Date today = new Date.now();
428 currentTime = formatTime(today.hour, today.minute, today.second);
429 }
430
431 // ...The formatTime() function and any other code goes here...
432 {% endhighlight %}
433
434 </section> <!-- browser -->
435
436 </section> <!-- code -->
364 437
365 438
366 <section id="tools"> 439 <section id="tools">
367 <h2>Tools</h2> 440 <h2>Tools</h2>
368 441
369 <p> 442 <p>
370 The Dart language is accompanied by a set of tools 443 The Dart language is accompanied by a set of tools
371 to aid rapid prototyping, coding, and debugging 444 to aid rapid prototyping, coding, and debugging
372 for the entire development cycle. 445 for the entire development cycle.
373 Offerings include: 446 Offerings include:
374 </p> 447 </p>
375 448
376 <ul> 449 <ul>
377 <li>The Dart Editor</li> 450 <li><b>Dart Editor:</b> A Dart-savvy editor that supports creating, modifying, running, and debugging Dart apps</li>
378 <li>The dart2js compiler</li> 451 <li><b>Pub:</b> A package manager that features libraries published on <a href ="http://pub.dartlang.org/">pub.dartlang.org</a></li>
379 <li>The Dart VM</li> 452 <li><b>dart2js:</b> The Dart-to-JavaScript compiler</li>
380 <li>Dartium: Chromium with an embedded Dart VM</li> 453 <li><b>dart:</b> The Dart VM</li>
454 <li><b>Dartium:</b> Chromium with an embedded Dart VM</li>
381 </ul> 455 </ul>
382 456
457 <section id="running">
458 <h3>Dart code execution</h3>
459
383 <p> 460 <p>
384 On the client side, you can deploy Dart apps in two ways. 461 On the client side, you can deploy Dart apps in two ways.
385 For browsers without an embedded Dart VM, 462 For browsers without an embedded Dart VM,
386 you can compile the Dart code to JavaScript, 463 you can compile the Dart code to JavaScript,
387 using the dart2js compiler. This compiler generates ECMAScript5-compatible 464 using the <b>dart2js</b> compiler.
388 JavaScript from the Dart code. Dart code can run 465 This compiler generates ECMAScript5-compatible
389 directly in browsers that have a Dart VM, 466 JavaScript from the Dart code.
390 including Dartium (a special build of Chromium) 467 This JavaScript code works in the latest versions of
391 and eventually Chrome. 468 Chrome, Safari, and Firefox,
469 plus IE9+, mobile Safari, and Chrome for Android.
470 Dart code can run directly in browsers
471 that have a Dart VM,
472 including Dartium and eventually Chrome.
392 </p> 473 </p>
393 474
394 <p> 475 <p>
395 On the server side, the Dart code runs directly on the command line, 476 On the server side, the Dart code runs directly on the command line,
477 using the <b>dart</b> tool,
396 for fast iteration and for cloud-based tasks. 478 for fast iteration and for cloud-based tasks.
397 </p> 479 </p>
398 480
481 <p>
399 <img src="images/source-flow.png" 482 <img src="images/source-flow.png"
400 alt="Dart source -> Dart Editor; Dart Editor -> either [Dart VM] or [JavaSc ript source -> Browser (JavaScript Engine)]" 483 alt="Dart source -> either [Dart VM] or [dart2js -> JavaScript source -> Br owser (JavaScript Engine)]">
401 width="266" height="417" > 484 </p>
485
486 </section>
487
488 <section id="editor">
489 <h3>Dart Editor</h3>
490
491 <p>
492 Dart Editor is based on Eclipse components,
493 but it has a simplified user interface.
494 </p>
495
496 <aside>
497 <div class="alert alert-info">
498 <strong>Note:</strong>
499 You aren't limited to using Dart Editor.
500 If you prefer Eclipse, IntelliJ, or WebStorm,
501 you can download Dart plugins for those IDEs.
502 Dart configurations also exist for popular text editors
503 such as Vim, Emacs, TextMate, and Sublime.
504 </div>
505 </aside>
506
507 <p>
508 Features of Dart Editor include:
509 </p>
510
511 <ul>
512 <li> Easy launching of both web apps and command-line apps </li>
513 <li> Interactive debugging of both web apps (with Dartium)
514 and command-line apps </li>
515 <li> Static analysis to catch errors and potential problems </li>
516 <li> Code completion </li>
517 <li> Code navigation </li>
518 <li> Refactoring </li>
519 <li> Auto-update of the editor, SDK, and Dartium </li>
520 <li> Code update help for breaking changes
521 to the language and bundled libraries </li>
522 </ul>
523
524 <p>
525 The following screenshot shows
526 Dart Editor being used to debug a web app.
527 </p>
528
529 <p>
530 <img src="images/DartEditor-debugger.png"
531 alt="screenshot of Dart Editor debugging a web app">
532 </p>
533
534 <p>
535 To get the tools and find more information, go to the
536 <a href="/downloads.html">downloads page</a>.</p>
537
538 </section>
539
540 <section id="pub">
541 <h3>The Pub package manager</h3>
542
543 <p>
544 Pub is a package mananger for Dart.
545 It helps developers reuse existing Dart code
546 and bundle Dart apps and libraries
547 for reuse and sharing with other people.
548 Pub handles versioning and dependency management.
549 </p>
550
551 <p>
552 You can use Pub either at the command line
553 or through Dart Editor.
554 Because Pub is part of the SDK,
555 it's updated whenever Dart Editor or the SDK is updated.
556 </p>
557
558 <p>
559 For more information, go to
560 <a href="http://pub.dartlang.org/">pub.dartlang.org</a>.
561 </p>
562
563 </section>
402 </section> 564 </section>
403 565
404 566
405 <section id="libraries"> 567 <section id="libraries">
406 <h2>Libraries</h2> 568 <h2>Libraries</h2>
407 569
408 <p> 570 <p>
409 Dart provides the following libraries 571 Dart provides several libraries
410 to support web and web server development: 572 to support web and web server development.
573 The
574 <a href="/docs/dart-up-and-running/ch03.html">library tour</a>
575 and the
576 <a href="http://api.dartlang.org">API reference</a>
577 have details on all the bundled Dart libraries.
578 Bundled libraries include the following (and more):
411 </p> 579 </p>
412 580
413 <dl> 581 <dl>
414 <dt> <a href="http://api.dartlang.org/dart_core.html">Core Library</a> </dt> 582 <dt> <a href="http://api.dartlang.org/dart_core.html">Core library</a> </dt>
415 <dd> Contains interfaces to support 583 <dd> Common data structures and operations.
416 common data structures and operations.
417 </dd> 584 </dd>
418 <dt> <a href="http://api.dartlang.org/html.html">HTML Library</a> </dt> 585 <dt> <a href="http://api.dartlang.org/dart_html.html">HTML library</a> </dt>
419 <dd> Contains interfaces to the HTML5 DOM, 586 <dd> The interface to the HTML5 DOM,
420 loosely based on the proposed HTML5 standard 587 loosely based on the proposed HTML5 standard
421 as specified by the W3C/WHATWG. 588 as specified by the W3C/WHATWG.
422 These interfaces will evolve in parallel with 589 This library is evolving in parallel with
423 the HTML5 standards.</dd> 590 the HTML5 standards.</dd>
424 591
425 <dt> <a href="http://api.dartlang.org/io.html">I/O Library</a> </dt> 592 <dt> <a href="http://api.dartlang.org/dart_io.html">I/O library</a> </dt>
426 <dd> Contains interfaces to read and write files, open directories, 593 <dd> Server-side support for I/O:
427 open network sockets, and run HTTP servers. This library is for 594 read and write files, open directories,
428 command-line Dart programs. 595 open network sockets, and run HTTP servers.
429 </dd> 596 </dd>
430 597
431 <dt> <a href="http://api.dartlang.org/dart_isolate.html">Isolate Library</a> < /dt> 598 <dt> <a href="http://api.dartlang.org/dart_isolate.html">Isolate library</a> < /dt>
432 <dd> 599 <dd>
433 Contains interfaces for spawning and communicating with isolates, 600 Support for spawning and communicating with isolates,
434 the mechanism for concurrency and security in a Dart program. 601 the mechanism for concurrency and security in a Dart program.
435 </dd> 602 </dd>
436 603
437 <dt> <a href="http://api.dartlang.org/crypto.html">Crypto Library</a> </dt> 604 <dt> <a href="http://api.dartlang.org/dart_json.html">JSON library</a> </dt>
438 <dd> 605 <dd>
439 Contains interfaces for creating one-way hashes (SHA1, MD5, SHA256) 606 Support for parsing and producing JSON-encoded text.
440 and HMAC support.
441 </dd> 607 </dd>
442 608
443 <dt> <a href="http://api.dartlang.org/json.html">JSON Library</a> </dt> 609 <dt> <a href="http://api.dartlang.org/dart_math.html">Math library</a> </dt>
444 <dd> 610 <dd>
445 Contains the ability to parse and produce JSON-encoded text. 611 Common functionality such as sine and cosine,
446 </dd> 612 maximum and minimum,
447 613 and constants such as <em>pi</em> and <em>e</em>.
448 <dt> <a href="http://api.dartlang.org/unittest.html">Unit Test Library</a> </d t>
449 <dd>
450 Contains functions and classes for writing unit tests in Dart.
451 </dd> 614 </dd>
452 </dl> 615 </dl>
453 616
454 <p> 617 <p>
455 See the 618 The <a href="http://pub.dartlang.org">pub.dartlang.org</a> site
456 <a href="/docs/dart-up-and-running/ch03.html">library tour</a> 619 has many additional libraries and tools.
457 and the 620 Here are just a few:
458 <a href="http://api.dartlang.org">API reference</a> docs for
459 details on all the bundled
460 Dart libraries.
461 </p> 621 </p>
462 622
623 <dl>
624 <dt> <a href="http://pub.dartlang.org/packages/js">JavaScript Interop</a>
625 </dt>
626 <dd> Use JavaScript from Dart code. </dd>
627
628 <dt> <a href="http://pub.dartlang.org/packages/unittest">Unit test</a> </dt>
629 <dd> Write unit tests for Dart code. </dd>
630
631 <dt> <a href="http://pub.dartlang.org/packages/web_ui">Web UI</a> </dt>
632 <dd> Build web apps using an API based on Web Components,
633 with additional features inspired by model-driven views. </dd>
634
635 <dt> <a href="http://pub.dartlang.org/packages/meta">Meta</a> </dt>
636 <dd> Use annotations to give tools
637 additional semantic information about your program. </dd>
638 </dl>
639
463 </section> <!-- libraries --> 640 </section> <!-- libraries -->
464 641
465 642
466 <section id="involved"> 643 <section id="get-started">
467 <h2>Get involved</h2> 644 <h2>Get started with Dart</h2>
468 645
469 <p> 646 <p>
470 This project is open source 647 You can get started with Dart in two easy steps:
471 and will evolve with feedback and participation from the community. 648 </p>
472 We have released the draft language specification at an early stage 649
473 to gather responses from the developers 650 <ol>
474 who will be using this new language and infrastructure for web programming. 651 <li> <a href="/docs/editor/">Download Dart Editor</a> </li>
475 Here are some additional links for learning more about Dart 652 <li> <a href="/docs/tutorials/">Follow the tutorials</a> </li>
476 and providing your feedback: 653 </ol>
654
655 <p>
656 Then join the community,
657 so you can get help, meet other Dart developers,
658 and find out the latest news:
477 </p> 659 </p>
478 660
479 <ul> 661 <ul>
480 <li> 662 <li>
481 Other pages in the Dart website, 663 <a href="https://plus.google.com/+dartlang">Dart page on Google+</a>
482 such as the <a href="/docs/dart-up-and-running/ch02.html">language tour</a>, 664 </li>
665 <li>
666 <a href="https://plus.sandbox.google.com/communities/114566943291919232850"> Dartisans community on Google+</a> </li>
667 <li>
668 <a href="http://stackoverflow.com/questions/tagged/dart">Dart on Stack Overf low</a> </li>
669 </ul>
670
671 </section> <!-- get-started -->
672
673
674 <section id="involved">
675 <h2>More info</h2>
676
677 <p>
678 Here are some additional resources for learning about Dart
679 and providing feedback:
680 </p>
681
682 <ul>
683 <li>
684 This website,
685 especially the
686 <a href="/docs/dart-up-and-running/ch02.html">language tour</a>,
483 <a href="/docs/dart-up-and-running/ch03.html">library tour</a>, 687 <a href="/docs/dart-up-and-running/ch03.html">library tour</a>,
484 tutorials, and <a href="/docs/spec/">language specification</a>. 688 <a href="/articles/">articles</a>,
689 and <a href="/docs/dart-up-and-running/ch05.html">Dart Chat walkthrough</a>
485 </li> 690 </li>
486 <li> 691 <li>
487 <a href="https://code.google.com/p/dart/">Dart project</a> 692 The <a href="https://groups.google.com/a/dartlang.org/group/misc/">Dart
488 with issue tracker and source code </li> 693 discussion group</a> (misc at dartlang.org)
694 </li>
489 <li> 695 <li>
490 <a href="https://groups.google.com/a/dartlang.org/group/misc/">Dart 696 The Dart open-source project at
491 discussion group</a> (misc at dartlang.org) </li> 697 <a href="https://code.google.com/p/dart">code.google.com/p/dart</a>
698 </li>
492 <li> 699 <li>
493 <a href="https://plus.google.com/109866369054280216564/">+Dart</a> on Google + </li> 700 Additional open-source projects from the Dart team at
701 <a href="https://github.com/dart-lang">github.com/dart-lang</a>
702 </li>
494 </ul> 703 </ul>
495 704
496 </section> <!-- involved --> 705 </section> <!-- involved -->
497 706
498
OLDNEW
« no previous file with comments | « src/site/docs/technical-overview/images/source-flow.png ('k') | src/site/support/index.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698