New In Chrome 54
Note: I'm trying something new with the latest video release of New In Chrome, in addition to posting it on YouTube, I've posted a fully annoted version of the script. It includes all of the relevant links I mentioned, and a few other helpful links. Leave your thoughts in the comments and let me know if this is useful to you!
- You can now create your own custom HTML tag with and make re-usable web components with Custom Elements v1.
- It's easier to send messages between open windows or tabs on the same origin with the BroadcastChannel API.
- Media experience get better on Android and foreign fetch is now available as an origin trial.
I'm Pete LePage, let's dive in and see what's new for developers in Chrome 54!
Custom elements v1 #
Complex user interfaces often require a large amount of HTML. Most languages allow developers to create their own components built on top of language primitives to mitigate this kind of verbosity. But until now, creating reusable components on the web has been difficult.
Check out our primer on custom elements to how you can use it to create reusable web components for your site or application.
BroadcastChannel API #
It is not uncommon for desktop users to have multiple windows or tabs open simultaneously, and some sites even encourage this behavior, such as web editors that open documents in their own tabs.
Communicating between those tabs can be difficult. The
BroadcastChannel API is a new one-to-many messaging API between windows, tabs, iframes, web workers, and service workers. It allows scripts to establish named channels to send messages between browsing contexts of the same origin.
BroadcastChannel resources #
Media is an increasingly important part of the browsing experience.
In addition to a user gesture, you can now use
Element.requestFullScreen() to trigger full screen mode after a screen orientation change - and allows you to create richer media experiences that include rotate to full screen.
Foreign fetch #
Imagine if a commonly used origin like an API provider, web font service or other service had the ability to deploy its own service worker.
Instead of always going to the network, the provider could implement their own custom networking logic, and take advantage of a single, authoritative cache instance for storing its responses.
Now, thanks to foreign fetch, which is available in Chrome 54 as an origin trial, it's a reality. Check out Jeffrey's post linked in the comments below!
These are just a few of the changes in Chrome 54 for developers.
Check the description for more details and links the documentation and specifications.
Oh, and don't forget to check out the Chrome Dev Summit, we'll be streaming it on YouTube on November 10th and 11th.
If you want to stay up to date with Chrome and know what's coming, click that Subscribe button up there.
I'm Pete LePage, and as soon as Chrome 55 is released, I'll be right here to tell you -- what's new in Chrome!