14
Germán Quiróz Bogner

¿Qué es Dart

Embed Size (px)

DESCRIPTION

Explicación de Dart

Citation preview

  • Germn Quirz Bogner

  • Qu es Dart?

    Basado en Material escrito por Seth Ladd & Kathy Walrath.Traducido y actualizado por: Germn Quirz Bogner y Fernanda Goi. Santa Fe de la Vera Cruz, Santa Fe, Argentina.

    Marzo 2014.

  • Tabla de Contenidos

    Qu es Dart?Por qu Google cre Dart?Puede la Web realmente necesitar otro lenguaje?Mustrame el cdigoCmo puedo jugar con Dart?Qu tal un editor Real?Qu hay de nuevo con Dart?Por qu Dart luce tan familiar?Qu hay en la Plataforma de Dart?Puedo usar Dart para mi Aplicacin Web hoy?Cmo esperas que las personas usen Dart?Cmo puedo compilar a JavaScript?Qu libreras hay disponibles?

    dart:coredart:htmldart:io

    Mustrame ms cdigoTiposGeneralesManipulando el DOMAislamientos

    Dnde puedo aprender ms?

  • Qu es Dart?

    Dart es un nuevo lenguaje desarrollado por Google que est llamando la atencin en los crculos de desarrolladores de aplicaciones web.

    Por qu Google Cre Dart?El objetivo de Google es que tu puedas crear grandes aplicaciones web. Grandes

    aplicaciones web mejoran la web, y cuando la web mejora, todo el mundo gana.Los ingenieros de Google han estado pensando en las aplicaciones web durante

    mucho tiempo. Han escrito un montn de aplicaciones web a gran escala, complejas y ampliamente utilizadas (crearon GMail, Google+ y Google Docs), as que estn muy familiarizados con los retos de las arquitecturas de las aplicaciones web.

    Tambin han escrito un navegador (Chrome) y un motor de JavaScript (V8), por lo que han pensado mucho sobre cmo hacer que las aplicaciones web funcionen ms rpido.

    Bsicamente, crearon Dart porque creen que va a ayudar a traer ms aplicaciones muy buenas para la web, y creen que debera ser ms fcil para crear aplicaciones web ms complejas.

    Puede la Web realmente necesitar otro lenguaje?

    Los desarrolladores de Aplicaciones de todas las plataformas deben ser capaces de construir para la web moderna, pero los desarrolladores web no endmico tienen diferentes expectativas y necesidades de su lenguaje, herramientas, y la plataforma de desarrollo de lo que est disponible hoy en da. Los ingenieros de Google creen que hay espacio para una nueva plataforma, una que no est cubierta de 15 aos de polvo, que es familiar para los desarrolladores de diferentes orgenes, y que est estructurado para las largas y complejas aplicaciones que los usuarios estn demandando.

    Ellos no creen que JavaScript se va a acabar. Al contrario, Google trabaja de manera activa junto al TC39 para mejorar JavaScript, y nuevas caractersticas que comienzan a implementarse en V8 y Chrome.

  • Sin embargo, el compromiso en mejorar JavaScript no les impide en pensar en otras soluciones. Por ejemplo, Dart aprovecha el continuo trabajo sobre JavaScript, ya que los programas en Dart compilan a JavaScript para correr sobre toda la web moderna.

    Ellos creen que Dart es una plataforma irresistible y familiar que conoce las necesidades de los desarrolladores de diferentes orgenes y experiencias, incluyendo a los endmicos desarrolladores web. Dart brinda nuevas y frescas ideas sobre hacia dnde va la programacin web, y qu innovaciones tanto en Dart como JavaScript pueden ayudar a empujar la web de los desarrolladores de aplicaciones hacia los usuarios.

    Mustrame el CdigoSuficiente charla, vamos a ver algo de cdigo. Si sabes JavaScript o Java, el cdigo

    de Dart debera resultarte familiar. He aqu un ejemplo de una pagina web sencilla en Dart:

    hola.dart

    #import(dart:html)

    main(){document.query(#status).text=Hola,Dart

    }hola.html

    ...

    ...

    Ahora vamos a ver un poco del cdigo de Dart que usa funciones:enviar(msj,destinatario,emisor,[rate=PrimeraClase]){

    return$emisordice$msja$destinatariovia$rate}

    main()=>print(enviar(hola,German,Fer))

    >GermandiceholaaFerviaPrimeraClase

    El uso de =>en la sintaxis implementado a main()esta bueno, es una manera compacta de implementar una funcin que evale y retorne un expresin simple. Sin el uso de =>, la implementacin del mtodo main() lucira de la siguiente manera:

    main(){print(enviar(hola,German,Fer))

    }

    En el mtodo enviar()implementado abajo, ratees un parmetro opcional con un valor por defecto. Este mtodo muestra la interpolacin de String trabajando ($var).

    Aqui un poco de cdigo Dart un poco ms orientado a objetos:

    classPunto{

  • Punto(this.x,this.y)distanciaA(otro){

    vardx=xotro.xvardy=yotro.yreturnMath.sqrt(dx*dx+dy*dy)

    }varx,y

    }

    main(){varp=newPunto(2,3)varq=newPunto(3,4)print(Distanciadepaq=$p.distanciaA(q))

    }ste cdigo puede parecer un poco familiar si tu has usado un lenguaje basado en

    clases con anterioridad.

    Cmo puedo jugar con Dart?La manera ms fcil de probar Dart es empleando Dartboard, un modo de

    ejecutar el cdigo de Dart en cualquier navegador moderno. Dartboard esta integrado en el sitio de Dart, en www.dartlang.org. Aunque tambin se puede usar Dartboard yendo directamente a try.dartlang.org. Aqu hay una imagen de lo que vers en el sitio:

    Cambia el cdigo como quieras, automticamente ir compilando tu cdigo y mostrar el resultado a la derecha, se ver algo as:

  • Como todas las cosas relacionadas con Dart, Dartboard sigue cambiando. Para la ltima informacin se recomienda ver el tutorial de Dartboard.

    Qu tal un editor Real? Cuando superes Dartboard, intenta Dart Editor. Es un editor descargable para

    Windows, Mac y Linux que te permite escribir, modificar y ejecutar aplicaciones web Dart. Dart Editor puede ejecutar tu cdigo Dart va la VM (Mquina Virtual), o puede compilarlo a JavaScript y probarlo en tu navegador. Aqu hay una imagen de cmo luce actualmente Dart Editor:

    Para ejecutar cualquier programa en Dart Editor, solamente clickea el botn Run mientras seleccionas algun item en esa galera de programas. Si tu programa es una aplicacin web, Dart Editor presenta Dartium (Chromium con una Dart VM integrada) para ejecutar el programa. Cuando ests listo para pasar del desarrollo a produccin Dart Editor puede compilarlo a JavaScript haciendo que tu aplicacin sea accesible para toda la web moderna.

    Dart Editor tiene diversas caractersticas para ayudarte con el cdigo Dart, se esperan ms caractersticas pronto. Como puedes ver en la captura de pantalla Dart Editor resalta la sintaxis de Dart. Dart Editor tambin soporta autocompletado, y rpidamente puede llevarte donde los tipos y otras APIs son declaradas. Tambin puedes obtener una rpida descripcin de tus clases, mtodos y campos.

    Puedes ver y descargar el tutorial de Dart Editor aqu: https://www.dartlang.org/codelabs/darrrt/

    Qu hay de nuevo con Dart?Bien ahora que ya ests familiarizado, vamos a hablar del lenguaje. Vamos a

    meternos dentro de las caracteristicas de Dart y su sintexis en detalle -- puedes leer sobre todas las caracteristicas y detalles en la sintaxis en ww.dartlang.org --, bien aqui estn algunas caracteristicas interesantes de DART:

    Tipos Opcionales: Tu puedes usar tipos o no, depende prcticamente de ti. Los

  • tipos en el cdigo de Dart no cambian la manera en que se ejecutan tus aplicaciones, pero su uso puede ayudar a otros desarrolladores a leer tu cdigo al programar herramientas. Es probable que no pongas atencin a los tipos mientras desarrollamos un prototipo, pero cuando deberas hacerlo cuando ests trabajando en una implementacin en produccin. Un patrn emergente es ir colocando tipos a las interfaces y mtodos, y omitir los tipos dentro de los mtodos.

    Snapshots: Actualmente, los navegadores necesitan analizar el cdigo fuente de una aplicacin web antes de que sta se pueda ejecutar. Dart permite la implementacin de Snapshots-- esto sera una grabacin de todo su estado en un punto de tiempo -- lo que significa un incremento considerable en la velocidad de carga. En un inicio, una aplicacin web con 54,000 lneas de cdigo en Dart inicia en unos 640ms sin el uso de snapshots. Con el uso de ste mtodo, puede iniciar en 60ms. Cuando tu pograma Dart corre sobre la Dart VM, se puede apreciar como ste inicia en un tiempo con mejor performance, gracias a el uso de snapshots.

    Aislamientos: Dart soporta ejecucin simultnea gracias al uso de aislamientos(Isolates), se puede pensar que es el proceso sin el uso de sobrecargas. Cada aislacin tiene su propia memoria y cdigo, que no pueden ser afectados por otra aislacin. La nica manera en que una aislacin puede comunicarse con otra aislacin es mediante mensajes. Las aislaciones permiten que una aplicacin web utilice a las computadoras con procesadores multi-ncleos de manera efectiva. Otro uso para las aislaciones: correr cdigo desde diferentes orgenes en la misma pgina, sin comprometer la seguridad.

    Interfaces con implementaciones por defecto: Ignora sta parte si tu nunca haz usado un lenguaje con caractersticas de uso de clases, interfaces o protocolos. Sigues aqu? OK. Si tu echas un vistazo a las libreras de Dart, vers que ellas usan interfaces en casos donde algn otro lenguaje usa clases --por ejemplo, para Dart y HashMap. Esto es posible porque un interface de Dart puede tener una implementacin por defecto-- una clase (usualmente privada) que es la manera por defecto de crear objetos que implementen la interface. Por ejemplo, a pesar de que Stopwatch es una interface, puedes llamar a new Stopwatch() para obtener una implementacin por defecto de Stopwatch. Si echas un vistazo a la documentacin de la API o el cdigo fuente, puedes ver que la implementacin por defecto de Stopwatch es una clase llamada StopwatchImplementation.

    Genricos, pero fciles: Los genricos se han hecho antes, pero han sido un poco confusos.Dart toma un nuevo enfoque mediante el diseo de un sistema de genricos que sea ms comprensible. La desventaja es tener que sacrificar un poco de exactitud, pero los ingenieros de Google creen que permite a los desarrolladores ser ms productivos y superar los diseos de lenguajes como Ivory.

    Librera HTML: Dart da una nueva mirada a la manera en que debe manejarse el HTML DOM. (DOM es la forma abreviada para Document Object Model; es la interfaz que te permite, mediante programacin, actualizar el contenido, la estructura y el estilo de una pgina web). Gracias a la creacin de una librera nativa en Dart (dart:html) se puede acceder y manipular el DOM; se crearon elementos, atributos y nodos para que se sienta natural la forma de trabajar con ellos.

  • Por qu Dart luce tan familiar? Vanguardismo y un lenguaje nico pueden ser hermosos, pero quizs esto tendra

    unos cinco usuarios. Dart est diseado para aprobacin masiva, as que tiene que resultar familiar para ambos, tanto usuarios de lenguaje de scripting (similar a JavaScript) como de lenguajes estructurados (similar a Java).

    An as Dart tiene en la mira algunas caractersticas nicas para el lenguaje prevaleciente. Por ejemplo, interfaces con implementos predeterminados ayudan disimulando detalles de implementacin. El tipo de variables opcional es otra caracterstica nueva para la web, debera ayudar dando mayor claridad al desarrollador acotando su intencin junto con las interfaces y libreras.

    Qu hay en la Plataforma de Dart?Dart es ms que slo un lenguaje, es una completa plataforma para los

    desarrolladores web modernos.

    Especificaciones del Lenguaje: El lenguaje Dart es familiar, con algunas nuevas caractersticas como el tipeo opcional y los aislamientos. Libreras: Las libreras del ncleo proveen funcionalidad incluyendo collections, dates, y math, como tambin enlaces HTML, I/O del lado del servidor como sockets e incluso JSON.Compilador a JavaScript: Tu puedes compilar tus programas en Dart a JavaScript que puede correr en la totalidad de la web moderna.VM: La mquina virtual est construida desde cero para correr el cdigo de Dart de forma nativa. La VM corre sobre la consola de las aplicaciones del lado servidor y puede ser embebida dentro de navegadores para correr aplicaciones del lado cliente.Integracin con Chromium: La Dart VM ha sido embebida dentro de del build de Chromium, se le dio el nick de Dartium, haciendo alusin a que las aplicaciones Dart pueden correr de forma nativa sin compilar a JavaScript.Editor de Dart: Este editor liviano, completo con sintaxis destacada y completado de cdigo, puede lanzar tu script en la VM o como una aplicacin web en Dartium. Incluso puede compilar tus aplicaciones a JavaScript y correrlas en otro navegador.

    Puedo usar Dart para mi Aplicacin Web hoy?Dart sigue cambiando, lo que te asegura de que tengas un lenguaje optimizado y

    actualizado permanentemente. Esto es gracias a que Dart tiene un cdigo libre y abierto a debate; de sta manera se incentiva a investigar Dart y proveer una retroalimentacin. Con un lenguaje con libreras establecidas, est calificado para la produccin de aplicaciones web Dart en todos los navegadores modernos gracias a su compilador Dar2JS, y se espera que pronto los navegadores modernos soporten Dart de forma nativa.

    Cmo esperas que las personas usen Dart? Puedes usar Dart para construir complejas aplicaciones de alto rendimiento para

    la web moderna. El lenguaje de Dart est diseado para trabajar en el cliente y el servidor, lo que significa que puedes usarlo para implementar y completar, de punta a punta, la aplicacin.

    Tambin pods usar Dart para ascender tu desarrollo, a medida que tu programa crece de un pequeo grupo de funciones a una larga coleccin de clases. Por ejemplo, el desarrollo web fomenta iteraciones de programacin extremadamente pequeas. As

  • mismo, mientras refinas tu idea, y tu programa crece en alcance y complejidad, probablemente tu cdigo necesite ms modularidad y encapsulacin. Dart te posibilita pasar fcilmente de funciones a clases, y de un cdigo no tipeado a uno tipeado.

    En cuanto al deploy, tienes dos opciones: compilando a JavaScript, o usando Dart VM. Para cdigo del lado cliente, compilarlo a JavaScript le da a tu cdigo de Dart la posibilidad de ejecutarse en navegadores modernos. Una futura versin de Chrome saldr con Dart VM incorporada, permitiendo ejecutar directamente tu cdigo Dart, sin la necesidad de que sea primero compilado a JavaScript.

    Cmo puedo compilar a JavaScript?Para poder compilar nuestro cdigo Dart a JavaScript utilizaremos la herramienta

    que nos provee el SDK de Dart, Dart2JS. ste compilador nos brinda ciertas caractersticas muy ventajosas, como por ejemplo que el cdigo JavaScript generado a partir de un cdigo Dart corre mucho ms rpido que si hubisemos escrito ese cdigo directamente en JavaScript gracias a la capacidad de minificacin que incrementa la performance del cdigo.

    Qu libreras estn disponibles?Veamos un poco sobre las libreras ms importantes en Dart:

    dart:coresta es la librera principal que todas tus aplicaciones dart debe contener, se carga de manera automtica por lo que no debemos especificar su importacin, ella nos permite el uso diferentes caractersticas, tipos y funciones. Echemos un vistazo a algunos:

    - Nmeros y booleanos.- Strings y Expresiones Regulares.- Collections.- Fecha y Hora (Date y Time).- Uri.- Errores.

    dart:htmlEsta librera nos proporciona todas las herramientas para el manejo del DOM y la interaccin con la UI. Por ejemplo:

    - Obtener objetos globales (document, window).- Encontrar elementos HTML (Elementos query() y queryAll() ).- Agregar y quitar eventos ( Propiedad on de los elementos).

    dart:ioEsta es una librera que trabaja del lado del Servidor y podemos utilizarla siempre que la VM de Dart est corriendo sobre uno. Unos ejemplos de que podemos hacer:

    - Leer y Escribir informacin (InputStream, OutputStream).- Abrir y Leer Archivos (File, Directory)- Conectar a Sockets en red (Socket).

    Puedes ver la documentacin completa de cada una de stas libreras en api.darlang.orgLa lista de libreras listadas en la documentacin es:

    - dart:async (Nos provee el soporte para trabajar de manera asncrona).- dart:collection- dart:convert (Codifica y decodifica para convertir entre diferentes

    representaciones de informacin, incluyendo JSON y UTF-8).- dart:core

  • - dart:html- dart:indexed_db- dart:io- dart:isolate- dart:js- dart:math- dart:mirrors- dart:svg- dart:typed_data- dart:web_audio- dart:web_gl- dart:web_sql

    Mustrame ms cdigoSe ha dado una informacin general sobre las ms interesantes caractersticas de

    Dart, y se ha mostrado algo de cdigo Dart; ahora se elaborarn, en algunas de esas caractersticas -- tipeos, genricos, aislaciones y manipulacin del DOM -- y se mostrar an ms cdigo.

    TiposAnteriormente se ha mostrado este ejemplo:

    classPunto{Punto(this.x,this.y)distanciaA(otro){

    vardx=xotro.xvardy=yotro.yreturnMath.sqrt(dx*dx+dy*dy)

    }varx,y

    }

    main(){varp=newPunto(2,3)varq=newPunto(3,4)print(Distanciadepaq=$p.distanciaA(q))

    }

    Quizs notes que el cdigo define y usa una clase, sta no tiene un tipo; stos son opcionales en Dart, no modifican la manera en la que el programa se ejecuta, pero hacen que el cdigo sea ms entendible por herramientas (como depuradores e IDEs) y desarrolladores (como si fuera tu reemplazo cuando te vas a un proyecto mucho mejor). Piensa a los tipos como anotaciones o documentacin que puede ayudar a herramientas y humanos a entender tu intencin mejor y a detectar errores ms rpido.

    Un buen lugar para empezar a agregar tipos es en los mtodos, las firmas e interfaces -- el rea superficial de tu programa -- . Mientras ms personas sean adheridas a tu proyecto, y ms clases sean generadas, ser til saber qu tipos son usados (y devueltos) por mtodos.

  • classPunto{Punto(this.x,this.y)numdistanciaA(Puntootro){

    vardx=xotro.xvardy=yotro.yreturnMath.sqrt(dx*dx+dy*dy)

    }numx,y

    }

    main(){varp=newPunto(2,3)varq=newPunto(3,4)print(Distanciadepaq=$p.distanciaA(q))

    }

    Nota como no se han agregado tipos al cuerpo del mtodo de distanciaA(). Un patrn emergente a la hora de leer un cdigo en Dart es usar tipos en mtodos al declararlos pero no en el cuerpo del mtodo, en su scope. El scope o cuerpo de un mtodo cuerpo debera ser lo suficientemente pequeo para ser entendido fcilmente, y se esperan herramientas para realizar una inferencia de tipos variables en el mismo punto. Sin embargo, si prefieres usar tipos en todos lados, eres libre de hacerlo para cambiar de var dx a num dx, y as sucesivamente.

    GenricosSi tu nunca has usado tipos genricos antes -- o tal vez si -- ver algo como List

    en la documentacin de la API, puede resultar un poco aterrador. Pero no te preocupes, los genricos en Dart son muy fciles.

    Por ejemplo, si no te importa que tipos de objetos hay en la lista, entonces, puedes crear una lista como esta:

    newList()

    Si sabes que tu lista slo tendr un tipo de objeto en ella -- slo restricciones, por ejemplo -- entonces puedes (pero no necesariamente tienes que hacerlo) declararlo cuando crees la Lista:

    newList()

    Por qu molestarse con tanta ceremonia? Especificando qu tipos puede tener tu coleccin, es una buena manera de dar conocimiento a tus colegas programadores, y a tus herramientas que expectativas tienes. As las herramientas en tiempo de ejecucin (runtime) pueden detectar errores ms rpidamente.

    (Nota: newList()es la manera acortada para newList(). Dynamic es el tipo usado detras de escena para las variables definidas).

    Aqu hay algunos ejemplos de como Dart adopta diferentes tipos y colecciones de variables indefinidas. Si ests familiarizado con genricos en Java, presta mucha atencin a los ltimos dos ejemplos.

  • main(){print(newList()isList)print(newList()isList)print(newList()isList)print(newList()is!List)//NotodoslosobjetossonStringprint(newList()is!List)//LosStringnosonintprint(newList()isList)//TodaslaslistasdeStringson

    //Listprint(newList()isList)//EscorrectopasardeunaLista

    //unmtodo//queesperaList

    }

    Estos ejemplos resaltan la variante cogenrica de Dart, porque tu puedes correr tu cdigo sin tipos a lo salvaje, el lenguaje Dart te permite tratar con Listas indefinidas como con Listas definidas y pasar de una a otra sin problemas.

    As como se puede ver en el cdigo anterior, los tipos parametrizados de Dar son materializados. Esto significa que los genricos no se pierden en el tiempo de ejecucin, lo que sucede es que Dart realmente conoce que un List es una Lista de Strings.

    Manipulando el DOMRecorrer el DOM con Dart tiene muchas ventajas. Tu puedes usar elementos y

    nodos con los objetos de Dart, puedes iterar a travs de nodos hijos de la misma manera que lo haces con otras collections de Dart.

    Por ejemplo, aqu hay un poco de cdigo para encontrar un elemento especfico y entonces realizar algunas operaciones sobre l y su elemento hijo.#importdart:html

    main(){//Encontrarelelemento.varelemen=document.query(#id)

    //Agregarleeventos.elemen.on.click.add((event)=>print(click))

    //Seteandounatributo.elemen.attributes[name]=valor

    //Agregarunelementohijo.elemen.elements.add(newElement.tag(p))

    //AgregarunaclasedeCSSalelementohijo.elemen.elements.forEach((e)=>e.classes.add(important))

    }Aislaciones

    A pesar de que Dart tiene un nico hilo de procesamiento, tu puedes tomar ventaja de las mquinas multincleo usando aislaciones. Una aislacin provee memoria individual entre diferentes partes de un programa en ejecucin. Cada aislacin puede correr en un hilo separado de procesamiento, administrado por la Dart VM.

    Las aislaciones se comunican mediante el envo de mensajes a travs de puertos. Los mensajes son copiados de manera que una aislacin no puede modificar el estado de

  • los objetos de otra aislacin directamente.Para ilustrar cmo trabaja una aislacin , vamos a construir un simple echo service.

    Primero necesitamos definir echo(), una funcin para correr una aislacin. Cada aislacin tiene un puerto, el cual podemos usar para recibir mensajes. Nosotros vamos a responder un mensaje a travs del puerto de respuesta que nos provee.

    El mtodo main() crea una nueva aislacin para la funcin echo() con spawnFunction(). Usa el SendPort para enviar mensajes a la aislacin, y escucha por alguna respuesta usando then().

    #importdart:isolate

    echo(){port.receive((msj,respuesta)=>respuesta.send(Echo:$msj))

    }

    voidmain(){SendPortsendPort=spawnFuction(echo)sendPort.call(Hola,Dart!).then((response)=>print(respuesta))}

    Y la salida sera:

    Echo: Hola, Dart!

    Los procedimientos han sidos testeados en la Dart VM. In JavaScript, las aislaciones se compilan a web workers de esa manera pueden correr en procesos separados. Las aislaciones estn en permanente actualizacin, as que estn atentos a la documentacin de las mismas.

    Dnde puedo aprender ms?El principal sitio a donde dirigirse por informacin de Dart es dartlang.org.

    Estos son algunos sitios para obtener noticias sobre Dart:

    - Noticias oficiales: news.dartlang.org- Google+:

    - Dart: Structured web apps (Pgina no oficial)- #dartlang (hashtag para encontrar contenido y post en Google+)

    - Twitter:- @dart_lang (Tweets Oficiales de Dart)- #dartlang (hashtag para encontrar tweets de Dart, tambin #dart)

    - Blogs: Dartosphere (Un simple feed de muchos Blogs de Dart)

    Si tu quieres ver como Dart est implementado o tu quieres comenzar como contribuidor de el projecto de Dart, visita:

    code.google.com/dart

    Informacin de contacto:Material Original:Seth Ladd: www.google.com/+SethLaddKathy Walrath: www.google.com/+KathyWalrathTraduccin y Actualizacin:Germn Quirz Bogner: www.google.com/+GermanQuirozBogner