 Using JavaScript to do complex animations in the browser often looks like stop motion animation. It's janky and can block rendering or input. In Chrome 46, the motion path module changes that. The markup required for responsive images becomes much simpler with client hints and service workers just keep getting better. Let's take a look at what's new in Chrome for developers. Animations in CSS has existed for some time now, but if you wanted to do something a little bit more complex, for example, animate an object along a specific non-linear path, well, you needed to use JavaScript for that. Thankfully, the CSS motion path module changes that. You can now animate objects along an arbitrary path in CSS. And because it's CSS, it doesn't block the browser. The key is the motion path property, which is used to define the path. You can specify the shape you want the object to follow, like a circle, ellipse, or polygon, or you can specify an SVG path. You also need to provide the motion offset property. That defines how far along the path the object is. Put another way, the distance from the start point. You're now ready to start to animate something, but there's one more helpful property you might want to set. Say for example, you're animating a car around a box. When it's time to turn the corner, the car should actually turn the corner, not just start moving sideways. Motion rotation allows you to set the direction that the object is facing. In this case, I'd use an angle, but there are other values you can use. So be sure to check the examples linked in the description below. I've long been a fan of source set and the picture element to serve the right image to the right device, but it can be a little hard. For example, say I wanted to display an image at 50% of the user's viewport and I want to send the right image to each device. My phone has a very different viewport than my laptop, so I need to take that into account. I need to take into account the screen resolution. My laptop has a 2x screen versus my desktop monitor, which is only 1x. And finally, it would be nice to send a JPEG XR to edge browsers, WebP to Chrome, and JPEG to everything else. But that's just too hard. But this becomes much simpler with client hints. Adding the metatag meta-http-equiv-except-ch content equals dpr viewport width width to the document head tells the browser to advertise the device pixel ratio, the layout viewport width, and the intended display width of the resource to the server. The server can then serve the best image, one that is served to the exact needs of the device. That picture element we had earlier becomes much cleaner. Client hints are disabled by default, so you'll need to add the metatag to your page. Check out Ilya's post linked below, including how you can use service workers for resource selection. Speaking of service workers, there are a few new additions and changes here. To protect users, the Cache API is now restricted to HTTPS. Cache.addall is now supported, removing the need for polyfills when dealing with bulk interactions in the cache. Resource timing and user timing are now available in service workers. And the fetch API now supports request.redirect. These are just a few of the new features in Chrome 46 for developers. You can get more details from the links in the description. And please, subscribe to our new Chrome Developers YouTube channel. I'm Pete LePage, and as soon as Chrome 47 is released, I'll be right here to tell you what's new in Chrome.