Today's release of the Dart SDK and Editor is the first beta release, and contains performance and productivity improvements across the platform. This latest release helps Dart developers automate code evolution, produce smaller JavaScript code and deploy Dart web apps.

The Editor's analysis engine, responsible for reporting warnings and errors, is completely rewritten and is 20% faster at parsing and analyzing. Now, there’s no need to run all the unit tests just to discover a typo. The Dart Editor watches your back as you type.

In addition, Dart Editor makes it easier for developers to manage an evolving app. Some of the new features include:

  • "Rename Library" refactoring
  • "Convert Method to Getter" and "Convert Getter to Method" refactorings
  • "Import Library" quick fix
  • "Create Class" and "Create part" quick fixes

    Code completion has also improved. For example, completion is now camelcase aware. Type iE and Dart Editor finds isEmpty.

    Compiling Dart to JavaScript now results in smaller code. For example, some Dart programs that use reflection and HTML can compile to JavaScript that is 3.7x smaller than previous compilation sizes.

    Dart VM performance has also improved. Compared against the previous release of Dart, DeltaBlue is 33% faster and Tracer is 40% faster. This release also includes full SIMD acceleration in Dart VM.

    Finally, deploying a Dart web app is now easier, with the beta pub deploy command. It creates a directory with your app's code and assets and prepares it for hosting on your favorite web server. You can use this command from Dart Editor or the pub command-line utility.

    That's just the highlights - there are more improvements across the platform. You can read the full release notes for more details and changes. You can download the latest version of Dart Editor, including everything you need for Dart development, from dartlang.org. We look forward to your feedback!

    Dan Rubel
    Productivity Enhancer, Dart Editor team

Labels:

Labels:


Cube Slam is the first large-scale application to use RTCDataChannel, which provides an API similar to WebSocket, but sends the data over the RTCPeerConnection peer-to-peer link. RTCDataChannel sends data securely, and supports an "unreliable" mode for cases where you want high performance but don't care about every single packet making it across the network. In cases like games where low delay often matters more than perfect delivery, this ensures that a single stray packet doesn't slow down the whole app.

RTCDataChannel supports unreliable mode in desktop Chrome today. We're working on implementing the latest WebRTC spec, where we'll use the standard SCTP protocol to support reliable mode as well. WebRTC will also be available on Chrome for Android later this year, and you can try it now by flipping “Enable WebRTC Android” in chrome://flags. Several browsers are currently working on implementing WebRTC, and we’re looking forward to the day when you can have a Cube Slam face-off against your friends on any browser and any device.

To learn more about the tech in Cube Slam, you can check out our technology page and source code. Disable the shields! Destroy the screen! Have fun!

Posted by Justin Uberti, Software Engineer and Channeler of Data

Racer required two things: speedy pings and a consistent experience across screens. We delivered our minimal 2D vector drawings to each device’s HTML5 Canvas using the Paper.js vector library. Paper.js can handle the path math for our custom race track shapes without getting lapped. To eke out all the frame rate possible on such a large array of devices we rendered the cars as image sprites on a DOM layer above the Canvas, while positioning and rotating them using CSS3’s transform: matrix().

Racer’s sound experience is shared across multiple devices using the Web Audio API (available in latest iOS and Android M28 beta). Each device plays one slice of Giorgio Moroder’s symphony of sound—requiring five devices at once to hear his full composition. A constant ping from the server helps synchronize all device speakers allowing them to bump to one solid beat. Not only is the soundtrack divided across devices, it also reacts to each driver’s movements in real time—the accelerating, coasting, careening, and colliding rebalances the presence of every instrument.

To sync your phones or tablets, we use WebSockets, which enables rapid two-way communication between devices via a central server. WebSocket technology is just the start of what multi-device apps of the future might use. We’re looking forward to when WebRTC data channels—the next generation of speedy Web communication—is supported in the stable channel of Chrome for mobile. Then we’ll be able to deliver experiences like Racer with even lower ping times and without bouncing messages via a central server. Racer’s backend was built on the Google Cloud Platform using the same structure and web tools as another recent Chrome Experiment, Roll It.

To get an even more detailed peek under the hood, we just published two new case studies on our HTML5 Rocks site. Our friends at Plan8 wrote one about the sound engineering and Active Theory wrote one about the front-end build. You can also join the team at Active Theory for a Google Developers Live event this Thursday, June 13, 2013 at 3pm GMT for an in depth discussion.

Posted by Pete “Spinout“ LePage, Developer Advocate


Roll It is a three-dimensional (3D) experience, from the swing of your phone’s accelerometer right up to the virtual models rendered on your computer’s HTML5 Canvas. On the phone side, we hooked into browser events like DeviceOrientation and DeviceMotion to detect the speed and direction of a swing. On the computer side we rendered our scene using Three.js and plugged in Physijs to add physics to the ball and environment.

To sync the phone to the computer we employed WebSockets which enable rapid two-way communication between devices via a central server.

For extra stability we built our backend on Google Cloud Platform:
We couldn’t have brought this experiment to life without a great team. The theme for Roll It was composed by Mr. Tim Healey. Legwork Studio developed the interfaces and game environment, and teamed up with Mode Set for the development.

To dig deeper into the technology behind Roll It, check out the HTML5 Rocks Case Study, or join the team for a Google Developers Live event this Friday, June 7, 2013 at 5pm GMT for an in-depth discussion.

Posted by Pete LePage, Developer Advocate and Boardwalk King


You can trigger a rich notification by calling the create method under the chrome.notifications module:

chrome.notifications.create(
 ‘id1’,{   
     type: ‘basic’,
     iconUrl: ‘image1.png’,
     title: ‘Althe Frazon’,
     message: ‘Hi, what's going on tonight?’,
     buttons: [{ title: ‘Call’,
                 iconUrl: ‘call.png’},
               { title: ‘Send Email’,
                 iconUrl: ‘email.png’}],
     priority: 0},
 function() { /* Error checking goes here */}

);



Rich notifications include full-bleed icons and space to convey a headline and short message. Additionally, they enable you to create action buttons and respond to clicks right within your app, empowering your users to do anything they could do within the app’s UI itself.

Apart from the basic notification type shown above, you can use other formats like image to show a preview of an image within the notification or list to coalesce multiple notifications from your app into a single one. For example, a mail app could show multiple unread emails within a single notification using the list type. You can also specify different priorities for notifications that determine how long they stay on the screen before moving into the notification center where they continue to live until dismissed by the app or user. 

The notification center holds all current notifications and can be pulled up at any time from the launcher on ChromeOS or the system tray on Windows. Users can view and clear all of their notifications in the center, and also access settings to control which apps, extensions and websites can send them notifications. 


Notification Center on Windows  

Notification Center on ChromeOS

You can get started with rich notifications in your app or extension by trying out the Notify Test App and taking a look at the documentation on the Chrome developer site. We’d love your feedback so feel free to ask a question on Stack Overflow, start a discussion on our mailing list, or file a bug on our issue tracker. Posted by Justin DeWitt, Software Engineer and Notifications Knight